fix(extension): Upgrade crxjs to 2.0 to add support for firefox

.github/workflows/extension.yml

@@ -15,12 +15,24 @@ jobs:
       - name: Setup
         uses: ./tooling/github/setup
 
-      - name: Build the extension
+      - name: Build the extension (chrome)
         working-directory: apps/browser-extension
-        run: pnpm run build
+        run: pnpm run build --outDir dist-chrome
 
-      - name: Upload Extension Archive
+      - name: Build the extension (firefox)
+        env:
+          VITE_BUILD_FIREFOX: true
+        working-directory: apps/browser-extension
+        run: pnpm run build --outDir dist-firefox
+
+      - name: Upload Extension Archive (chrome)
+        uses: actions/upload-artifact@v4
+        with:
+          name: hoarder-extension-chrome
+          path: apps/browser-extension/dist-chrome/*
+
+      - name: Upload Extension Archive (firefox)
         uses: actions/upload-artifact@v4
         with:
-          name: hoarder-extension
-          path: apps/browser-extension/dist/*
+          name: hoarder-extension-firefox
+          path: apps/browser-extension/dist-firefox/*

apps/browser-extension/manifest.json

@@ -12,7 +12,8 @@
     "default_popup": "index.html"
   },
   "background": {
-    "service_worker": "src/background/background.ts"
+    "service_worker": "src/background/background.ts",
+    "scripts": ["src/background/background.ts"]
   },
   "options_ui": {
     "page": "index.html#options",

apps/browser-extension/package.json

@@ -39,7 +39,7 @@
     "zod": "^3.22.4"
   },
   "devDependencies": {
-    "@crxjs/vite-plugin": "^1.0.14",
+    "@crxjs/vite-plugin": "2.0.0-beta.25",
     "@hoarder/eslint-config": "workspace:^0.2.0",
     "@hoarder/prettier-config": "workspace:^0.1.0",
     "@hoarder/tailwind-config": "workspace:^0.1.0",

apps/browser-extension/src/background/background.ts

@@ -69,9 +69,11 @@ async function handleContextMenuClick(info: chrome.contextMenus.OnClickData) {
       };
     }
     if (newBookmark) {
-      await chrome.storage.session.set({
+      chrome.storage.session.set({
         [NEW_BOOKMARK_REQUEST_KEY_NAME]: newBookmark,
       });
+      // NOTE: Firefox only allows opening context menus if it's triggered by a user action.
+      // awaiting on any promise before calling this function will lose the "user action" context.
       await chrome.action.openPopup();
     }
   }

apps/browser-extension/vite.config.ts

@@ -6,5 +6,11 @@ import manifest from "./manifest.json";
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [react(), crx({ manifest })],
+  plugins: [
+    react(),
+    crx({
+      manifest,
+      browser: process.env.VITE_BUILD_FIREFOX ? "firefox" : "chrome",
+    }),
+  ],
 });