I am trying to use a service worker file which is also an ESM module.

The register method has an extra argument accepting an options object which has a type field whose valid values seem to be classic and module, but when I use:

navigator.serviceWorker.register('worker.js', { type: 'module' });
// `worker.mjs` doesn't work either
// The file exists in both cases!

I get an unspecified DOMException with no message in Chrome.

I figured what the valid values for type were by reading the spec, specifically this:

.html#workertype

It seems to me like my code is valid.

As a sanity check, I also tried to explicity set type to classic and the service worker registration then goes through fine. If I set it to an invalid value, I get a TypeError telling me so, so it's not like the browser is not yet aware of type: module. It is treated as a special case, it just throws a DOMException with no message.

Am I using the type field correctly? Is it still too early and it is not supported in browsers?

I am trying to use a service worker file which is also an ESM module.

The register method has an extra argument accepting an options object which has a type field whose valid values seem to be classic and module, but when I use:

navigator.serviceWorker.register('worker.js', { type: 'module' });
// `worker.mjs` doesn't work either
// The file exists in both cases!

I get an unspecified DOMException with no message in Chrome.

I figured what the valid values for type were by reading the spec, specifically this:

https://html.spec.whatwg/multipage/workers.html#workertype

It seems to me like my code is valid.

As a sanity check, I also tried to explicity set type to classic and the service worker registration then goes through fine. If I set it to an invalid value, I get a TypeError telling me so, so it's not like the browser is not yet aware of type: module. It is treated as a special case, it just throws a DOMException with no message.

Am I using the type field correctly? Is it still too early and it is not supported in browsers?

• javascript
• service-worker

Share Improve this question Follow asked Jul 9, 2019 at 13:24 Tomáš HübelbauerTomáš Hübelbauer 10.8k1717 gold badges7474 silver badges141141 bronze badges 3

• 1 .mjs is a Node.js thing, not an ESM thing outside Node.js. (And Node.js now has type. Hopefully .mjs will die a death...) – T.J. Crowder Commented Jul 9, 2019 at 13:27
• What version of Chrome? Do the contents of your service worker script make any difference? – T.J. Crowder Commented Jul 9, 2019 at 13:28
• Duplicate of stackoverflow./questions/44118600 – Tobias Buschor Commented Apr 12, 2021 at 7:09

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 5

This is dumb! Chrome will print just DOMException into the console (not even expansible) when logging the error object and Object.keys on that object instance returns [], but when I specifically print e.message the culprit is revealed:

type 'module' in RegistrationOptions is not implemented yet.See https://crbug./824647 for details.

Not amused by Chrome.

On browsers, bare names can't be used to identify modules unless you also have a module map (aka import map, this link has much more info) that maps the bare name to a module.

If worker.js is in the same location as the page loading it, then:

navigator.serviceWorker.register('./worker.js', { type: 'module' });
// -------------------------------^^

Or of course, add a module map.