Hi everyone,
I use webpack to build my MV3 extension, and I use es6 import in my source code, the built extension works on Chrome and Edge, but not on Firefox.
It throws the error that my functions are undefined, after debugging, I find all my imported modules are undefined, like the TranslateModal class in the screenshot below
Also there is a bug for content scripts when using MV3:
EDIT:
Note that the debugger in Firefox is sometimes bugged too and doesn’t correctly say the value of the hovered variable/expression. It’s best to use console.log to verify (or write the variable into the console manually during the debugging, but again, it may not work if the variable is “out of scope”).
Check the console for errors.
When I import TranslateModal without .js, the console shows:
Loading script with URI “moz-extension://7ef0701e-0a1c-4722-b85e-33509cc06f04/TranslateModal” was blocked because the file extension is not allowed. _generated_background_page.html
Loading failed for the module with source “moz-extension://7ef0701e-0a1c-4722-b85e-33509cc06f04/TranslateModal”. _generated_background_page.html:5:106
Firefox should probably show an error in about:debugging#/runtime/this-firefox
Thanks juraj and hans
Yeah, the debugger doesn’t show the correct runtime value, console.log shows the modules are actually correct, it is not webpack issue.
I’m not aware of a good solution for using custom elements in content scripts.
Custom elements in content scripts are tricky because of the world boundary. Browser vendors have discussed this issue in the WECG but at the moment there isn’t an obvious path forward for how custom elements should behave across world boundaries.
In order to provide guidance, it would really help if you could share a minimal demo and reproduction steps that show the problem.
Thanks @thusimon. This was really helpful to get a better sense of what was going on. It looks like Firefox isn’t exposing methods of custom elements in content scripts. I’ve opened a bug report for this: https://bugzilla.mozilla.org/show_bug.cgi?id=1871628.