firebase
Bump issue 5403
https://github.com/firebase/firebase-js-sdk/issues/5403 has been closed, but its issue and solution is lacking documentation in the firebase.google.com docs.
I ran into the same problem as the writer of the mentioned issue and it took me a long time to figure out the root of the problem.
It is not obvious on first hand, mainly because debugging of service workers is difficult to do in many browsers. For example, in the firefox inspector, when a service worker is unable to start, it will only print the message TypeError: ServiceWorker script at http://localhost:3000/firebase-messaging-sw.js for scope http://localhost:3000 threw an exception during script evaluation. [index.tsx:(...) without informing that the importScripts has failed.
Also, it seems that import {} from ... statements in service worker scripts are not widely supported in browsers. But the documentation directs the user into using import instead of importScripts.
I couldn't figure out how to label this issue, so I've labeled it for a human to triage. Hang tight.
@jamesdaniels - do you know a good place to add this to the docs? Also, importScripts not working with firebase messaging v9.0.0 was resolved Aug 30, 2021. Is it still the best service worker solution to point them to compat or should we be advocating for a solution with a more recent version, modular?
We should document on the receive messages section of the FCM docs, a callout to service workers in the v9 learn more, and maybe even a column on the supported environments. It's probably worth exploring browser saturation of esm in sw. FWIW we should block depreciation of compat until an acceptable threshold it met or we revamp those docs to talk about bundling.
An aside, I'm still surprised the popular frameworks/bundlers aren't abstracting this away from the developer.
Seems like the v8 snippets on the first doc page are also incorrect (the URLs should point to firebase-app-compat.js and firebase-messaging-compat.js). The snippets are sourced from this repo: https://github.com/firebase/snippets-web/blob/73a4f0b01c7e9869e3bb8bd4494ff186eb784ba5/messaging/service-worker.js#L10-L32 Just need to make a PR. To get there from the docs page itself you can also click on service-worker.js on the bottom right of the snippet. There are 2 affected snippets on the page.
Adding callout in guides to use v8 for service workers, internal tracker cl/516227606