ServiceWorker fails on hard reload (Ctrl-Shift-R) in Chrome

Question

Why does service worker fail after a hard reload (Ctrl-Shift-R)?

---- case 1 CHROME --- success

1. Uninstall service worker
2. Load page
3. Page installs service worker
4. Worker.postMessage() succeeds
5. reload page
6. Worker.postMessage() succeeds

---- case 2 CHROME --- failure

1. Uninstall service worker
2. Load page
3. Page installs service worker
4. Worker.postMessage() succeeds
5. HARD RELOAD (ctrl-shift-R) page (serviceworker still running according to chrome://serviceworker-internals/ )
6. Worker.postMessage() fails -- 'error sendingTypeError: Cannot read property 'postMessage' of null'

Answer 1

When you shift-reload, the reloaded page will not be controlled by a service worker. This is part of the service worker specification.

This just applies for that next page load. Future page loads (that don't involve shift-reload) will continue to be controlled by a service worker, assuming that the page is in scope of one.

Answer 2

During development you can use, for example, Chrome's Dev-Tools and set that the service workers are updated on each reload:

For further reference you can read Googles Web Essentials on this topic.