I know that in a common resolution to the error below, I need to add a firebase-messaging-sw.js file. Since I’m using a bubble HTML element to run the script, I’m not sure how to do that. I tried using a CDN, but I’m not sure I did it properly, or if there is a better way. What do you think?

Here’s the error:

An error occurred while retrieving token.  FirebaseError: Messaging: We are unable to register the default service worker. Failed to register a ServiceWorker: The document is in an invalid state. (messaging/failed-service-worker-registration).
    at registerDefaultSw (registerDefaultSw.ts:43:25)
    at async updateSwReg (updateSwReg.ts:28:5)
    at async getToken$1 (getToken.ts:43:3)

Here’s how I tried to add the file:

//initialize firebase...

const swUrl = 'https://3b4293b7c2497062d0307b62bd49f75f.cdn.bubble.io/f1720473376600x761326990998907800/firebase-messaging-sw.js';
const sw = document.createElement('script');
sw.src = swUrl;
document.head.appendChild(sw);

//getToken(...

Note that the service worker file is currently empty, because according to this tutorial, it should work with an empty file.

I also tried the answer from this similar question, but it didn’t work for me. I got an import issue when trying to use the ‘firebase/messaging/sw’ package.