MV3 Service Worker: ServiceWorkerRegistration.update

[Aaron Klinker]

Hi, I'm working on a web extension framework and I want to be able to reload the background's service worker without reloading the entire extension, like when a file changes that was imported by the service worker.

I saw here, that it was possible through the devtools:

> Also, if you have made changes to the service worker code, you can use the Update button and skipWaiting to apply the changes immediately.

So I attempted to access the "update" and "skipWaiting" function from the service worker by running the following code in the top level scope of the service worker.

addEventListener('install', (event) => {
   const sw = event.target;
   const { registration, skipWaiting } = sw;
   const update = registration.update;

   globalThis.reloadBackground = async () => {
     await update();
     await skipWaiting();
   };
});

The install event fires correctly and I'm able to extract the "update" and "skipWaiting" functions. However, when I call them, I get an error:

TypeError: Failed to execute 'update' on 'ServiceWorkerRegistration': Illegal invocation

I assume I can't call these API from inside a web worker, and that's why it's throwing an error. I can't find any docs anywhere about this problem specifically. Here's a minimal reproduction of this behavior.

Is there a different way to update the service worker without reloading the entire extension?

If not, this would be a great MV3 feature to improve DX. Right now, I reload the entire extension, but that causes any tabs open to an extension HTML page to close. This is really annoying when you update a shared util while working on a UI, and suddenly the tab/popup closes because that util was also used by the service worker, triggering an extension reload.

[Jackie Han]

I'm not sure if this is entirely feasible. But I got the desired result with the following code.

// service worker, version 1

self.addEventListener("install", (event) => {
  self.skipWaiting();
});

async function updateSelf() {
  await registration.update();
}
chrome.runtime.onMessage.addListener(updateSelf);

console.log('version 1');

Now, do the following steps:

1. open an extension page's devtools, you will see the log "version 1"

2. modify SW's source code, update it to console.log('version 2'); and save the file.

3. in step-1's devtools, run chrome.runtime.sendMessage('update'), you will see the log "version 2"

repeat above steps, you will see "version 3", "version 4" without any error.

--
You received this message because you are subscribed to the Google Groups "Chromium Extensions" group.
To unsubscribe from this group and stop receiving emails from it, send an email to chromium-extens...@chromium.org.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/chromium-extensions/c261bb75-0353-4032-8141-9ac4ae1a5836n%40chromium.org.

[Jackie Han]

I think my previous method is Ok. It immediately updates the service worker and does not close any opened extension pages.

[Aaron Klinker]

Oh interesting, of course the global scope variable, registration, would be in the global scope lol.

But yes, that's exactly what I'm looking for! It's working without closing extension pages. Thanks for the help :)

[wOxxOm]

I wonder if this stops working in Chrome 117 due to https://chromiumdash.appspot.com/commit/b8b06b6b8071b96e3f76858d662d8991ba3b3374

[Jackie Han]

It works on Chrome Stable 115. But on Chrome Canary 117.0.5901.0 ( > 117.0.5863.0 ), SW doesn't update correctly by this way (still outputs the old version). Clicking the update button in Devtools (Application -> Service workers) doesn't work either.

Indeed, updating extension SW programmatically by developers is a hacky workaround. So don't rely on it.

Debugging SW in extensions is a bit cumbersome, every modification needs to reload the extension, and then reopen extension pages. The intention of OT is to solve this pain.

[Aaron Klinker]

> I wonder if this stops working in Chrome 117 due to https://chromiumdash.appspot.com/commit/b8b06b6b8071b96e3f76858d662d8991ba3b3374

I can see the rationale behind that change. Unfortunate though, DX will suffer. But if it was a hack anyways, oh well.

> The intention of OT is to solve this pain.

What's OT? I'm not familiar with that acronym.

[Jackie Han]

Sorry, I mean OP (Original Poster). But I misremembered it as "Original Topic".

[Jackie Han]

I reported a document issue for updating service worker.