mozilla
Your Search Results

    ExtendableEvent

    This is an experimental technology
    Because this technology's specification has not stabilized, check the compatibility table for the proper prefixes to use in various browsers. Also note that the syntax and behavior of an experimental technology is subject to change in future versions of browsers as the spec changes.

    The ExtendableEvent interface extends the lifetime of the install and activate events dispatched on the global scope as part of the service worker lifecycle. This ensures that any functional events (like FetchEvent) are not dispatched until it upgrades database schemas and deletes the outdated cache entries.

    This interface inherits from the Event interface.

    Note: This interface is only available when the global scope is a ServiceWorkerGlobalScope. It is not available when it is a Window, or the scope of another kind of worker.

    Constructor

    ExtendableEvent()
    Creates a new ExtendableEvent object.

    Properties

    Doesn't implement any specific properties, but inherits properties from its parent, Event.

    Methods

    Inherits methods from its parent, Event.

    ExtendableEvent.waitUntil()

    Extends the lifetime of the event.  It is intended to be called in the install EventHandler for the installing worker and on the active EventHandler for the active worker.

    Examples

    This code snippet is from the service worker prefetch sample (see prefetch example live.) The code calls ExtendableEvent.waitUntil() in ServiceWorkerGlobalScope.oninstall, delaying treating the ServiceWorkerRegistration.installing worker as installed until the passed promise resolves successfully. The promise resolves when all resources have been fetched and cached, or else when any exception occurs.

    The code snippet also shows a best practice for versioning caches used by the service worker. Though there's only one cache in this example, the same approach can be used for multiple caches. It maps a shorthand identifier for a cache to a specific, versioned cache name.

    Note: In Chrome, logging statements are visible via the "Inspect" interface for the relevant service worker accessed via chrome://serviceworker-internals.

    var CACHE_VERSION = 1;
    var CURRENT_CACHES = {
      prefetch: 'prefetch-cache-v' + CACHE_VERSION
    };
    
    self.addEventListener('install', function(event) {
      var urlsToPrefetch = [
        './static/pre_fetched.txt',
        './static/pre_fetched.html',
        'https://www.chromium.org/_/rsrc/1302286216006/config/customLogo.gif'
      ];
    
      console.log('Handling install event. Resources to pre-fetch:', urlsToPrefetch);
    
      event.waitUntil(
        caches.open(CURRENT_CACHES['prefetch']).then(function(cache) {
          cache.addAll(urlsToPrefetch.map(function(urlToPrefetch) {
            return new Request(urlToPrefetch, {mode: 'no-cors'});
          })).then(function() {
            console.log('All resources have been fetched and cached.');
          });
        }).catch(function(error) {
          console.error('Pre-fetching failed:', error);
        })
      );
    });
    Important: When fetching resources, it's very important to use {mode: 'no-cors'} if there is any chance that the resources are served off of a server that doesn't support CORS. In this example, www.chromium.org doesn't support CORS.

    Specifications

    Specification Status Comment
    Service Workers
    The definition of 'ExtendableEvent' in that specification.
    Editor's Draft Initial definition.

    Browser compatibility

    Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
    Basic support 40.0 33.0 (33.0) Not supported 24 Not supported
    Feature Android Firefox Mobile (Gecko) Firefox OS IE Mobile Opera Mobile Safari Mobile Chrome for Android
    Basic support ? ? ? Not supported ? Not supported ?

    See also

    Document Tags and Contributors

    Contributors to this page: teoli, Meggin, jpmedley, fscholz, chrisdavidmills
    Last updated by: jpmedley,