adapt manifest background for firefox

README.md

@@ -39,10 +39,12 @@ All work on SimpleLogin Chrome/Firefox extension happens directly on GitHub.
 
 This project has been tested with Node v20.2.0 and NPM 9.6.6
 
-To run the extension locally, please follow these steps:
 
-- install all dependencies with `npm install`.
-- run `npm start` to generate the `/dist` folder that can be installed into Chrome.
+To run the extension locally, please first install all dependencies with `npm install`.
+
+## Chrome
+
+Run `npm start` to generate the `/dist` folder that can be installed into Chrome.
 
 In case of `Error: error:0308010C:digital envelope routines::unsupported` error, the workaround is to accept OPEN SSL by running this command before running `npm start`
 
@@ -50,11 +52,11 @@ In case of `Error: error:0308010C:digital envelope routines::unsupported` error,
 export NODE_OPTIONS=--openssl-legacy-provider
 ````
 
-On Firefox, it can be done via `web-ext` tool from within the `/dist` folder: 
+## Firefox
 
-```bash 
-( cd dist/ ; web-ext run )
-```
+Run `npm run start:firefox` to generate the `/dist` folder which can then be installed on Firefox, more info on https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Your_first_WebExtension#installing
+
+## Code formatting
 
 The code is formatted using `prettier`, make sure to run it before creating the commit, otherwise the GitHub lint workflow will mark the check as not passing:
 

package.json

@@ -16,10 +16,9 @@
     "build:mac": "cross-env NODE_ENV=production MAC=1 webpack",
     "build-zip": "node scripts/build-zip.js",
     "generate:buildconfig": "node scripts/generateBuildConfig.js",
-    "watch": "npm run build -- --watch",
-    "watch:dev": "cross-env HMR=true npm run build:dev -- --watch",
     "start": "cross-env HMR=true npm run build:dev -- --watch",
-    "start:mac": "cross-env HMR=true MAC=1 npm run build:dev -- --watch"
+    "start:mac": "cross-env HMR=true MAC=1 npm run build:dev -- --watch",
+    "start:firefox": "cross-env HMR=true NODE_ENV=development FIREFOX=1 webpack -- --watch"
   },
   "dependencies": {
     "@fortawesome/fontawesome-svg-core": "^1.2.36",
@@ -62,4 +61,4 @@
     "webpack": "^4.46.0",
     "webpack-cli": "^4.9.2"
   }
-}
+}

src/manifest.json

@@ -18,7 +18,7 @@
     "scripting",
     "tabs"
   ],
-  "host_permissions": [    
+  "host_permissions": [
     "https://*.simplelogin.io/*",
     "http://*/*",
     "https://*/*"
@@ -34,10 +34,7 @@
       "128": "icons/icon_128.png"
     }
   },
-  "background": {
-    "service_worker": "background.js",
-    "type": "module"
-  },
+
   "browser_specific_settings": {
     "gecko": {
       "id": "addon@simplelogin"

webpack.config.js

@@ -116,6 +116,17 @@ const config = {
               jsonContent.browser_specific_settings.gecko.id = geckoId.replace('@', '-beta@');
             }
 
+            if (process.env.FIREFOX) {
+              jsonContent.background = {
+                "scripts": ["background.js"]
+              }
+            } else { // CHROME
+              jsonContent.background = {
+                "service_worker": "background.js",
+                "type": "module"
+              }
+            }
+
             if (process.env.LITE) {
               // Remove "All sites" permissions
               const PERMISSIONS_TO_REMOVE = [
@@ -190,4 +201,4 @@ if (config.mode === 'production') {
   config.devtool="cheap-source-map";
 }
 
-module.exports = config;
+module.exports = config;