Skip to content

Conversation

@LukasFrm
Copy link
Contributor

@LukasFrm LukasFrm commented Feb 9, 2026

Resolves JIRA: https://bbc.atlassian.net/browse/WS-2111

Summary

This PR improves the service worker’s stability and caching, ensuring:

  • No uncaught “Failed to fetch” errors are thrown in offline mode.
  • Fetch handlers always return a valid Response (or fallback) when network/cache lookups fail.
  • Cached items are kept up to date, with obsolete entries removed.
  • Specific asset paths (Frosted Promo, SmartTag, Reverb, PWA icons) are aligned with the current Next.js asset layout and analytics hosting.
  • Offline PWA behaviour remains intact and reliable.

Code changes

Fetch error handling

  • All code paths return either a valid Response or a defined offline/fallback Response (no uncaught Failed to fetch).

Cache cleanup

  • Aligned cached URLs and patterns with the live asset paths.

Frosted Promo

  • Updated the caching rule from the old Simorgh static path to the new Next.js chunk path:
    https://static.files.bbci.co.uk/ws/simorgh-assets/public/_next/static/chunks/frosted_promo.*\.js

Reverb script

  • Updated the Reverb script caching rule from the old static Simorgh location to:
    https://mybbc-analytics.files.bbci.co.uk/reverb-client-js/reverb-3.10.2.js

Moment.js

  • Removed the old Moment.js caching rule (/moment-lib+.*?.js$) as Moment is now bundled via Next.js and no longer requires explicit SW caching.

Testing

  1. List the steps required to test this PR.

Useful Links

Copilot AI review requested due to automatic review settings February 9, 2026 09:24
@LukasFrm LukasFrm changed the title fix: bump SW to v0.3.4; update cacheable file routes [WS-2111]: Clean up sw.js Feb 9, 2026
Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Bumps the service worker version and adjusts caching/fetch handling to improve offline stability and align cacheable asset routes with the current hosting/layout.

Changes:

  • Bumped SW version to v0.3.4.
  • Updated CACHEABLE_FILES entries for Reverb and Frosted Promo to match current asset locations.
  • Changed fetch handler fallbacks to return a 503 Response instead of throwing / falling through.

@LukasFrm LukasFrm marked this pull request as draft February 9, 2026 09:30
const version = 'v0.3.3';
const version = 'v0.3.4';
// Update cache name when changing caching logic / changes in offlinepage.tsx
const cacheName = 'simorghCache_v3';
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Upgrade cacheName as well

/^https:\/\/static(?:\.test)?\.files\.bbci\.co\.uk\/ws\/(?:simorgh-assets|simorgh1-preview-assets|simorgh2-preview-assets)\/public\/static\/js\/reverb\/reverb-3.10.2.js$/,
'https://mybbc-analytics.files.bbci.co.uk/reverb-client-js/reverb-3.10.2.js',
// Smart Tag
'https://mybbc-analytics.files.bbci.co.uk/reverb-client-js/smarttag-5.29.4.min.js',
Copy link
Contributor

@jinidev jinidev Feb 9, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is not properly cached as per Toby's findings
Refer :https://bbc-tpg.slack.com/archives/C08JHPZFCTT/p1769509652307959?thread_ts=1769509469.732389&cid=C08JHPZFCTT.
So fix for this is WIP?

const cached = await cache.match(event.request);
if (cached) return cached;
return fetch(event.request);
return new Response('', { status: 503 });
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I am wondering if we should keep the fetch(event.request); 🤔 Is it possible to end up in the situation where isPWADeviceOffline = true, but the user is actually back online and the request is not a in navigation mode (i.e. isNavigationMode = false?

Probably we could attempt to do a request and catch error if needed?

  fetch(event.request).catch(err => {
    return new Response('', { status: 503 });
  })

}
// fallback to browser default behavior
throw err;
return new Response('', { status: 503 });
Copy link
Member

@elvinasv elvinasv Feb 10, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Would that be a default fallback browser's behavior? I think we might lose error context if we just return 503 with an empty string 🤔

Edit: Although that would only happen in the navigation mode, not all requests.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants