pass registration to reload action

src/actions/app.ts

@@ -26,11 +26,13 @@ export enum AppActionType {
 }
 
 /** Action that requests the app to reload. */
-export type AppReloadAction = Action<AppActionType.Reload>;
+export type AppReloadAction = Action<AppActionType.Reload> & {
+    registration: ServiceWorkerRegistration;
+};
 
 /** Creates an action that requests the app to reload. */
-export function reload(): AppReloadAction {
-    return { type: AppActionType.Reload };
+export function reload(registration: ServiceWorkerRegistration): AppReloadAction {
+    return { type: AppActionType.Reload, registration };
 }
 
 /** Action that indicates the app has just started. */

src/sagas/app.test.ts

@@ -13,11 +13,6 @@ test('reload', async () => {
         unregister: jest.fn(),
     };
 
-    // @ts-expect-error: navigator.serviceWorker is not implemented in JSDOM
-    navigator.serviceWorker = {
-        getRegistrations: jest.fn().mockResolvedValue([registration]),
-    };
-
     // @ts-expect-error: JSDOM implementation of location.reload() causes error
     delete window.location;
     // @ts-expect-error: JSDOM implementation of location.reload() causes error
@@ -25,7 +20,7 @@ test('reload', async () => {
         reload: jest.fn(),
     };
 
-    saga.put(reload());
+    saga.put(reload(registration as ServiceWorkerRegistration));
 
     // yield to allow generators to complete
     await delay(0);

src/sagas/app.ts

@@ -2,17 +2,10 @@
 // Copyright (c) 2021 The Pybricks Authors
 
 import { call, takeEvery } from 'typed-redux-saga/macro';
-import { AppActionType } from '../actions/app';
-
-function* reload(): Generator {
-    // unregister the service worker so that when the page reloads, it uses
-    // the new version
-    const registrations = yield* call(() => navigator.serviceWorker.getRegistrations());
-
-    for (const r of registrations) {
-        yield* call(() => r.unregister());
-    }
+import { AppActionType, AppReloadAction } from '../actions/app';
 
+function* reload(action: AppReloadAction): Generator {
+    yield* call(() => action.registration.unregister());
     location.reload();
 }
 

src/sagas/notification.ts

@@ -33,7 +33,10 @@ import {
 } from '../actions/lwp3-bootloader';
 import { MpyActionType, MpyDidFailToCompileAction } from '../actions/mpy';
 import { NotificationActionType, NotificationAddAction } from '../actions/notification';
-import { ServiceWorkerActionType } from '../actions/service-worker';
+import {
+    ServiceWorkerAction,
+    ServiceWorkerActionType,
+} from '../actions/service-worker';
 import Notification from '../components/Notification';
 import UnexpectedErrorNotification from '../components/UnexpectedErrorNotification';
 import { MessageId } from '../components/notification-i18n';
@@ -323,7 +326,9 @@ function* addNotification(action: NotificationAddAction): Generator {
     });
 }
 
-function* showServiceWorkerUpdate(): Generator {
+function* showServiceWorkerUpdate(
+    updateAction: ServiceWorkerAction<ServiceWorkerActionType.DidUpdate>,
+): Generator {
     const ch = channel<React.MouseEvent<HTMLElement>>();
     const action = dispatchAction(
         MessageId.ServiceWorkerUpdateAction,
@@ -343,7 +348,7 @@ function* showServiceWorkerUpdate(): Generator {
 
     yield* take(ch);
 
-    yield* put(reload());
+    yield* put(reload(updateAction.registration));
 }
 
 export default function* (): Generator {