Debugging ServiceWorkers

[seansaleh]

How would I go about debugging Service Workers?

I've tried to find some ways to set workbox to be in debug mode, but I can't find anything that works.
When I do npm run build and then npm run serve the service worker doesn't seem debuggable.

Thanks!

[rschristian]

When I do npm run build and then npm run serve the service worker doesn't seem debuggable.

Well that is the production-like output, not really what you'd want to use when debugging.

Depending on what you're looking to debug, you can edit the InjectManifest plugin using your preact.config.js or create a custom service worker to use.

[seansaleh]

Thanks! I was missing something fundamental here, and ended up solving it by adding --sw and using npm run dev (see my new answer)

[rschristian]

Ah, yep, should've mentioned that here. Sorry about that! Your answer is indeed the way to go.

[seansaleh]

To debug your service worker you need to use the flag --sw when running npm run dev

In detail, you need to edit "dev": "preact watch --sw", in your package.json

Then every time you change your service worker you should stop the dev server and rerun it. For good measure you should also create a new Incognito session to view your page.

Thanks to #955 and #1594 for the pointers!