Service worker is caching files but fetch event is never fired

After looking at your gist and your question, I think your issue is with scoping.

From what I’ve determined with service workers(at least with static files), the service worker only has a maximum scope of the directory it is in. That is to say, it can’t load files/requests/responses that are pulled from a location at or above its structure, only below.

For example, /js/service-worker.js will only be able to load files in /js/{dirName}/.

Therefore, if you change the location of your service worker to the root of your web project, the fetch event should fire and your assets should load from cache.

So something like /service-worker.js, which should be able to access the /json directory, since it is deeper than the service-worker.js file.

This is further explained here, in the “Register A service worker” section.

Leave a Comment