feat: chrome extension migrate to manifest v3

packages/bruno-chrome-extension/js/background.js

@@ -1,54 +1,52 @@
-(function () {
-  let currentTab = {
-    id: null,
-    url: null,
-  };
+let currentTab = {
+  id: null,
+  url: null,
+};
 
-  const getExtensionId = () => {
-    const matches = chrome.runtime.getURL('x').match(/.*\/\/(.*)\/x$/);
-    if (matches) {
-      return matches[1];
-    }
+const getExtensionId = () => {
+  const matches = chrome.runtime.getURL('x').match(/.*\/\/(.*)\/x$/);
+  if (matches) {
+    return matches[1];
+  }
 
-    return chrome.runtime.id;
-  };
+  return chrome.runtime.id;
+};
 
-  // Create a new tab for the extension
-  function createNewTab() {
-    chrome.tabs.create({ url: 'index.html' }, function (tab) {
-      currentTab = {
-        id: tab.id,
-        url: tab.url
-      };
+// Create a new tab for the extension
+function createNewTab() {
+  chrome.tabs.create({ url: 'index.html' }, function (tab) {
+    currentTab = {
+      id: tab.id,
+      url: tab.url
+    };
+  });
+}
+
+// Focus on the open extension tab
+function focusTab(tabId) {
+  var updateProperties = { "active": true };
+  chrome.tabs.update(tabId, updateProperties, function (tab) { });
+}
+
+// Open the extension tab when the extension icon is clicked
+chrome.action.onClicked.addListener(function (tab) {
+  if (!currentTab || !currentTab.id) {
+    createNewTab();
+  } else {
+    chrome.tabs.get(currentTab.id, function (tab) {
+      console.log(chrome.runtime.id, tab.url);
+      if (tab && tab.url && tab.url.includes(getExtensionId())) {
+        focusTab(currentTab.id);
+      } else {
+        createNewTab();
+      }
     });
   }
+});
 
-  // Focus on the open extension tab
-  function focusTab(tabId) {
-    var updateProperties = { "active": true };
-    chrome.tabs.update(tabId, updateProperties, function (tab) { });
+// When a tab is closed, check if it is the extension tab that was closed, and unset currentTabId
+chrome.tabs.onRemoved.addListener(function (tabId) {
+  if (tabId === currentTab.id) {
+    currentTab = {};
   }
-
-  // Open the extension tab when the extension icon is clicked
-  chrome.browserAction.onClicked.addListener(function (tab) {
-    if (!currentTab || !currentTab.id) {
-      createNewTab();
-    } else {
-      chrome.tabs.get(currentTab.id, function (tab) {
-        console.log(chrome.runtime.id, tab.url);
-        if (tab && tab.url && tab.url.includes(getExtensionId())) {
-          focusTab(currentTab.id);
-        } else {
-          createNewTab();
-        }
-      });
-    }
-  });
-
-  // When a tab is closed, check if it is the extension tab that was closed, and unset currentTabId
-  chrome.tabs.onRemoved.addListener(function (tabId) {
-    if (tabId === currentTab.id) {
-      currentTab = {};
-    }
-  });
-})();
+});

packages/bruno-chrome-extension/manifest.json

@@ -1,5 +1,5 @@
 {
-  "manifest_version": 2,
+  "manifest_version": 3,
   "version": "0.1.0",
   "name": "Bruno API Client",
   "short_name": "Bruno",
@@ -10,17 +10,17 @@
     "128": "assets/images/logo-128x128.png"
   },
   "background": {
-    "scripts": [
-      "js/background.js"
-    ]
+    "service_worker": "js/background.js"
   },
-  "browser_action": {
+  "action": {
     "default_icon": "assets/images/logo-128x128.png"
   },
   "permissions": [
-      "http://*/",
-      "https://*/",
       "tabs",
       "storage"
+  ],
+  "host_permissions": [
+    "http://*/",
+    "https://*/"
   ]
 }

scripts/create-chrome-extension.sh

@@ -17,7 +17,10 @@ cp -r packages/bruno-chrome-extension/* chrome-extension
 
 # Filenames starting with "_" are reserved for use by the system
 mv chrome-extension/_next chrome-extension/next
-sed -i 's@/_next/@/next/@g' chrome-extension/**.html
+sed -i'' -e 's@/_next/@/next/@g' chrome-extension/**.html
 
 # Remove sourcemaps
 find chrome-extension -name '*.map' -type f -delete
+
+# Compress the chrome-extension directory into a zip file
+zip -r bruno.zip chrome-extension