Service Worker navigation preload sample code error

MDN URL

https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers

What specific section or headline is this issue about?

Service Worker navigation preload: https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers#service_worker_navigation_preload

What information was incorrect, unhelpful, or incomplete?

The code...

const responseFromCache = await caches.match(request);
  if (responseFromCache) {
    return responseFromCache;
  }
const preloadResponse = await preloadResponsePromise;
  if (preloadResponse) {
    console.info("using preload response", preloadResponse);
    event.waitUntil(putInCache(request, preloadResponse.clone()));
    return preloadResponse;
  }

... causes chrome console to display the following error: "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."

This can be corrected by changing the first block...

if (responseFromCache) {
  // Wait for preload to settle to avoid cancellation warning
  preloadResponsePromise.catch(() => {}); // Ignore errors
  return responseFromCache;
}

What did you expect to see?

N/A

Do you have any supporting links, references, or citations?

Anthropic Claude, given the code and the error, provided the solution.

Do you have anything more you want to share?

No response

MDN metadata

• Folder: en-us/web/api/service_worker_api/using_service_workers
• MDN URL: https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers
• GitHub URL: https://github.com/mdn/content/blob/main/files/en-us/web/api/service_worker_api/using_service_workers/index.md
• Last commit: https://github.com/mdn/content/commit/ca26363fcc6fc861103d40ac0205e5c5b79eb2fa
• Document last modified: 2025-11-30T02:30:55.000Z