The statechange
event fires anytime the ServiceWorker.state
changes.
ServiceWorker: statechange event
Syntax
Use the event name in methods like addEventListener()
, or set an event handler property.
addEventListener('statechange', event => { }); onstatechange = event => { };
Event type
A generic Event
.
Examples
This code snippet is from the service worker registration-events sample (live demo). The code listens for any change in the ServiceWorker.state
and returns its value.
var serviceWorker; if (registration.installing) { serviceWorker = registration.installing; document.querySelector('#kind').textContent = 'installing'; } else if (registration.waiting) { serviceWorker = registration.waiting; document.querySelector('#kind').textContent = 'waiting'; } else if (registration.active) { serviceWorker = registration.active; document.querySelector('#kind').textContent = 'active'; } if (serviceWorker) { logState(serviceWorker.state); serviceWorker.addEventListener('statechange', function(e) { logState(e.target.state); }); }
Note that when statechange
fires, the service worker's references may have changed. For example:
navigator.serviceWorker.register(..).then(function(swr) { swr.installing.state == "installing" swr.installing.onstatechange = function() { swr.installing == null; // At this point, swr.waiting OR swr.active might be true. This is because the statechange // event gets queued, meanwhile the underlying worker may have gone into the waiting // state and will be immediately activated if possible. } })
Specifications
Specification |
---|
Service Workers 1 # dom-serviceworker-onstatechange |
Browser compatibility
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
statechange_event |
40
|
17
|
44
Extended Support Releases (ESR) before Firefox 78 ESR do not support service workers and the Push API.
|
No
|
27
|
11.1
|
40
|
40
|
44
|
27
|
11.3
|
4.0
|
© 2005–2021 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorker/statechange_event