Allows waitUntil to be called async on extendable events

Downloads in past


1.0.27 years ago7 years agoMinified + gzip package size for async-waituntil-polyfill in KB


In earlier versions of the service worker spec, event.waitUntil had to be called synchronously, as in during the initial execution of the event handler. Meaning this would fail:
self.addEventListener('fetch', event => {
  event.respondWith('mysite-dynamic').then(cache => {
      // try the cache first
      return cache.match(event.request).then(response => {
        // if we get a response, use it
        if (response) return response;
        // otherwise, go to the network
        return fetch(event.request).then(response => {
          // cache it asynchronously for next time
            cache.put(event.request, response.clone())

          // return the response
          return response;

This fails because waitUntil was called after the execution of the event handler. But we need to use waitUntil here because the browser needs to know to keep the service worker alive after we've sent the response back.
We fixed this in the spec, so you can call waitUntil as long as the promises already passed to waitUntil & respondWith haven't settled yet.
The browsers haven't caught up yet, but this polyfill makes it work as expected.
In your service worker:

That's it! The above example now works.