feat: extension identification improvements (hoppscotch#136)

Co-authored-by: Andrew Bastin <[email protected]>

.prettierrc.js

@@ -0,0 +1,3 @@
+module.exports = {
+  semi: false,
+};

manifest.json

@@ -1,7 +1,7 @@
 {
   "manifest_version": 2,
   "name": "Hoppscotch Browser Extension",
-  "version": "0.23",
+  "version": "0.24",
   "description": "Provides more capabilities for Hoppscotch (https://hoppscotch.io)",
   "icons": {
     "16": "icons/icon-16x16.png",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "hoppscotch-extension",
-  "version": "0.23.0",
+  "version": "0.24.0",
   "description": "Provides more features to the Hoppscotch webapp (https://hoppscotch.io/)",
   "scripts": {
     "clean": "rimraf dist",

src/contentScript.ts

@@ -1,51 +1,99 @@
 const fs = require("fs")
 
 const hookContent = fs.readFileSync(__dirname + "/hookContent.js", {
-  encoding: "utf-8"
-});
+  encoding: "utf-8",
+})
 
-window.addEventListener('message', ev => {
+const hookContentInvalidOrigin = fs.readFileSync(
+  __dirname + "/hookContentInvalidOrigin.js",
+  {
+    encoding: "utf-8",
+  }
+)
+
+type HookType = "valid_origin" | "unknown-origin"
+
+function getOriginList(): Promise<string[]> {
+  return new Promise((resolve, reject) => {
+    chrome.storage.sync.get((items) => {
+      let originList: string[] = JSON.parse(items["originList"])
+
+      resolve(originList)
+    })
+  })
+}
+
+/**
+ * when an origin is added or removed,reevaluate the hook
+ */
+chrome.storage.onChanged.addListener((changes, _areaName) => {
+  if (changes.originList && changes.originList.newValue) {
+    injectHoppExtensionHook()
+  }
+})
+
+async function injectHoppExtensionHook() {
+  let originList = await getOriginList()
+
+  let url = new URL(window.location.href)
+
+  const script = document.createElement("script")
+  script.textContent = originList.includes(url.origin)
+    ? hookContent
+    : hookContentInvalidOrigin
+  document.documentElement.appendChild(script)
+  script.parentNode.removeChild(script)
+}
+
+window.addEventListener("message", (ev) => {
   if (ev.source !== window || !ev.data) {
-    return;
+    return
   }
 
-  if (ev.data.type === '__POSTWOMAN_EXTENSION_REQUEST__') {
-    chrome.runtime.sendMessage({
-      messageType: "send-req",
-      data: ev.data.config
-    }, (message) => {
-      if (message.data.error) {
-        window.postMessage({
-          type: '__POSTWOMAN_EXTENSION_ERROR__',
-          error: message.data.error
-        }, '*');
-      } else {
-        window.postMessage({
-          type: '__POSTWOMAN_EXTENSION_RESPONSE__',
-          response: message.data.response,
-          isBinary: message.data.isBinary
-        }, '*');
+  if (ev.data.type === "__POSTWOMAN_EXTENSION_REQUEST__") {
+    chrome.runtime.sendMessage(
+      {
+        messageType: "send-req",
+        data: ev.data.config,
+      },
+      (message) => {
+        if (message.data.error) {
+          window.postMessage(
+            {
+              type: "__POSTWOMAN_EXTENSION_ERROR__",
+              error: message.data.error,
+            },
+            "*"
+          )
+        } else {
+          window.postMessage(
+            {
+              type: "__POSTWOMAN_EXTENSION_RESPONSE__",
+              response: message.data.response,
+              isBinary: message.data.isBinary,
+            },
+            "*"
+          )
+        }
       }
-    })
-  } else if (ev.data.type === '__POSTWOMAN_EXTENSION_CANCEL__') {
+    )
+  } else if (ev.data.type === "__POSTWOMAN_EXTENSION_CANCEL__") {
     chrome.runtime.sendMessage({
-      messageType: "cancel-req"
-    });
+      messageType: "cancel-req",
+    })
   }
-});
-
-const VERSION = { major: 0, minor: 23 };
+})
 
-const script = document.createElement('script');
-script.textContent = hookContent;
+const VERSION = { major: 0, minor: 24 }
 
-document.documentElement.appendChild(script);
-script.parentNode.removeChild(script);
+console.log(
+  `Connected to Hoppscotch Browser Extension v${VERSION.major}.${VERSION.minor}`
+)
 
-console.log(`Connected to Hoppscotch Browser Extension v${VERSION.major}.${VERSION.minor}`);
+injectHoppExtensionHook()
 
 chrome.runtime.onMessage.addListener((msg, _sender, sendResponse) => {
-  if (msg.action === '__POSTWOMAN_EXTENSION_PING__') {
-    sendResponse(true);
+  if (msg.action === "__POSTWOMAN_EXTENSION_PING__") {
+    sendResponse(true)
   }
-});
+})

src/defaultOrigins.ts

@@ -1,3 +1 @@
-export const DEFAULT_ORIGIN_LIST = [
-  "https://hoppscotch.io"
-];
+export const DEFAULT_ORIGIN_LIST = ["https://hoppscotch.io"]