service-worker: properly handle storage quota problems

Discussion taken here from angular/angular-cli#8592.

I’ve been experiencing this issue on Chrome, however, it seems to be applicable to any browser in one way or another.

When you run low on disk space (and most likely other occasions), Chrome cuts the storage quota to zero and Uncaught (in promise) DOMException: Quota exceeded. is thrown during service worker installation. When the issue appeared navigator.storage.estimate() would always return an object with quota === usage, both being about the service worker script size.

I see that this is a browser limitation, but DOMException: Quota exceeded. and similar errors on other browsers should be caught and an event passed to the angular service.

Unfortunately I don’t see a way to reproduce the issue other than filling up your main disk.

[apocalyp0sys]

@gkalpak Did some more digging and decided we shouldnt cattch the error here

https://github.com/angular/angular/blob/f3859ff2b9aa75068250aa1ce4b117c6adfccf3c/packages/service-worker/worker/src/driver.ts#L445

It can be not cache-related and break something else. Also unable to get actual response at this point, would have to re-run network request.

Decided to fix this while handling reqests by data group strategy, please see PR.

[apocalyp0sys]

We’ve encountered this error after moving our application from self-made service worker to ngsw. This error is important because it can cripple the ngsw and prevent it from serving any requests at all (both from cache and network) when the user has no free disk space available. It is hard to reproduce, cant find any browser flags or configuration parametes to reduce CacheStorage size, ended up just filling system disk.

This error occurs when ngsw tries to put something in cache and errors are not handled properly in some cases.

When the error occurs during initialization (asset caching), it is catched and ngsw enters SAFE_MODE. After this all is served from network and the client works ok.

https://github.com/angular/angular/blob/f3859ff2b9aa75068250aa1ce4b117c6adfccf3c/packages/service-worker/worker/src/driver.ts#L403

When the error occurs during data (api) caching, the error is catched and rethrown, no respondWith is called, and the client is left with no data (status code 0, as if no connection available)

https://github.com/angular/angular/blob/f3859ff2b9aa75068250aa1ce4b117c6adfccf3c/packages/service-worker/worker/src/driver.ts#L445

Probably we should detect if the error is QuotaExceeded and switch to SAFE_MODE in this case. Or do not rethrow error at all.