Use preload script as buffer between main and renderer processes

packages/fether-electron/electron-webpack.json

@@ -1,5 +1,6 @@
 {
   "main": {
+    "extraEntries": ["@/app/options/config/preload.js"],
     "webpackConfig": "custom.webpack.additions.js"
   },
   "renderer": {

packages/fether-electron/package.json

@@ -30,7 +30,7 @@
   "scripts": {
     "prebuild": "copyfiles -u 2 \"../fether-react/build/**/*\" static/ && ./scripts/fixElectronBug.sh",
     "build": "electron-webpack",
-    "electron": "cross-env SKIP_PREFLIGHT_CHECK=true electron --enable-sandbox dist/main/main.js",
+    "electron": "electron dist/main/main.js",
     "prepackage": "./scripts/revertElectronBug.sh",
     "package": "electron-builder",
     "prerelease": "./scripts/revertElectronBug.sh",
@@ -60,4 +60,4 @@
     "webpack": "^4.29.1",
     "webpack-build-notifier": "^0.1.30"
   }
-}
+}

packages/fether-electron/src/main/app/options/config/index.js

@@ -87,21 +87,30 @@ const SECURITY_OPTIONS = {
      * and gain access to Node.js and requires the user to sanitise user inputs
      * to reduce the possible XSS attack surface.
      */
-    // FIXME - this must be false. Node.js's `.require` method should not be available in fether-react
-    // nodeIntegration: false, // Must be disabled
-    nodeIntegrationInWorker: false,
-    // contextIsolation: true, // Must be disabled
-    // FIXME - this or an alternative approach needs to be used to isolate access to
-    // Electron/Node.js from the Fether web app
-    // preload: process.cwd() + '/preload.js', // Must be carefully configured
+    nodeIntegration: false, // Must be disabled
+    nodeIntegrationInWorker: false, // Must be disabled
+    /**
+     * Electron security recommends us to set this to `true`. However, we need
+     * some communication between the main process and the renderer process
+     * (via ipcMain and ipcRenderer), so we need to disabled contextIsolation.
+     * https://stackoverflow.com/questions/55164360/with-contextisolation-true-is-it-possible-to-use-ipcrenderer
+     * Currently experimental and may change or be removed in future Electron releases.
+     */
+    contextIsolation: false, // Should be enabled
+    /**
+     * Isolate access to Electron/Node.js from the Fether web app, by creating
+     * a bridge which plays the role of an API between main and renderer
+     * processes.
+     * https://github.com/electron/electron/issues/9920#issuecomment-336757899
+     */
+    preload: path.resolve(__dirname, 'preload.js'),
 
     /**
      * Sandbox the BrowserWindow renderer associated with the window still allowing access to
      * all underlying Electron/Node.js primitives using `remote` or internal IPC
      * Reference: https://doyensec.com/resources/us-17-Carettoni-Electronegativity-A-Study-Of-Electron-Security-wp.pdf
      */
-    // FIXME - this must be true. Node.js's `.require` method should not be available in fether-react
-    // sandbox: true, // Do not set to false. Run electron with `electron --enable-sandbox` to sandbox all BrowserWindow instances
+    sandbox: true, // Do not set to false. Run electron with `electron --enable-sandbox` to sandbox all BrowserWindow instances
     enableRemoteModule: true, // Remote is required in fether-react parityStore.js
     // Enables same origin policy to prevent execution of insecure code. Do not set to false
     webSecurity: true,

packages/fether-electron/src/main/app/options/config/preload.js

@@ -0,0 +1,13 @@
+// Copyright 2015-2019 Parity Technologies (UK) Ltd.
+// This file is part of Parity.
+//
+// SPDX-License-Identifier: BSD-3-Clause
+
+const { ipcRenderer, remote } = require('electron');
+
+// Make the `electron` object available in renderers
+// https://github.com/electron/electron/issues/9920#issuecomment-336757899
+window.electron = {
+  ipcRenderer,
+  remote
+};

packages/fether-react/package.json

@@ -52,7 +52,6 @@
     "file-saver": "^2.0.0",
     "final-form": "^4.8.3",
     "final-form-calculate": "^1.2.1",
-    "is-electron": "^2.1.0",
     "localforage": "^1.7.2",
     "localforage-observable": "^1.4.0",
     "lodash": "^4.17.10",
@@ -84,4 +83,4 @@
     "not ie <= 11",
     "not op_mini all"
   ]
-}
+}

packages/fether-react/src/stores/parityStore.js

@@ -5,7 +5,6 @@
 
 import { action, observable } from 'mobx';
 import Api from '@parity/api';
-import isElectron from 'is-electron';
 import light from '@parity/light.js';
 import { distinctUntilChanged, map } from 'rxjs/operators';
 import store from 'store';
@@ -16,7 +15,8 @@ import LS_PREFIX from './utils/lsPrefix';
 
 const debug = Debug('parityStore');
 
-const electron = isElectron() ? window.require('electron') : null;
+// The preload scripts injects `electron` into `window`
+const electron = window.electron;
 
 const LS_KEY = `${LS_PREFIX}::secureToken`;
 

packages/fether-react/src/utils/withHealth.js

@@ -16,13 +16,13 @@ import {
   switchMap,
   take
 } from 'rxjs/operators';
-import isElectron from 'is-electron';
 import isEqual from 'lodash/isEqual';
 import { peerCount$, syncStatus$, withoutLoading } from '@parity/light.js';
 
 import parityStore from '../stores/parityStore';
 
-const electron = isElectron() ? window.require('electron') : null;
+// The preload scripts injects `electron` into `window`
+const electron = window.electron;
 
 const isApiConnected$ = parityStore.isApiConnected$;
 

yarn.lock

@@ -7716,11 +7716,6 @@ is-dotfile@^1.0.0:
   resolved "https://registry.yarnpkg.com/is-dotfile/-/is-dotfile-1.0.3.tgz#a6a2f32ffd2dfb04f5ca25ecd0f6b83cf798a1e1"
   integrity sha1-pqLzL/0t+wT1yiXs0Pa4PPeYoeE=
 
-is-electron@^2.1.0:
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/is-electron/-/is-electron-2.2.0.tgz#8943084f09e8b731b3a7a0298a7b5d56f6b7eef0"
-  integrity sha512-SpMppC2XR3YdxSzczXReBjqs2zGscWQpBIKqwXYBFic0ERaxNVgwLCHwOLZeESfdJQjX0RDvrJ1lBXX2ij+G1Q==
-
 is-equal-shallow@^0.1.3:
   version "0.1.3"
   resolved "https://registry.yarnpkg.com/is-equal-shallow/-/is-equal-shallow-0.1.3.tgz#2238098fc221de0bcfa5d9eac4c45d638aa1c534"