1536094 - Dynamic module import doesn't work in webextension content scripts

Status: NEW

(WebExtensions :: General, enhancement, P3)

Description

[Jon Coppeard (:jonco)]

From bug 1517546 comment 6:

Hi, maybe I'm doing something wrong, but I'm not able to import a module in a webextension content script via the dynamic import. I also tried this version which works in chrome: https://github.com/otiai10/chrome-extension-es6-import

By trying it myself I got the following errors:
Error: TelemetryStopwatch: key "WEBEXT_CONTENT_SCRIPT_INJECTION_MS" was already initialized ExtensionTelemetry.jsm:106:31
Error: TelemetryStopwatch: key "WEBEXT_CONTENT_SCRIPT_INJECTION_MS_BY_ADDONID" was already initialized ExtensionTelemetry.jsm:110:41
Error: TelemetryStopwatch: requesting elapsed time for nonexisting stopwatch. Histogram: "WEBEXT_CONTENT_SCRIPT_INJECTION_MS", key: "" ExtensionTelemetry.jsm:106:31
Error: TelemetryStopwatch: requesting elapsed time for nonexisting stopwatch. Histogram: "WEBEXT_CONTENT_SCRIPT_INJECTION_MS_BY_ADDONID"

However the provided add-on above does not produce any errors, but still doesn't log anything to the console.

Firefox Developer Edition 66.0b14 (64-Bit), Linux with enabled javascript.options.dynamicImport pref;

Comment 1

[robbendebiene]

Attachment: Webextension to test dynmaic import in content scripts

It would be great if this bug could be fixed, since there is currently no other method to use ES6 modules in content scripts (in contrast to background scripts, option pages etc.).

In addition dynamic import would serve as a good workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=1451545

I've attached a simple extension in order to better test the problem.

Comment 2

[robbendebiene]

While the previous Firefox version did not output any errors Firefox 67.0b1 now outputs the following error message:

Error: No ScriptLoader found for the current context

Comment 3

[Librem Grief]

This doesn't work with background scripts either. All one gets is

SyntaxError: import declarations may only appear at top level of a module

Comment 4

[jacksteamdev]

This bug has made its way on to StackOverflow.

Our bundling tool implements code-splitting and uses dynamic imports for that. Works great in Chrome, but no way to adapt for Firefox.

Comment 5

[jackworks]

For background script, you can use a background page file, then use <script type=module> in it.

But there is no way to use ES Modules for content script. Using static import will throw, dynamic import will throw "No ScriptLoader found for the current context"