Daniel Hill

Removing service workers from Mac Safari

Somehow I had a stale Service Worker that was causing errors and a blank screen on my site in Safari. Here's how to clear them out.

After I had merged the PR I had created for getting this site up and running on my production domain, I tested it in Safari om my Mac and got a blank screen. Safari Dev Tools were showing weird 404's that seemed to be occurring as a result of a Service Worker.

I don't actually use Service Workers on this site; but I had played around with older versions of Gatsby, as well as Hugo and Jekyll a while back, and maybe I had inadvertantly registered a Service Worker that is now very stale.

In Chrome Dev Tools you can easily find all Service Workers and disable them, but while on Safari on the Mac you can see the Service Workers in the Develop menu and drop into Dev Tools for that Service Worker, you cannot actually unregister them.

You'll need to drop into the Dev Tools Console and run this snippet while you are on the site you want to unregister the Service Workers from:

navigator.serviceWorker.getRegistrations().then(function(registrations) {
 for(let registration of registrations) {
  registration.unregister()
} })

The console will say Promise {status: "pending"} = $1, but it should work pretty much straight away.

You should now see that you have no Service Workers for the site anymore.