How to force update the service worker file in Google Devtools?

Question

I tried to force reload the new Service Worker file but it didn't autoload. I have checked the "Update on reload" checkbox in the "Application" tab of the devtools and disable the cache in the "Sources" tab.

I am using Chrome version "75.0.3770.100".

The only way I got it working is by checking and unchecking again and another is by clicking on "skipWaiting"

Is there something I am missing or flags should I enable?

Thanks for the help!

Answer 1

If you can see the skipWaiting options in Devtools is becuase you are not calling self.skipWaiting() in the install event. Usually the new updated service worker waits till the older version is not controlling any clients. The self.skipWaiting() prevents this wait. Here is an example.

//This is the install event listener
self.addEventListener("install", (event) => {
    console.log(self);
    event.waitUntil(
        caches.open(CACHE_NAME).then(cache => {
            cache.addAll(STATIC_ASSETS).then(() => {
                    self.skipWaiting();
                }).catch(error => {
                    logForDevelopment("An error occured while adding static assets to the cache", true);
                    logForDevelopment(error, true);
                })
        })
    );
    logForDevelopment("Service Worker: Installed");
});