The service worker navigation preload request was cancelled before 'preloadResponse' settled. If you intend to use 'preloadResponse', use waitUntil() or respondWith() to wait for the promise to settle.

Background I am trying to use a navigationPreload and a cache data by StaleWhileRevalidate strategy for a navigation request.

Problem I am getting an error message:

The service worker navigation preload request was cancelled before 'preloadResponse' settled. If you intend to use 'preloadResponse', use waitUntil() or respondWith() to wait for the promise to settle.

and cache is not updated

Finding I think for this case this.waitUntil is missing to wait for a response

const response = await this.waitUntil(this.fetch(input));

https://github.com/GoogleChrome/workbox/blob/0b5d9d816ab828d32021d05a808c63d17a28dbf1/packages/workbox-strategies/src/StrategyHandler.ts#L240

Question I am doing something wrong in my code or this finding is a needed fix?

navigationPreload.enable();
self.addEventListener('install', () => {
    self.skipWaiting();
});
clientsClaim();

const routes = [
    new RegExp(`/route1`),
    new RegExp(`/route2`)
];

registerRoute(new NavigationRoute(new NetworkOnly(), {
    denylist: routes,
}));

registerRoute(new NavigationRoute(new StaleWhileRevalidate({
    cacheName: NAVIGATION_CACHE_NAME,
}), {
    allowlist: routes,
}));

Thank you so much for creating this great library.

[jeffposnick]

Okay, sorry for initially assuming that this was just logging noise. I was able to reproduce failures to update the cache during the revalidate step of StaleWhileRevalidate, when that strategy is being used for navigation requests, and navigation preload is enabled.

The fix is adding in a waitUntil() around the entire promise that performs the revalidation. It should make it into the next release of Workbox.

[jeffposnick]

This fix is now in the https://github.com/GoogleChrome/workbox/releases/tag/v6.5.0 release.