thepassle

// cache only, or any other caching strategy
self.addEventListener('fetch', function(event) {
  event.respondWith(caches.match(event.request));
});

thepassle

self.addEventListener('activate', event => {
  clients.claim();
});

thepassle

self.addEventListener('install', event => {
  // precache assets etc etc
  // ...
});

thepassle

self.addEventListener('install', event => {
  // precache assets etc etc
  self.skipWaiting();
});

thepassle

self.addEventListener('activate', event => {
  // clean up old caches etc etc
  // ...
});

thepassle

self.addEventListener('activate', event => {
  // clean up old caches etc etc
  clients.claim();
});

thepassle

self.addEventListener(fetch, event => {
  // ready to handle requests!
});

thepassle

const reg = await navigator.serviceWorker.getRegistration();

reg.addEventListener('updatefound', () => {
    // ...
});

thepassle

const reg = await navigator.serviceWorker.getRegistration();

reg.addEventListener('updatefound', () => {
  const newWorker = reg.installing; 
  newWorker.addEventListener('statechange', () => {
    if (newWorker.state === 'installed') {
      // Update available! Show an install button
    }
  });
});

thepassle

button.addEventListener('click', () => {
  newWorker.postMessage({ type: 'SKIP_WAITING' });
});