Chrome Extensions Manifest 3 Migration

If we have an existing Manifest 2 Chrome extension and change it to Manifest 3, with a background scripts configuration like this:

  "background": {
    "scripts": [
      "background.js"
    ],
    "persistent": true
  },

Compiling and reloading our extension shows this error.

That error is a result of migrating to the Chrome Extension Manifest version 3.

Extensions API

The Chrome Extensions API has a section on Manifest 3 changes. Background scripts must use service workers now.

• Rename the backgroundscript.js to sw.js to reflect it's function:

• Update webpack config.
  

entry: {
  popup: path.join(__dirname, "src/popup.tsx"),
  content: path.join(__dirname, "src/content.ts"),
  serviceWorker: path.join(__dirname, "src/sw.ts"),
  },

API Unification Changes

Deprecations of brower_actions and page_actions require changes to:

• The manfest.json file
• To our sw.js file.

The browser_action and page_action constructs are no longer valid.

In the manifest, change those to this:

{
  "action": { … }
}

Make change to sw.js code too.

// From this:
chrome.browserAction.onClicked.addListener(tab => { … });
chrome.pageAction.onClicked.addListener(tab => { … });

// To this
chrome.action.onClicked.addListener(tab => { … });

For our small extension we were able to get a clean reload.

Our first attempts to implement our service workers failed

Coming up: Implementing Service Workers for Chrome Extensions using Manifest 3.

JWP2021 Chrome Extension Service Workers