Introduce simple auto-reload mechanism for the extension

dvdvdmt · Jul 14, 2024 · 42e445d · 42e445d
1 parent fdec7c8
commit 42e445d
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 11 deletions.
diff --git a/src/background.ts b/src/background.ts
@@ -24,13 +24,25 @@ let tabIdToBeActivated: undefined | number
 let testHelper: undefined | BackgroundTestHelper
 if (E2E) {
   testHelper = new BackgroundTestHelper()
+  testHelper.initContentScript()
+  testHelper.registerListeners()
+}
+
+if (DEVELOPMENT) {
+  chrome.tabs.onCreated.addListener(async (tab) => {
+    const url = tab.url || tab.pendingUrl
+    const isReloadUrl = url === 'https://popuptabswitcher/reload'
+    if (isReloadUrl) {
+      log(`[Reload extension]`)
+      chrome.tabs.remove(tab.id!)
+      chrome.runtime.reload()
+    }
+  })
 }
 
 initListeners()
 
 function initListeners() {
-  testHelper?.initContentScript()
-  testHelper?.registerListeners()
   /** NOTE:
    *  The order of events on tab creation in a new window:
    *  1. Tab created

diff --git a/webpack.config.js b/webpack.config.js
@@ -2,6 +2,7 @@ const path = require('path')
 const webpack = require('webpack')
 const CopyWebpackPlugin = require('copy-webpack-plugin')
 const deepmerge = require('deepmerge')
+const {exec} = require('child_process')
 
 const buildProdDir = path.join(__dirname, 'build-prod')
 const buildDevDir = path.join(__dirname, 'build-dev')
@@ -114,7 +115,7 @@ module.exports = (env) => {
             const e2eProps = {
               key: developmentProps.key,
             }
-            return JSON.stringify(
+            const updatedManifest = JSON.stringify(
               deepmerge.all([
                 original,
                 env.development ? developmentProps : {},
@@ -123,6 +124,7 @@ module.exports = (env) => {
               null,
               2
             )
+            return updatedManifest
           },
         },
       },
@@ -160,14 +162,13 @@ module.exports = (env) => {
         PRODUCTION: 'false',
         DEVELOPMENT: 'true',
       }),
-      // env.WEBPACK_WATCH
-      //   ? new ChromeExtensionReloader({
-      //       entries: {
-      //         contentScript: 'content',
-      //         background: 'background',
-      //       },
-      //     })
-      //   : () => {},
+      {
+        apply: (compiler) => {
+          compiler.hooks.afterEmit.tap('ReloadExtensionPlugin', () => {
+            exec('open "https://popuptabswitcher/reload"')
+          })
+        },
+      },
     ]
   } else if (env.e2e) {
     conf.mode = 'production'