Firefox extension compatibility and build support

closes #16
closes #2

.gitignore

@@ -1,3 +1,4 @@
 unpacked-extension
-tako-github-file-tree.zip
-node_modules
+tako-github-file-tree*
+node_modules
+.DS_Store

README.md

@@ -17,3 +17,8 @@ Tako is an inline, expandable file tree with file preview for github. [Get it on
 - [Turn on dev mode for chrome extensions](https://developer.chrome.com/extensions/faq#faq-dev-01)
 - Click "Load unpacked" and select `tako/unpacked-extension`
 - Navigate to any github repository and open dev tools
+
+## Building
+
+- `yarn build:{chrome,firefox}`
+- Drop resulting file `tako-github-file-tree-{chrome,firefox}.zip` onto your browser's extension page

package.json

@@ -8,7 +8,8 @@
     "node": ">=12.14.1"
   },
   "scripts": {
-    "build": "webpack --mode=production",
+    "build:chrome": "webpack --mode=production --env.browser=chrome",
+    "build:firefox": "webpack --mode=production --env.browser=firefox",
     "postinstall": "npm run build > /dev/null && find ./unpacked-extension -type f -not -name 'manifest.json' -delete",
     "start": "webpack --watch --mode=development",
     "lint": "eslint ./src/**/*.js"
@@ -27,8 +28,14 @@
     "manifest_version": 2,
     "permissions": [
       "activeTab",
-      "storage"
+      "storage",
+      "*://*.github.com/*"
     ],
+    "applications": {
+      "gecko": {
+        "id": "[email protected]"
+      }
+    },
     "icons": {
       "16": "icon-16.png",
       "24": "icon-24.png",

src/components/PrependPortal.js

@@ -13,7 +13,6 @@ const PrependPortal = ({ targetSelector, children }) => {
         .insertAdjacentElement('beforebegin', containerElement)
     } catch (error) {
       console.log(error)
-      debugger
     }
 
     return () => {

webpack.config.js

@@ -10,15 +10,20 @@ const pkg = require('./package.json')
 
 const distFolderName = 'unpacked-extension'
 
-module.exports = (_, { mode }) => {
+module.exports = ({ browser } = {}, { mode }) => {
   const isProduction = mode === 'production'
+  const isChrome = browser === 'chrome'
 
   const manifest = {
     ...pkg.extensionManifest,
     version: pkg.version,
     description: pkg.description,
   }
 
+  if (isProduction && isChrome) {
+    delete manifest.applications
+  }
+
   const config = {
     mode,
     devtool: 'inline-source-map',
@@ -87,10 +92,11 @@ module.exports = (_, { mode }) => {
   }
 
   if (isProduction) {
-    config.devtool = false
+    delete config.devtool
+
     config.plugins[config.plugins.length - 1] = new ZipPlugin({
       path: '../',
-      filename: 'tako-github-file-tree.zip',
+      filename: `tako-github-file-tree-${browser}.zip`,
     })
   }