#14 | Manifest V3

Maluen · Oct 1, 2022 · a2422c3 · a2422c3
1 parent 86d9582
commit a2422c3
Show file tree

Hide file tree

Showing 5 changed files with 120 additions and 107 deletions.
diff --git a/src/background/services/BackgroundRPCService.js b/src/background/services/BackgroundRPCService.js
@@ -1,21 +1,29 @@
 import browser from 'webextension-polyfill';
-
 import RPCService, { CONTEXT } from '../../common/services/RPCService';
+import { makeStartable } from '../../common/utils';
 
 class BackgroundRPCService extends RPCService {
   constructor() {
     super(CONTEXT.background);
+
+    this.listenForMessagesStartable.init();
   }
 
   listenForMessages() {
+    this.listenForMessagesStartable.start();
+  }
+
+  listenForMessagesStartable = makeStartable(({ startedPromise }) => {
     // listen to all the contents
-    browser.runtime.onMessage.addListener((message, sender) => {
+    browser.runtime.onMessage.addListener(async (message, sender) => {
+      await startedPromise;
+      await this.readyPromise; // also wait for the other services to start (or they won't be able to handle the rpc calls)
       this.handleIncomingMessage({
         ...message,
         tabId: sender.tab.id,
       });
     });
-  }
+  });
 
   sendDown(message) {
     if (typeof message.tabId === 'undefined' || message.tabId === null) {

diff --git a/src/background/services/ShortcutsService.js b/src/background/services/ShortcutsService.js
@@ -13,7 +13,7 @@ class ShortcutsService {
     await this.listenForExtensionCommands.start();
   }
 
-  listenForExtensionCommands = makeStartable(async ({ startedPromise }) => {
+  listenForExtensionCommands = makeStartable(({ startedPromise }) => {
     browser.commands.onCommand.addListener(async (command) => {
       await startedPromise;
       if (command === 'medium-create-gist') {

diff --git a/src/common/services/RPCService.js b/src/common/services/RPCService.js
@@ -42,7 +42,10 @@ class RPCService {
     this.requestHandlers = {}; // <topic, function>
   }
 
-  start() {
+  start(services, { readyPromise }) {
+    this.services = services;
+    this.readyPromise = readyPromise;
+
     this.listenForMessages();
   }
 

diff --git a/src/common/utils.js b/src/common/utils.js
@@ -1,35 +1,5 @@
 import config from './config';
 
-const identity = x => x;
-
-function generalTemplate(calculateValue = identity, transformResult = identity) {
-  return (strings, ...keys) => {
-    const result = strings[0] + keys.reduce((currentResult, key, i) => {
-      const value = calculateValue(key);
-      return currentResult + value + (strings[i + 1] || '');
-    }, '');
-    return transformResult(result);
-  };
-}
-
-const encoderEl = document.createElement('div');
-function encodeHTML(html) {
-  encoderEl.innerText = html;
-  return encoderEl.innerHTML;
-}
-
-const parserEl = document.createElement('div');
-export const parseHTML = generalTemplate(encodeHTML, elementOuterHTML => {
-  parserEl.innerHTML = elementOuterHTML;
-  return parserEl.firstElementChild;
-});
-
-export function injectCSS(css) {
-  const style = document.createElement('style');
-  style.innerHTML = css;
-  document.head.appendChild(style);
-}
-
 export function waitForEl(selector) {
   return new Promise((resolve) => {
     let checkInterval;
@@ -55,6 +25,11 @@ export function namespace(...args) {
 export function createServices(array) {
   const services = {};
 
+  let readyPromiseDefer;
+  const readyPromise = new Promise((resolve, reject) => {
+    readyPromiseDefer = { resolve, reject };
+  });
+
   array.forEach(info => {
     const [serviceName, ServiceClass] = info;
     services[serviceName] = new ServiceClass();
@@ -64,8 +39,9 @@ export function createServices(array) {
     for (let i = 0; i < array.length; i++) {
       const info = array[i];
       const [serviceName] = info;
-      await services[serviceName].start(services);
+      await services[serviceName].start(services, { readyPromise });
     }
+    readyPromiseDefer.resolve();
   };
 
   return { services, start };
@@ -112,4 +88,4 @@ export function makeStartable(fn) {
       return initPromise;
     },
   };
-}
+}
diff --git a/src/manifest.js b/src/manifest.js
@@ -1,75 +1,101 @@
 var config = require('./common/config');
 
-module.exports = (browser, version) => ({
-  "key": (browser === 'chrome')
-    ? "MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAhUUr0Z4y8DxD5WIezuYeGW3zDZkvGXST+uviv4jtXwkNVZI5XTUrs/pfYoYsOKdnrxkE47/mI+TiumUj7buB1pC+qeWYjVEshDD5Wum6J44RhXmAo7eb1e3u+IG0BmFvQOO+ENtRxIacZ/M8gexGRIlVWJKuRtcLREc7EkwxtWN58fPrWcYsuXfO3NDEkvrSz7hCCNgeVf/y0MKIz7ZRje8Afb1cRa2PtVAFJ2KUFikzghNFyAY8DVmXXZzrvUDbkeKxA/ja2+5TePhVhKBE+DpFGNUBhb1bEi+pl7ysssxFxjdwiW5/9q58JJeh1Mcu1lnoGIVQTspcd5fbioMNNQIDAQAB"
-    : undefined,
-  "manifest_version": 2,
-  minimum_chrome_version: (browser === 'chrome') ? "34" : undefined,
-  applications: (browser === 'firefox') ? {
-    "gecko": {
-      "id": config.app.ids.firefox,
-      "strict_min_version": "50.0"
-    }
-  } : undefined,
-  "name": "Code Medium",
-  version,
-  "description": "Extends the Medium writer interface to quickly create and edit Github Gists, without having to leave the editor.",
-  "icons": {
-    "48": "assets/icon.png",
-    "128": "assets/icon.png"
-  },
-  "author": "Manuel Dell'Elce",
-  "short_name": "code-medium",
-  "background": {
-    "page": "background/background.html",
-    "persistent": (browser === 'firefox')
-      ? undefined // firefox only supports persistent and complains when it's set explicitly
-      : true,
-  },
-  "browser_action": {
-    "default_icon": {
-      "19": "assets/icon.png",
-      "38": "assets/icon.png"
-    }
-  },
-  "content_scripts": [
-    {
-      "matches": [
-        "https://medium.com/**"
-      ],
-      "js": [
-        "content/content.js"
-      ],
-      "css": [
-        "content/content.css"
-      ],
-      "run_at": "document_idle"
+module.exports = (browser, version) => {
+  const CHROME = browser === 'chrome';
+  const MANIFESTV3 = CHROME;
+  const HOST_PERMISSIONS = [
+    "https://github.com/*",
+    "https://gist.github.com/*",
+  ];
+  return {
+    "key": CHROME
+      ? "MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAhUUr0Z4y8DxD5WIezuYeGW3zDZkvGXST+uviv4jtXwkNVZI5XTUrs/pfYoYsOKdnrxkE47/mI+TiumUj7buB1pC+qeWYjVEshDD5Wum6J44RhXmAo7eb1e3u+IG0BmFvQOO+ENtRxIacZ/M8gexGRIlVWJKuRtcLREc7EkwxtWN58fPrWcYsuXfO3NDEkvrSz7hCCNgeVf/y0MKIz7ZRje8Afb1cRa2PtVAFJ2KUFikzghNFyAY8DVmXXZzrvUDbkeKxA/ja2+5TePhVhKBE+DpFGNUBhb1bEi+pl7ysssxFxjdwiW5/9q58JJeh1Mcu1lnoGIVQTspcd5fbioMNNQIDAQAB"
+      : undefined,
+    "manifest_version": MANIFESTV3 ? 3 : 2,
+    minimum_chrome_version: CHROME ? (
+      MANIFESTV3 ? "102" : "34"
+    ) : undefined,
+    applications: (browser === 'firefox') ? {
+      "gecko": {
+        "id": config.app.ids.firefox,
+        "strict_min_version": "50.0"
+      }
+    } : undefined,
+    "name": "Code Medium",
+    version,
+    "description": "Extends the Medium writer interface to quickly create and edit Github Gists, without having to leave the editor.",
+    "icons": {
+      "48": "assets/icon.png",
+      "128": "assets/icon.png"
+    },
+    "author": "Manuel Dell'Elce",
+    "short_name": "code-medium",
+    "background": {
+      ...(MANIFESTV3 ? {
+        "service_worker": "background/background.js"
+      } : {
+        "page": "background/background.html",
+        "persistent": (browser === 'firefox')
+          ? undefined // firefox only supports persistent and complains when it's set explicitly
+          : true,
+      }),
+    },
+    [MANIFESTV3 ? "action" : "browser_action"]: {
+      "default_icon": {
+        "19": "assets/icon.png",
+        "38": "assets/icon.png"
+      }
     },
-    {
-      "matches": [
-        "https://medium.com/media/*"
-      ],
-      "js": [
-        "content/content_iframe.js"
-      ],
-      "all_frames": true,
-      "run_at": "document_idle"
-    }
-  ],
-  "web_accessible_resources": ["app/*.*"],
-  "commands": {
-    'medium-create-gist': {
-      "suggested_key": {
-        "default": "Alt+Shift+0",
+    "content_scripts": [
+      {
+        "matches": [
+          "https://medium.com/**"
+        ],
+        "js": [
+          "content/content.js"
+        ],
+        "css": [
+          "content/content.css"
+        ],
+        "run_at": "document_idle"
+      },
+      {
+        "matches": [
+          "https://medium.com/media/*"
+        ],
+        "js": [
+          "content/content_iframe.js"
+        ],
+        "all_frames": true,
+        "run_at": "document_idle"
+      }
+    ],
+    "web_accessible_resources": [
+      ...(MANIFESTV3 ? [
+        {
+          "resources": ["app/*.*"],
+          "matches": ["https://medium.com/*"],
+        }
+      ] : [
+        "app/*.*"
+      ])
+    ],
+    "commands": {
+      'medium-create-gist': {
+        "suggested_key": {
+          "default": "Alt+Shift+0",
+        },
+        "description": 'Create a Gist in the Medium Editor',
       },
-      "description": 'Create a Gist in the Medium Editor',
     },
-  },
-  "permissions": [
-    "identity",
-    "storage",
-    "https://github.com/*",
-    "https://gist.github.com/*"
-  ]
-});
+
+    "permissions": [
+      "identity",
+      "storage",
+      ...(!MANIFESTV3 ? HOST_PERMISSIONS : []),
+    ],
+    ...(MANIFESTV3 ? {
+      "host_permissions": HOST_PERMISSIONS,
+    } : {}),
+  };
+};