migrate to v3

package.json

@@ -13,9 +13,7 @@
     "prettier:write": "npm run prettier -- --write",
     "build": "npm run build:scss && cross-env NODE_ENV=production webpack --hide-modules",
     "package": "npm run build:scss && cross-env NODE_ENV=production RELEASE=true webpack --hide-modules",
-    "build:dev": "npm run build:scss && cross-env NODE_ENV=development webpack --hide-modules",
-    "build-zip": "npm run package && node scripts/build-zip.js",
-    "watch:dev": "cross-env HMR=true npm run build:dev -- --watch"
+    "build-zip": "npm run package && node scripts/build-zip.js"
   },
   "husky": {
     "hooks": {

src/background.js

@@ -5,8 +5,6 @@ import { getSanitizedUrl } from './utils/urls';
 import { removeScriptTags } from './utils/base';
 import { defaultColor } from './utils/color';
 
-global.browser = require('webextension-polyfill');
-
 const askLogin = (tab, iconClick = false) => {
   chrome.tabs.sendMessage(tab.id, { action: types.SHOW_SIDE_BAR, sub_action: types.SHOW_LOGIN, iconClick: iconClick, data: [] }, response => {
     console.log(response);
@@ -23,7 +21,7 @@ const getNotes = (tab, actionType, iconClick = false) => {
       });
     })
     .catch(() => {
-      // Login is required here when action is show side bar.
+      // Login is required here when action is show sidebar.
       if (actionType === types.SHOW_SIDE_BAR) {
         askLogin(tab, iconClick);
       }
@@ -62,7 +60,7 @@ chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
   }
 });
 
-chrome.browserAction.onClicked.addListener(tab => {
+chrome.action.onClicked.addListener(tab => {
   getNotes(tab, types.SHOW_SIDE_BAR, true);
 });
 

src/manifest.json

@@ -2,18 +2,17 @@
   "name": "SaltyNote",
   "description": "An extension that helps you make annotations for any web page",
   "version": "0.1.0",
-  "manifest_version": 2,
+  "manifest_version": 3,
   "icons": {
     "48": "icons/icon.png",
     "128": "icons/icon.png",
     "144": "icons/icon.png"
   },
-  "browser_action": {
+  "action": {
     "default_title": "SaltyNote"
   },
   "background": {
-    "scripts": ["background.js"],
-    "persistent": false
+    "service_worker": "background.js"
   },
   "options_page": "options/options.html",
   "permissions": ["activeTab", "contextMenus", "tabs", "storage"],
@@ -40,5 +39,14 @@
       "description": "Open Options Page"
     }
   },
-  "web_accessible_resources": ["icons/dog.jpg", "icons/icon.png"]
+  "web_accessible_resources": [
+    {
+      "resources": ["icons/dog.jpg", "icons/icon.png"],
+      "matches": ["<all_urls>"]
+    }
+  ],
+  "content_security_policy": {
+    "extension_pages": "script-src 'self'; object-src 'self'",
+    "sandbox": "sandbox allow-scripts; script-src 'self' 'https://*.saltynote.com'; object-src 'self'"
+  }
 }

webpack.config.js

@@ -92,12 +92,6 @@ const config = {
         transform: content => {
           const jsonContent = JSON.parse(content);
           jsonContent.version = version;
-
-          if (config.mode === 'development') {
-            jsonContent.content_security_policy = "script-src 'self' 'unsafe-eval'; object-src 'self'";
-          } else if (config.mode === 'production') {
-            jsonContent.content_security_policy = "script-src 'self' https://*.saltynote.com; object-src 'self'";
-          }
           if (process.env.RELEASE !== 'true' && proEnv.manifest_key) {
             jsonContent.key = proEnv.manifest_key;
           }