Merge pull request #402 from nudibranchrecords/fix/electron-fixes

Upgrading electron and related packages
nudibranchrecords · Nov 12, 2020 · ca67b3f · ca67b3f
2 parents 520689e + af0a652
commit ca67b3f
Show file tree

Hide file tree

Showing 5 changed files with 1,794 additions and 1,264 deletions.
diff --git a/config/webpack.custom.config.js b/config/webpack.custom.config.js
@@ -1,6 +1,7 @@
 const path = require('path')
 const CopyPlugin = require('copy-webpack-plugin')
 const { CleanWebpackPlugin } = require('clean-webpack-plugin')
+const { merge } = require('webpack-merge')
 
 // Should mirror electron/renderer/globalVars.js
 const globalDepNames = [
@@ -17,29 +18,42 @@ const copyPatterns = globalDepNames.map(name => ({
   to: staticGlobalVarsPath,
 }))
 
-const config = {
-  module: {
-    rules: [
-      {
-        test: /\.icon\.txt$/,
-        use: 'svg-inline-loader?classPrefix',
-      },
+const config = config => {
+  config = merge(config, {
+    module: {
+      rules: [
+        {
+          test: /\.icon\.txt$/,
+          use: 'svg-inline-loader?classPrefix',
+        },
+      ],
+    },
+    plugins: [
+      // Clear out static/globalVars for each build
+      new CleanWebpackPlugin({
+        cleanOnceBeforeBuildPatterns: [`${staticGlobalVarsPath}/**/*`],
+      }),
+      // Copy global dependency files to be included externally in the build
+      new CopyPlugin([
+        {
+          from: 'src/electron/renderer/globalVars.js',
+          to: `${staticGlobalVarsPath}/index.js`,
+        },
+        ...copyPatterns,
+      ]),
     ],
-  },
-  plugins: [
-    // Clear out static/globalVars for each build
-    new CleanWebpackPlugin({
-      cleanOnceBeforeBuildPatterns: [`${staticGlobalVarsPath}/**/*`],
-    }),
-    // Copy global dependency files to be included externally in the build
-    new CopyPlugin([
-      {
-        from: 'src/electron/renderer/globalVars.js',
-        to: `${staticGlobalVarsPath}/index.js`,
-      },
-      ...copyPatterns,
-    ]),
-  ],
+  })
+
+  // By default, all dependencies are added as externals. This causes all sorts of issues with React and co
+  // https://github.com/electron-userland/electron-webpack/issues/275#issuecomment-725641081
+  config.externals = [
+    // These are the only externals needed, as they all use the file system in some way
+    'chokidar',
+    'try-require',
+    'glslify',
+  ]
+
+  return config
 }
 
 module.exports = config
diff --git a/package.json b/package.json
@@ -121,12 +121,12 @@
     "cross-env": "^5.2.0",
     "css-loader": "^0.28.7",
     "deep-freeze": "^0.0.1",
-    "electron": "^7.2.4",
+    "electron": "^10.1.5",
     "electron-builder": "^22.2.0",
     "electron-debug": "^1.4.0",
-    "electron-devtools-installer": "^2.2.4",
+    "electron-devtools-installer": "^3.1.1",
     "electron-log": "^2.2.14",
-    "electron-webpack": "2.6.1",
+    "electron-webpack": "^2.8.2",
     "eslint": "^6.1.0",
     "eslint-config-standard": "^6.2.1",
     "eslint-config-standard-react": "^4.2.0",
@@ -152,6 +152,7 @@
     "tape-watch": "^2.3.0",
     "webpack": "^4.41.5",
     "webpack-cli": "^3.2.3",
-    "webpack-dev-server": "^3.1.14"
+    "webpack-dev-server": "^3.1.14",
+    "webpack-merge": "^5.4.0"
   }
 }
diff --git a/src/electron/main/mainWindow.js b/src/electron/main/mainWindow.js
@@ -23,6 +23,7 @@ export const createMainWindow = () => {
   mainWindow = new BrowserWindow({
     fullscreenable: true,
     webPreferences: {
+      enableRemoteModule: true,
       nodeIntegration: true,
       nativeWindowOpen: true,
       webSecurity: false,
@@ -90,13 +91,6 @@ export const createMainWindow = () => {
     mainWindow.webContents.send('window-show')
   })
 
-  mainWindow.webContents.send('devtools-opened', () => {
-    mainWindow.focus()
-    setImmediate(() => {
-      mainWindow.focus()
-    })
-  })
-
   // Open anchor tag links in new browser window
   mainWindow.webContents.on('will-navigate', (event, url) => {
     // Don't do anything if "localhost" as this is most likely
@@ -107,9 +101,9 @@ export const createMainWindow = () => {
     shell.openExternal(url)
   })
 
-  setTimeout(() => {
-    mainWindow.webContents.send('args', argv)
-  }, 2000)
+  // setTimeout(() => {
+  //   mainWindow.webContents.send('args', argv)
+  // }, 2000)
 
   return mainWindow
 }
diff --git a/src/windows.js b/src/windows.js
@@ -3,10 +3,10 @@ import { remote, ipcRenderer } from 'electron'
 import { displaysListUpdate } from './store/displays/actions'
 let store
 
-const { screen } = remote
+const eScreen = remote.screen
 
 const updateDisplays = () => {
-  const displays = screen.getAllDisplays()
+  const displays = eScreen.getAllDisplays()
   ipcRenderer.send('update-displays', displays)
   store.dispatch(displaysListUpdate(displays))
 }
@@ -16,12 +16,12 @@ export const initiateScreens = (injectedStore) => {
   updateDisplays()
 }
 
-screen.on('display-added', updateDisplays)
-screen.on('display-removed', updateDisplays)
-screen.on('display-metrics-changed', updateDisplays)
+eScreen.on('display-added', updateDisplays)
+eScreen.on('display-removed', updateDisplays)
+eScreen.on('display-metrics-changed', updateDisplays)
 
 export const sendOutput = (index) => {
-  const display = screen.getAllDisplays()[index]
+  const display = eScreen.getAllDisplays()[index]
 
   let outputWin = window.open('', 'modal')