Transition to Manifest v3

.github/workflows/publish-extension.yml

@@ -28,3 +28,16 @@ jobs:
           license: OSL-3.0
           auth-api-issuer: ${{ secrets.FIREFOX_AUTH_API_ISSUER }}
           auth-api-secret: ${{ secrets.FIREFOX_AUTH_API_SECRET }}
+
+  chrome:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Download assets for release
+        run: gh release download ${{ github.ref }} --pattern "*chrome*" --dir assets
+      - uses: browser-actions/[email protected]
+        with:
+          extension-id: "oocninmajklnpkmenhbfakbjcgahnidk"
+          extension-path: "assets/protoots-chrome.zip"
+          oauth-client-id: ${{ secrets.CHROME_OAUTH_CLIENT_ID }}
+          oauth-client-secret: ${{ secrets.CHROME_OAUTH_CLIENT_SECRET }}
+          oauth-refresh-token: ${{ secrets.CHROME_OAUTH_REFRESH_TOKEN }}

.gitignore

@@ -151,3 +151,4 @@ TODO
 edgecases
 notes
 .firefox-profile
+.chromium-profile

README.md

@@ -26,9 +26,10 @@ Please also take a look at the FAQ below and the [issue list](https://github.com
 
 ## FAQ
 
-### Why does ProToots need permission for all websites?
+## How can I use ProToots?
 
-> The addon needs to determine whether or not the site you are currently browsing is a Mastodon server. For that to work, it requires access to all sites. Otherwise, each existing Mastodon server would have to be explicitly added.
+> In order to use ProToots, you need to click the button of the extension, once you are on your Mastodon page.
+> Once ProToots got the permissions to interact with the page, it's enabled and you can see the pronouns appearing within a second!
 
 ### Why can't I see any ProPlates?
 

package.json

@@ -1,19 +1,25 @@
 {
 	"name": "protoots",
 	"scripts": {
-		"build:scripts": "node scripts/build.mjs",
-		"build:webext": "web-ext build --overwrite-dest --filename protoots-firefox.zip",
-		"start": "run-p -l -r watch:**",
-		"watch:scripts": "node scripts/watch.mjs",
-		"watch:webext": "web-ext run --keep-profile-changes --profile-create-if-missing --firefox-profile=.firefox-profile/",
+		"watch:firefox": "cross-env TARGET=firefox node scripts/watch.mjs",
+		"watch:chrome": "cross-env TARGET=chrome node scripts/watch.mjs",
+		"build:firefox": "cross-env TARGET=firefox node scripts/build.mjs",
+		"build:chrome": "cross-env TARGET=chrome node scripts/build.mjs",
+		"start": "run-p -r watch:firefox webext:firefox",
+		"start:chrome": "run-p -r watch:chrome webext:chrome",
 		"format": "prettier --write --ignore-path .gitignore .",
-		"package": "run-s -l build:**",
 		"archive": "git archive --format zip main -o protoots_source.zip",
+		"package": "run-s build:firefox package:firefox build:chrome package:chrome",
+		"package:firefox": "web-ext build --filename protoots-firefox.zip --overwrite-dest",
+		"package:chrome": "web-ext build --filename protoots-chrome.zip --overwrite-dest",
+		"webext:firefox": "web-ext run",
+		"webext:chrome": "web-ext run --target chromium",
 		"lint": "eslint src/",
 		"test": "uvu tests/"
 	},
 	"devDependencies": {
 		"@sprout2000/esbuild-copy-plugin": "1.1.8",
+		"cross-env": "^7.0.3",
 		"esbuild": "0.17.19",
 		"eslint": "^8.42.0",
 		"eslint-config-prettier": "^8.8.0",
@@ -29,11 +35,17 @@
 		"trailingComma": "all"
 	},
 	"type": "module",
-	"webExt": {
-		"sourceDir": "dist/"
-	},
 	"dependencies": {
 		"sanitize-html": "^2.11.0",
 		"webextension-polyfill": "^0.10.0"
+	},
+	"webExt": {
+		"sourceDir": "dist/",
+		"run": {
+			"firefoxProfile": ".firefox-profile/",
+			"chromiumProfile": ".chromium-profile/",
+			"keepProfileChanges": true,
+			"profileCreateIfMissing": true
+		}
 	}
 }

scripts/build.mjs

@@ -1,5 +1,7 @@
 import * as esbuild from "esbuild";
-import { defaultBuildOptions } from "./shared.mjs";
+import { defaultBuildOptions, writeManifest } from "./shared.mjs";
+
+writeManifest();
 
 await esbuild.build({
 	...defaultBuildOptions,

scripts/manifest.mjs

@@ -0,0 +1,57 @@
+/* eslint-disable */
+const manifest = {
+	manifest_version: 3,
+	name: "ProToots",
+	version: "1.2.1",
+
+	icons: {
+		48: "icons/icon small_size/icon small_size.png",
+		96: "icons/icon small_size/icon small_size.png",
+	},
+
+	description: "puts pronouns next to usernames on mastodon",
+	homepage_url: "https://github.com/ItsVipra/ProToots",
+	permissions: ["storage", "activeTab"],
+	host_permissions: ["https://en.pronouns.page/api/*"],
+
+	action: {
+		default_icon: "icons/icon small_size/icon small_size.png",
+		default_title: "Enable ProToots on this page",
+	},
+	content_scripts: [
+		{
+			matches: ["*://*/*"],
+			js: ["content_scripts/protoots.js"],
+			css: ["styles/proplate.css"],
+			run_at: "document_start",
+		},
+	],
+
+	options_ui: {
+		page: "options/options.html",
+		browser_style: false,
+	},
+
+	browser_specific_settings: {
+		gecko: {
+			id: "[email protected]",
+		},
+	},
+};
+
+const firefoxManifest = {
+	...manifest,
+	background: {
+		scripts: ["background/worker.js"],
+	},
+};
+
+const chromeManifest = {
+	...manifest,
+	background: {
+		service_worker: "background/worker.js",
+		type: "module",
+	},
+};
+
+export { firefoxManifest, chromeManifest };