Service Worker "Quota exceeded" can break all JS (ERR_FAILED)

🐞 bug report

Affected Package

The issue is caused by package @angular/service-worker

Is this a regression?

Not sure

Description

The service worker fails to load core JS files with DOMException: Quota exceeded.

This results in just a white page being shown, with a broken app.

Angular 9.0.4 Chromium 80

I’ve migrated from a custom workbox based serviceworker to the angular native service worker and now running into this.

Force reloading (ctrl+f5) makes everything load, but the error returns on the next normal load.

After using DevTools to debug it, I found that the error is DOMException: Quota exceeded. and occurs in this block:

🔬 Minimal Reproduction

Hard to reproduce unfortunately, needs low disk space or a big app being cached.

🔥 Exception or Error

The FetchEvent for ".../runtime-es2015.91c3f469886b8efa1fca.js" resulted in a network error response: the promise was rejected.
Promise.then (async)
onFetch @ ngsw-worker.js:1993
(anonymous) @ ngsw-worker.js:1928

🌍 Your Environment

Angular Version:

9.0.4

Anything else relevant?

Might be related to #21412 and #33793 which both appear fixed.

I’m not sure what the right fix here would be, I think fallback to network might be appropriate rather than completely failing the request.

[apocalyp0sys]

@andreialecu If you have ngsw in business-critical applications, i can suggest removing it or sticking to workbox. It’s not the first ngsw error that cripples the whole application. Most common ones are fixed, but you can never be sure until ALL CacheStorage write calls are wrapped.

[naveedahmed1]

+1 for this