Merge branch 'upgrade-to-electron-11'

9 files changed, 121 insertions, 64 deletions

diff --git a/CHANGELOG.md b/CHANGELOG.md
index f4c1fbc73e..ddc1e969d7 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -45,6 +45,7 @@ Line wrap the file at 100 chars.                                              Th
 - Bundle a list of API addresses to use instead of assuming that the primary address can be reached.
 - Rename CLI subcommand `mullvad relay set relay` to `mullvad relay set hostname`.
 - Upgrade OpenVPN from 2.4.9 to 2.5.0.
+- Upgrade Electron from 8.5.2 to Electron 11.0.2.
 
 #### Android
 - Remove the Quit button.
diff --git a/gui/package-lock.json b/gui/package-lock.json
index a6e668f9d8..3bf408039c 100644
--- a/gui/package-lock.json
+++ b/gui/package-lock.json
@@ -325,9 +325,9 @@
       },
       "dependencies": {
         "debug": {
-          "version": "4.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-4.2.0.tgz",
-          "integrity": "sha512-IX2ncY78vDTjZMFUdmsvIRFY2Cf4FnD0wRs+nQwJU8Lu99/tPFdb0VybiiMTPe3I6rQmwsqQqRBvxU+bZ/I8sg==",
+          "version": "4.3.1",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.1.tgz",
+          "integrity": "sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==",
           "dev": true,
           "requires": {
             "ms": "2.1.2"
@@ -2140,9 +2140,9 @@
       "dev": true
     },
     "boolean": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/boolean/-/boolean-3.0.1.tgz",
-      "integrity": "sha512-HRZPIjPcbwAVQvOTxR4YE3o8Xs98NqbbL1iEZDCz7CL8ql0Lt5iOyJFxfnAB0oFs8Oh02F/lLlg30Mexv46LjA==",
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/boolean/-/boolean-3.0.2.tgz",
+      "integrity": "sha512-RwywHlpCRc3/Wh81MiCKun4ydaIFyW5Ea6JbL6sRCVx5q5irDw7pMXBUFYF/jArQ6YrG36q0kpovc9P/Kd3I4g==",
       "dev": true,
       "optional": true
     },
@@ -3146,9 +3146,9 @@
       }
     },
     "core-js": {
-      "version": "3.6.5",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.6.5.tgz",
-      "integrity": "sha512-vZVEEwZoIsI+vPEuoF9Iqf5H7/M3eeQqWlQnYa8FSKKePuYTf5MWnxb5SDAzCa60b3JBRS5g9b+Dq7b1y/RCrA==",
+      "version": "3.7.0",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.7.0.tgz",
+      "integrity": "sha512-NwS7fI5M5B85EwpWuIwJN4i/fbisQUwLwiSNUWeXlkAZ0sbBjLEvLvFLf1uzAUV66PcEPt4xCGCmOZSxVf3xzA==",
       "dev": true,
       "optional": true
     },
@@ -3796,9 +3796,9 @@
       }
     },
     "electron": {
-      "version": "8.5.2",
-      "resolved": "https://registry.npmjs.org/electron/-/electron-8.5.2.tgz",
-      "integrity": "sha512-VU+zZnmCzxoZ5UfBg2UGVm+nyxlNlQOQkotMLfk7FCtnkIOhX+sosl618OCxUWjOvPc+Mpg5MEkEmxPU5ziW4Q==",
+      "version": "11.0.2",
+      "resolved": "https://registry.npmjs.org/electron/-/electron-11.0.2.tgz",
+      "integrity": "sha512-FTYtCm0oj8B8EJhp99BQSW2bd40xYEG/txMj+W3Ed0CNu5zVIIXb5WIrhXLvhcasN5LKy9nkmSZ+u220lCaARg==",
       "dev": true,
       "requires": {
         "@electron/get": "^1.0.1",
@@ -3807,9 +3807,9 @@
       },
       "dependencies": {
         "@types/node": {
-          "version": "12.12.67",
-          "resolved": "https://registry.npmjs.org/@types/node/-/node-12.12.67.tgz",
-          "integrity": "sha512-R48tgL2izApf+9rYNH+3RBMbRpPeW3N8f0I9HMhggeq4UXwBDqumJ14SDs4ctTMhG11pIOduZ4z3QWGOiMc9Vg==",
+          "version": "12.19.6",
+          "resolved": "https://registry.npmjs.org/@types/node/-/node-12.19.6.tgz",
+          "integrity": "sha512-U2VopDdmBoYBmtm8Rz340mvvSz34VgX/K9+XCuckvcLGMkt3rbMX8soqFOikIPlPBc5lmw8By9NUK7bEFSBFlQ==",
           "dev": true
         }
       }
@@ -4103,12 +4103,6 @@
           "requires": {
             "glob": "^7.1.3"
           }
-        },
-        "semver": {
-          "version": "7.3.2",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-7.3.2.tgz",
-          "integrity": "sha512-OrOb32TeeambH6UrhtShmF7CRDqhL6/5XpPNp2DuRH6+9QLw/orhp72j87v8Qa1ScDkvrrBNpZcDejAirJmfXQ==",
-          "dev": true
         }
       }
     },
@@ -6022,15 +6016,6 @@
         "roarr": "^2.15.3",
         "semver": "^7.3.2",
         "serialize-error": "^7.0.1"
-      },
-      "dependencies": {
-        "semver": {
-          "version": "7.3.2",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-7.3.2.tgz",
-          "integrity": "sha512-OrOb32TeeambH6UrhtShmF7CRDqhL6/5XpPNp2DuRH6+9QLw/orhp72j87v8Qa1ScDkvrrBNpZcDejAirJmfXQ==",
-          "dev": true,
-          "optional": true
-        }
       }
     },
     "global-dirs": {
@@ -9076,9 +9061,9 @@
       }
     },
     "needle": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/needle/-/needle-2.4.1.tgz",
-      "integrity": "sha512-x/gi6ijr4B7fwl6WYL9FwlCvRQKGlUNvnceho8wxkwXqN8jvVmmmATTmZPRRG7b/yC1eode26C2HO9jl78Du9g==",
+      "version": "2.5.2",
+      "resolved": "https://registry.npmjs.org/needle/-/needle-2.5.2.tgz",
+      "integrity": "sha512-LbRIwS9BfkPvNwNHlsA41Q29kL2L/6VaOJ0qisM5lLWsTV3nP15abO5ITL6L81zqFhzjRKDAYjpcBcwM0AVvLQ==",
       "optional": true,
       "requires": {
         "debug": "^3.2.6",
@@ -9087,9 +9072,9 @@
       },
       "dependencies": {
         "debug": {
-          "version": "3.2.6",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz",
-          "integrity": "sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==",
+          "version": "3.2.7",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.7.tgz",
+          "integrity": "sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==",
           "optional": true,
           "requires": {
             "ms": "^2.1.1"
@@ -9163,21 +9148,21 @@
       }
     },
     "node-pre-gyp": {
-      "version": "0.12.0",
-      "resolved": "https://registry.npmjs.org/node-pre-gyp/-/node-pre-gyp-0.12.0.tgz",
-      "integrity": "sha512-4KghwV8vH5k+g2ylT+sLTjy5wmUOb9vPhnM8NHvRf9dHmnW/CndrFXy2aRPaPST6dugXSdHXfeaHQm77PIz/1A==",
+      "version": "0.16.0",
+      "resolved": "https://registry.npmjs.org/node-pre-gyp/-/node-pre-gyp-0.16.0.tgz",
+      "integrity": "sha512-4efGA+X/YXAHLi1hN8KaPrILULaUn2nWecFrn1k2I+99HpoyvcOGEbtcOxpDiUwPF2ZANMJDh32qwOUPenuR1g==",
       "optional": true,
       "requires": {
         "detect-libc": "^1.0.2",
-        "mkdirp": "^0.5.1",
-        "needle": "^2.2.1",
+        "mkdirp": "^0.5.3",
+        "needle": "^2.5.0",
         "nopt": "^4.0.1",
         "npm-packlist": "^1.1.6",
         "npmlog": "^4.0.2",
         "rc": "^1.2.7",
         "rimraf": "^2.6.1",
         "semver": "^5.3.0",
-        "tar": "^4"
+        "tar": "^4.4.2"
       },
       "dependencies": {
         "mkdirp": {
@@ -9302,12 +9287,12 @@
       }
     },
     "nseventmonitor": {
-      "version": "0.0.18",
-      "resolved": "https://registry.npmjs.org/nseventmonitor/-/nseventmonitor-0.0.18.tgz",
-      "integrity": "sha512-HIjt/87ogh95D+89AuaD7k359YVOY3M3NAjtY49RdN11Bo3EGkaDtMe6XMWs0e0BO68OzoOna1O0doxu++v81Q==",
+      "version": "0.0.19",
+      "resolved": "https://registry.npmjs.org/nseventmonitor/-/nseventmonitor-0.0.19.tgz",
+      "integrity": "sha512-bucQmCLoMF1LqX/2IspJamFf0nLnX5hJvJG2GZpSONRE8QFphUWs3U6Hp4KSP96+8oIKiav20UvgeWGIRs091w==",
       "optional": true,
       "requires": {
-        "node-pre-gyp": "^0.12.0"
+        "node-pre-gyp": "^0.16.0"
       }
     },
     "nth-check": {
@@ -11528,6 +11513,18 @@
       "integrity": "sha1-PpNdfd1zYxuXZZlW1VEo6HtQhKM=",
       "dev": true
     },
+    "spa-server": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/spa-server/-/spa-server-1.0.0.tgz",
+      "integrity": "sha1-JTL6vI8SJKSLaFuS47HzOoYV2II=",
+      "dev": true,
+      "requires": {
+        "connect": "^3.3.5",
+        "mime": "^1.3.4",
+        "serve-static": "^1.9.2",
+        "xtend": "^4.0.0"
+      }
+    },
     "sparkles": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/sparkles/-/sparkles-1.0.1.tgz",
@@ -12006,9 +12003,9 @@
       },
       "dependencies": {
         "debug": {
-          "version": "4.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-4.2.0.tgz",
-          "integrity": "sha512-IX2ncY78vDTjZMFUdmsvIRFY2Cf4FnD0wRs+nQwJU8Lu99/tPFdb0VybiiMTPe3I6rQmwsqQqRBvxU+bZ/I8sg==",
+          "version": "4.3.1",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.1.tgz",
+          "integrity": "sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==",
           "dev": true,
           "requires": {
             "ms": "2.1.2"
diff --git a/gui/package.json b/gui/package.json
index 6c39684850..b99e0aa5ea 100644
--- a/gui/package.json
+++ b/gui/package.json
@@ -35,7 +35,7 @@
     "uuid": "^3.0.1"
   },
   "optionalDependencies": {
-    "nseventmonitor": "^0.0.18"
+    "nseventmonitor": "^0.0.19"
   },
   "devDependencies": {
     "@types/chai": "^4.1.7",
@@ -71,7 +71,7 @@
     "chai-as-promised": "^7.1.1",
     "chai-spies": "^1.0.0",
     "cross-env": "^5.1.3",
-    "electron": "^8.5.2",
+    "electron": "^11.0.2",
     "electron-builder": "^22.8.0",
     "electron-devtools-installer": "^3.1.1",
     "electron-mocha": "^9.0.1",
@@ -91,6 +91,7 @@
     "rimraf": "^2.7.1",
     "semver": "^7.3.2",
     "sinon": "^7.1.1",
+    "spa-server": "^1.0.0",
     "ts-node": "^8.3.0",
     "tsc-watch": "^4.2.9",
     "typescript": "^4.0.3"
diff --git a/gui/src/main/index.ts b/gui/src/main/index.ts
index 7f693e2fdf..73a1656782 100644
--- a/gui/src/main/index.ts
+++ b/gui/src/main/index.ts
@@ -1,5 +1,15 @@
 import { execFile } from 'child_process';
-import { app, BrowserWindow, ipcMain, Menu, nativeImage, screen, shell, Tray } from 'electron';
+import {
+  app,
+  BrowserWindow,
+  ipcMain,
+  Menu,
+  nativeImage,
+  screen,
+  session,
+  shell,
+  Tray,
+} from 'electron';
 import log from 'electron-log';
 import mkdirp from 'mkdirp';
 import moment from 'moment';
@@ -213,10 +223,6 @@ class ApplicationMain {
 
     this.guiSettings.load();
 
-    // The default value has previously been false but will be changed to true in Electron 9. The
-    // false value has been deprecated in Electron 8. This can be removed when Electron 9 is used.
-    app.allowRendererProcessReuse = true;
-
     app.on('activate', this.onActivate);
     app.on('ready', this.onReady);
     app.on('window-all-closed', () => app.quit());
@@ -345,6 +351,11 @@ class ApplicationMain {
   }
 
   private onReady = async () => {
+    // There's no option that prevents Electron from fetching spellcheck dictionaries from
+    // Chromium's CDN and passing a non-resolving URL is the only known way to prevent it from
+    // fetching.  https://github.com/electron/electron/issues/22995
+    session.defaultSession.setSpellCheckerDictionaryDownloadURL('https://00.00/');
+
     this.updateCurrentLocale();
 
     this.daemonRpc.addConnectionObserver(
@@ -423,7 +434,13 @@ class ApplicationMain {
 
       const filePath = path.resolve(path.join(__dirname, '../renderer/index.html'));
       try {
-        await this.windowController?.window.loadFile(filePath);
+        if (process.env.NODE_ENV === 'development') {
+          await this.windowController?.window.loadURL(
+            'http://localhost:8080/src/renderer/index.html',
+          );
+        } else {
+          await this.windowController?.window.loadFile(filePath);
+        }
       } catch (error) {
         log.error(`Failed to load index file: ${error.message}`);
       }
@@ -1397,6 +1414,9 @@ class ApplicationMain {
       webPreferences: {
         nodeIntegration: true,
         devTools: process.env.NODE_ENV === 'development',
+        // TODO: Remove use of remote
+        enableRemoteModule: true,
+        spellcheck: false,
       },
     };
 
diff --git a/gui/src/renderer/containers/SupportPage.tsx b/gui/src/renderer/containers/SupportPage.tsx
index 7cb72b9c72..d77ec3e421 100644
--- a/gui/src/renderer/containers/SupportPage.tsx
+++ b/gui/src/renderer/containers/SupportPage.tsx
@@ -2,6 +2,7 @@ import { shell } from 'electron';
 import { connect } from 'react-redux';
 import { RouteComponentProps, withRouter } from 'react-router';
 import { bindActionCreators } from 'redux';
+import consumePromise from '../../shared/promise';
 import Support from '../components/Support';
 import { collectProblemReport, sendProblemReport } from '../lib/problem-report';
 import { IReduxState, ReduxDispatch } from '../redux/store';
@@ -23,7 +24,7 @@ const mapDispatchToProps = (dispatch: ReduxDispatch, props: RouteComponentProps)
       props.history.goBack();
     },
     viewLog(path: string) {
-      shell.openItem(path);
+      consumePromise(shell.openPath(path));
     },
     saveReportForm,
     clearReportForm,
diff --git a/gui/tasks/dev-server.js b/gui/tasks/dev-server.js
new file mode 100644
index 0000000000..067174ab17
--- /dev/null
+++ b/gui/tasks/dev-server.js
@@ -0,0 +1,40 @@
+const serverFactory = require('spa-server');
+
+function startWebServer(done) {
+  serverFactory
+    .create({
+      path: './build',
+      port: 8080,
+      middleware: [correctWorkingDirectory],
+    })
+    .start(done);
+}
+
+function correctWorkingDirectory(request, response, next) {
+  if (request.url === '/src/renderer/index.js') {
+    const write = response.write.bind(response);
+    response.write = (data) => {
+      let s = data.toString();
+
+      // Add code that changes to the correct working directory after `"use strict";` which is
+      // located on the first line of the source file.
+      const index = s.indexOf('\n');
+
+      if (index !== -1) {
+        const insertionIndex = index + 1;
+        s =
+          s.slice(0, insertionIndex) +
+          'try{process.chdir("build/src/renderer")}catch(e){}\n' +
+          s.slice(insertionIndex);
+      }
+
+      write(s);
+    };
+  }
+
+  next();
+}
+
+startWebServer.displayName = 'start-dev-server';
+
+exports.start = startWebServer;
diff --git a/gui/tasks/scripts.js b/gui/tasks/scripts.js
index 5ee33a9071..37dcfa9355 100644
--- a/gui/tasks/scripts.js
+++ b/gui/tasks/scripts.js
@@ -8,7 +8,7 @@ function makeWatchCompiler(onFirstSuccess) {
   const compileScripts = function () {
     const watch = new TscWatchClient();
     watch.on('first_success', onFirstSuccess);
-    watch.start('--noClear', '--sourceMap', '--incremental', '--project', '.');
+    watch.start('--noClear', '--inlineSourceMap', '--incremental', '--project', '.');
     return watch.tsc;
   };
   compileScripts.displayName = 'compile-scripts-watch';
diff --git a/gui/tasks/watch.js b/gui/tasks/watch.js
index 00d00e4990..fa4d301603 100644
--- a/gui/tasks/watch.js
+++ b/gui/tasks/watch.js
@@ -1,6 +1,7 @@
 const { parallel, series, watch } = require('gulp');
 const electron = require('./electron');
 const hotreload = require('./hotreload');
+const devServer = require('./dev-server');
 const assets = require('./assets');
 const scripts = require('./scripts');
 
@@ -47,6 +48,7 @@ exports.start = series(
     // set up hotreload, run electron and begin watching filesystem for changes, after the first
     // successful build
     series(
+      devServer.start,
       hotreload.start,
       electron.start,
       parallel(
diff --git a/gui/test/setup/main.js b/gui/test/setup/main.js
index df773dc7b2..dd458a30b6 100644
--- a/gui/test/setup/main.js
+++ b/gui/test/setup/main.js
@@ -1,9 +1,4 @@
-const { app } = require('electron');
 const log = require('electron-log');
 
 log.transports.console.level = false;
 log.transports.file.level = false;
-
-// The default value has previously been false but will be changed to true in Electron 9. The
-// false value has been deprecated in Electron 8. This can be removed when Electron 9 is used.
-app.allowRendererProcessReuse = true;