Feature/middle click open in new independent window (#1895)

* ^ Update electron 15.x

* ^ Update electron 15.x > 16.x

This fixes the issue of white flash on new window shown before event `ready-to-show`
even window created with option `backgroundColor`

* * Update `createWindow` to pass options via an object instead of positional arguments

* * Implement windows opening with new window won't be closed when "parent" window closed

* * Update new window opened via middle click to be shown immediately

Matches current behaviour and better user experience (due to elimination of delay from the click to window appearance)

* * Update new window button to show new window faster

* * Only focus on new window on event `ready-to-show` if new window is not already shown

* Update src/main/index.js

Co-authored-by: ChunkyProgrammer <78101139+ChunkyProgrammer@users.noreply.github.com>

Co-authored-by: ChunkyProgrammer <78101139+ChunkyProgrammer@users.noreply.github.com>

package.json

@@ -108,7 +108,7 @@
     "babel-loader": "^8.2.2",
     "copy-webpack-plugin": "^9.0.1",
     "css-loader": "5.2.6",
-    "electron": "^15.3.3",
+    "electron": "^16.0.8",
     "electron-builder": "^22.11.7",
     "electron-builder-squirrel-windows": "^22.13.1",
     "electron-debug": "^3.2.0",

src/main/index.js

@@ -171,7 +171,7 @@ function runApp() {
     }
   }
 
-  async function createWindow(replaceMainWindow = true) {
+  async function createWindow({ replaceMainWindow = true, windowStartupUrl = null, showWindowNow = false } = { }) {
     /**
      * Initial window options
      */
@@ -195,7 +195,7 @@ function runApp() {
       Object.assign(
         {
           // It will be shown later when ready via `ready-to-show` event
-          show: false
+          show: showWindowNow
         },
         commonBrowserWindowOptions
       )
@@ -204,16 +204,14 @@ function runApp() {
     // region Ensure child windows use same options since electron 14
 
     // https://github.com/electron/electron/blob/14-x-y/docs/api/window-open.md#native-window-example
-    newWindow.webContents.setWindowOpenHandler(() => {
+    newWindow.webContents.setWindowOpenHandler((details) => {
+      createWindow({
+        replaceMainWindow: false,
+        showWindowNow: true,
+        windowStartupUrl: details.url
+      })
       return {
-        action: 'allow',
-        overrideBrowserWindowOptions: Object.assign(
-          {
-            // It should be visible on click
-            show: true
-          },
-          commonBrowserWindowOptions
-        )
+        action: 'deny'
       }
     })
 
@@ -257,10 +255,18 @@ function runApp() {
 
     // load root file/url
     if (isDev) {
-      newWindow.loadURL('http://localhost:9080')
+      let devStartupURL = 'http://localhost:9080'
+      if (windowStartupUrl != null) {
+        devStartupURL = windowStartupUrl
+      }
+      newWindow.loadURL(devStartupURL)
+    } else {
+      if (windowStartupUrl != null) {
+        newWindow.loadURL(windowStartupUrl)
       } else {
         /* eslint-disable-next-line */
         newWindow.loadFile(`${__dirname}/index.html`)
+      }
 
       global.__static = path
         .join(__dirname, '/static')
@@ -269,6 +275,8 @@ function runApp() {
 
     // Show when loaded
     newWindow.once('ready-to-show', () => {
+      if (newWindow.isVisible()) { return }
+
       newWindow.show()
       newWindow.focus()
     })
@@ -381,7 +389,10 @@ function runApp() {
   })
 
   ipcMain.on(IpcChannels.CREATE_NEW_WINDOW, () => {
-    createWindow(false)
+    createWindow({
+      replaceMainWindow: false,
+      showWindowNow: true
+    })
   })
 
   ipcMain.on(IpcChannels.OPEN_IN_EXTERNAL_PLAYER, (_, payload) => {

yarn.lock

@@ -3543,10 +3543,10 @@ electron-to-chromium@^1.3.830:
   resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.836.tgz#823cb9c98f28c64c673920f1c90ea3826596eaf9"
   integrity sha512-Ney3pHOJBWkG/AqYjrW0hr2AUCsao+2uvq9HUlRP8OlpSdk/zOHOUJP7eu0icDvePC9DlgffuelP4TnOJmMRUg==
 
-electron@^15.3.3:
-  version "15.3.3"
-  resolved "https://registry.yarnpkg.com/electron/-/electron-15.3.3.tgz#e66c6c6fbcd74641dbfafe5e101228d2b7734c7b"
-  integrity sha512-tr4UaMosN6+s8vSbx6OxqRXDTTCBjjJkmDMv0b0sg8f+cRFQeY0u7xYbULpXS4B1+hHJmdh7Nz40Qpv0bJXa6w==
+electron@^16.0.8:
+  version "16.0.8"
+  resolved "https://registry.yarnpkg.com/electron/-/electron-16.0.8.tgz#7ebd3e23c4883c239f53d8b7af1100f455ac8a02"
+  integrity sha512-znTVkl8LaGcPNdfc6SRr+6LYg2GtSCKXln/nW/PC+urBfAFnOYIuDock8QyGVFfzr5PuAa+g8YQQAboHV77D7g==
   dependencies:
     "@electron/get" "^1.13.0"
     "@types/node" "^14.6.2"