How to use browser polyfill for MV3 cross-browser web extension

Add-ons Add-on Support
#1

I’m in the process of migrating an MV2 Firefox extension to MV3 Firefox & Chrome cross-browser extension. The Firefox side of things is working, but on the Chrome side the extension fails to initialise properly and the local storage remains empty when it should contain data for options and searchEngines.

I’m having to use the browser polyfill, because of the following issue:
https://issues.chromium.org/issues/40753031

However, I’m not certain that MV3 is supported by the browser polyfill. The way I tried to get things working is by first importing the browser polyfill and then the main service worker, which is a module with several import statements. For this reason, I cannot use importScripts as shown below:

try {
  self.importScripts('./libs/browser-polyfill.min.js', './scripts/cs_service_worker.js');
} catch (e) {
  console.error(e);
}

Instead, I use the following import statements in chrome_service_worker.js:

import './libs/browser-polyfill.min.js';
import './scripts/cs_service_worker.js';

And the manifest contains:

"background": {
    "service_worker": "chrome_service_worker.js",
    "type": "module"
},

But, as explained earlier, this isn’t working!

1 Like