I have a working mv3 chrome extension. When the content script receives a message it dispatches a custom event. The custom event is handled by a class that is injected in the target page window
.
Inject the class:
window.test = new Test()
Dispatch event (in content script):
document.dispatchEvent(
new CustomEvent('myevent', { detail: data })
)
Handle the event (in Test
class):
return new Promise(resolve => {
const listener = (event: any) => {
document.removeEventListener('myevent', listener)
console.log('resolving', event.detail)
resolve(event.detail)
}
document.addEventListener('myevent', listener)
})
In chrome I have no problems, but in firefox the promise doesn’t get resolved. I get the ‘resolving’ print statement, but then the error occurs.
Any idea what could be causing the issue? Is it some firefox setting? Could it be my manifest?
Chrome
"permissions": ["tabs", "background", "storage"],
"action": {
"default_popup": "index.html",
"default_icon": "icon_128.png"
},
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": ["content.js"],
"run_at": "document_start"
}
],
"background": {
"service_worker": "background.js",
"type": "module"
},
Firefox
"permissions": ["tabs", "scripting", "storage"],
"action": {
"default_popup": "index.html",
"default_icon": "icon_128.png"
},
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": ["content.js"]
}
],
"background": {
"scripts": ["background.js"],
"type": "module"
},