diff --git a/src/app/Coriolis.jsx b/src/app/Coriolis.jsx index e7a84e8c..502a3ee7 100644 --- a/src/app/Coriolis.jsx +++ b/src/app/Coriolis.jsx @@ -324,44 +324,46 @@ export default class Coriolis extends React.Component { // Listen for appcache updated event, present refresh to update view // Check that service workers are registered if ('serviceWorker' in navigator) { - // Your service-worker.js *must* be located at the top-level directory relative to your site. - // It won't be able to control pages unless it's located at the same level or higher than them. - // *Don't* register service worker file in, e.g., a scripts/ sub-directory! - // See https://github.com/slightlyoff/ServiceWorker/issues/468 - const self = this; - navigator.serviceWorker.register('/service-worker.js').then(function(reg) { - // updatefound is fired if service-worker.js changes. - reg.onupdatefound = function() { - // The updatefound event implies that reg.installing is set; see - // https://slightlyoff.github.io/ServiceWorker/spec/service_worker/index.html#service-worker-container-updatefound-event - var installingWorker = reg.installing; + window.addEventListener('load', () => { + // Your service-worker.js *must* be located at the top-level directory relative to your site. + // It won't be able to control pages unless it's located at the same level or higher than them. + // *Don't* register service worker file in, e.g., a scripts/ sub-directory! + // See https://github.com/slightlyoff/ServiceWorker/issues/468 + const self = this; + navigator.serviceWorker.register('/service-worker.js').then(function(reg) { + // updatefound is fired if service-worker.js changes. + reg.onupdatefound = function() { + // The updatefound event implies that reg.installing is set; see + // https://slightlyoff.github.io/ServiceWorker/spec/service_worker/index.html#service-worker-container-updatefound-event + var installingWorker = reg.installing; - installingWorker.onstatechange = function() { - switch (installingWorker.state) { - case 'installed': - if (navigator.serviceWorker.controller) { - // At this point, the old content will have been purged and the fresh content will - // have been added to the cache. - // It's the perfect time to display a "New content is available; please refresh." - // message in the page's interface. - console.log('New or updated content is available.'); - self.setState({ appCacheUpdate: true }); // Browser downloaded a new app cache. - } else { - // At this point, everything has been precached. - // It's the perfect time to display a "Content is cached for offline use." message. - console.log('Content is now available offline!'); - self.setState({ appCacheUpdate: true }); // Browser downloaded a new app cache. - } - break; + installingWorker.onstatechange = function() { + switch (installingWorker.state) { + case 'installed': + if (navigator.serviceWorker.controller) { + // At this point, the old content will have been purged and the fresh content will + // have been added to the cache. + // It's the perfect time to display a "New content is available; please refresh." + // message in the page's interface. + console.log('New or updated content is available.'); + self.setState({ appCacheUpdate: true }); // Browser downloaded a new app cache. + } else { + // At this point, everything has been precached. + // It's the perfect time to display a "Content is cached for offline use." message. + console.log('Content is now available offline!'); + self.setState({ appCacheUpdate: true }); // Browser downloaded a new app cache. + } + break; - case 'redundant': - console.error('The installing service worker became redundant.'); - break; - } + case 'redundant': + console.error('The installing service worker became redundant.'); + break; + } + }; }; - }; - }).catch(function(e) { - console.error('Error during service worker registration:', e); + }).catch(function(e) { + console.error('Error during service worker registration:', e); + }); }); } window.onerror = this._onError.bind(this);