✨ Add manifest v3 support & deps cleanup

.gitignore

@@ -12,7 +12,6 @@
 # Icon must end with two \r
 Icon
 
-
 # Thumbnails
 ._*
 
@@ -231,4 +230,5 @@ $RECYCLE.BIN/
 
 # Custom rules (everything added below won't be overriden by 'Generate .gitignore File' if you use 'Update' option)
 
-releases
+releases/
+manifest.json

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ttv-lol-pro",
-  "version": "2.0.0-beta.0",
+  "version": "2.0.0-beta.1",
   "description": "TTV LOL PRO removes livestream ads from Twitch",
   "@parcel/bundler-default": {
     "minBundles": 10000000,
@@ -18,10 +18,12 @@
   },
   "browserslist": "> 0.5%, last 2 versions, not dead",
   "scripts": {
-    "dev": "parcel src/manifest.json --host localhost --target webext-dev --no-hmr",
+    "dev:firefox": "cpy src/manifest.firefox.json . --rename=manifest.json && parcel src/manifest.json --host localhost --target webext-dev --no-hmr",
+    "dev:chromium": "cpy src/manifest.chromium.json . --rename=manifest.json && parcel src/manifest.json --host localhost --target webext-dev --no-hmr",
     "lint": "prettier --check ./src",
     "lint:fix": "prettier --write ./src",
-    "build": "parcel build src/manifest.json --target webext-prod --no-source-maps"
+    "build:firefox": "cpy src/manifest.firefox.json . --rename=manifest.json && parcel build src/manifest.json --target webext-prod --no-source-maps",
+    "build:chromium": "cpy src/manifest.chromium.json . --rename=manifest.json && parcel build src/manifest.json --target webext-prod --no-source-maps"
   },
   "keywords": [
     "twitch",
@@ -39,10 +41,9 @@
   "devDependencies": {
     "@parcel/config-webextension": "^2.8.3",
     "@types/chrome": "^0.0.235",
-    "@types/react": "^18.2.6",
     "@types/semver-compare": "^1.0.1",
     "@types/webextension-polyfill": "^0.10.0",
-    "amazon-ivs-player": "^1.18.0",
+    "cpy-cli": "^4.2.0",
     "parcel": "^2.8.3",
     "postcss": "^8.4.23",
     "prettier": "^2.8.8",

src/background/background.ts

@@ -1,5 +1,5 @@
 import browser from "webextension-polyfill";
-import isChrome from "../common/ts/isChrome";
+import isChromium from "../common/ts/isChromium";
 import onBeforeRequest from "./handlers/onBeforeRequest";
 import onHeadersReceived from "./handlers/onHeadersReceived";
 import onProxyRequest from "./handlers/onProxyRequest";
@@ -7,7 +7,7 @@ import onStartupStoreCleanup from "./handlers/onStartupStoreCleanup";
 import onStartupUpdateCheck from "./handlers/onStartupUpdateCheck";
 import updateProxySettings from "./updateProxySettings";
 
-console.info("🚀 Background script running.");
+console.info("🚀 Background script loaded.");
 
 // Cleanup the session-related data in the store on startup.
 browser.runtime.onStartup.addListener(onStartupStoreCleanup);
@@ -15,7 +15,7 @@ browser.runtime.onStartup.addListener(onStartupStoreCleanup);
 // Check for updates on startup.
 browser.runtime.onStartup.addListener(onStartupUpdateCheck);
 
-if (!isChrome) {
+if (!isChromium) {
   // Map channel names to video-weaver URLs.
   browser.webRequest.onBeforeRequest.addListener(
     onBeforeRequest,

src/background/updateProxySettings.ts

@@ -1,11 +1,11 @@
-import isChrome from "../common/ts/isChrome";
+import isChromium from "../common/ts/isChromium";
 import store from "../store";
 
 export default function updateProxySettings() {
   if (store.readyState !== "complete")
     return store.addEventListener("load", updateProxySettings);
 
-  if (isChrome) {
+  if (isChromium) {
     let proxies = store.state.servers.map(host => `PROXY ${host}`).join(";");
     if (proxies.length === 0) proxies = "DIRECT";
     const config = {

src/common/ts/isChrome.ts

@@ -1,2 +0,0 @@
-// @ts-ignore
-export default !!chrome.app;

src/common/ts/isChromium.ts

@@ -0,0 +1,3 @@
+import browser from "webextension-polyfill";
+
+export default browser.runtime.getURL("index.html").startsWith("chrome");

src/manifest.chromium.json

@@ -0,0 +1,41 @@
+{
+  "manifest_version": 3,
+  "name": "TTV LOL PRO",
+  "description": "TTV LOL PRO removes livestream ads from Twitch.",
+  "version": "2.0.0",
+  "background": {
+    "service_worker": "background/background.ts",
+    "type": "module"
+  },
+  "action": {
+    "default_icon": {
+      "128": "images/brand/icon.png"
+    },
+    "default_title": "TTV LOL PRO",
+    "default_popup": "popup/menu.html"
+  },
+  "content_scripts": [
+    {
+      "matches": ["https://www.twitch.tv/*", "https://m.twitch.tv/*"],
+      "js": ["content/content.ts"],
+      "run_at": "document_start"
+    }
+  ],
+  "icons": {
+    "128": "images/brand/icon.png"
+  },
+  "options_ui": {
+    "browser_style": false,
+    "open_in_tab": true,
+    "page": "options/page.html"
+  },
+  "permissions": ["proxy", "storage"],
+  "host_permissions": [
+    "https://*.ttvnw.net/*",
+    "https://www.twitch.tv/*",
+    "https://m.twitch.tv/*",
+    "https://player.twitch.tv/*",
+    "https://embed.twitch.tv/*"
+  ],
+  "update_url": "https://younesaassila.github.io/ttv-lol-pro/updates.xml"
+}

src/parcel.d.ts

@@ -1,5 +0,0 @@
-// From https://parceljs.org/features/dependency-resolution/#configuring-other-tools
-declare module "url:*" {
-  const value: string;
-  export default value;
-}