Skip to content

[Performance] Undefined offline fallback breaks service worker offline mode #5874

@DhyaniKavya

Description

@DhyaniKavya

Description:-
The service worker references an offlineFallbackPage variable when handling failed network requests:
=> const fallbackResponse = await caches.match(offlineFallbackPage);

However, offlineFallbackPage is only declared in a lint hint comment:
=> /* global offlineFallbackPage */

and is never actually defined at runtime. This can lead to a ReferenceError when the service worker attempts to serve a fallback page during offline conditions.

Expected Behavior:-
-The service worker should safely return a fallback page when network requests fail.
-Offline navigation should not throw runtime errors.
-The fallback resource should always be defined and precached.
-Users should see a valid page instead of a blank screen when offline.

How to Reproduce:-
-Open Music Blocks in a browser.
-Ensure the service worker is active.
-Open DevTools → Application → Service Workers.
-Enable Offline mode.
-Refresh the page or navigate to an uncached route.
-Observe the console and page behavior.

Console log Errors:
-May throw a ReferenceError: offlineFallbackPage is not defined when offline fallback is triggered.
-Results in failed fallback response or blank page.

Environment:
-Operating System: Windows / macOS / Linux
-Browser: Chrome / Chromium-based browsers (service worker supported)
-Version of Software/Project: Latest (master branch)

Impact:
-Medium to High
-Offline fallback fails unexpectedly
-Degrades Progressive Web App reliability
-May result in blank screen when offline
-Reduces resilience of offline experience

Suggested Fix:-
-Define offlineFallbackPage in sw.js (e.g., ./index.html).
-Ensure the fallback page is included in the precache list
-Maintain existing fetch handler logic.

Checklist

  • I have read and followed the project's code of conduct.
  • I have searched for similar issues before creating this one.
  • I have provided enough information to understand and assess the issue.
  • I am willing to contribute to the resolution of this issue.

Thank you for contributing to our project! We appreciate your help in improving it.

📚 See contributing instructions.

🙋🏾🙋🏼 Questions: Community Matrix Server.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions