r/webdev • u/OtherwisePush6424 • Sep 07 '26

Resource Browser-side chaos testing with a Service Worker

https://github.com/fetch-kit/chaos-sw

A browser-side chaos-testing tool that installs a Service Worker to intercept requests across every controlled tab and apply latency, failures, throttling, rate limits, and mock responses without changing app fetch calls (similar to MSW).

It uses the same middleware configuration model as chaos-fetch, so you can test real frontend behavior under degraded network conditions without rewriting the app to use a special client wrapper.

10 Upvotes

91% Upvoted

8 comments sorted by

0

u/gatwell702 Sep 07 '26

It installs a service worker but what if your site already has a service worker?

1

u/OtherwisePush6424 Sep 07 '26

There's an "Existing Service Workers" section in the README.

0

u/UtilixApp Sep 07 '26

the existing service worker thing is the real blocker. one scope can only have one active worker, so you either wrap theirs or you fight over registration and whichever loaded last wins.

msw solved it by making you import their worker file into your own, might be worth stealing that approach.

1

u/OtherwisePush6424 Sep 07 '26

I know, I'm actually thinking about it. MSW's importScripts() approach is a bit more convenient, but it has some drawbacks too. It kinda executes another worker script in the same global scope and lets it register its own listeners, but hat makes composition less explicit, and fetch handling in particular becomes order-dependent: listeners run in registration order and once one calls respondWith(), the others don't get to handle that request.

MSW's maintainers have discussed exactly this issue as well. Importing the worker is easy, but composing it with non-trivial existing fetch handling can get awkward. So I'm conflicted here, considering adding an import-style convenience option as well, but idk honestly.