fix(service-worker): handle error with console.error (#40236)

This commit reverts commit [_fix(service-worker): handle error with
ErrorHandler_](552419d).

With Angular v11.0.4 and commit [_fix(service-worker): handle error with
ErrorHandler_](552419d)
Angular start to send all service worker registration errors to the Angular
standard `ErrorHandler#handleError()` interface, instead of logging them in the
console.
But users existing `ErrorHandler#handleError()` implementations are not adapted
to service worker registration errors and it might result in broken apps or
bad UI.
Passing to `ErrorHandler` is desirable for some and undesirable for others and
the same is true for passing to `console.error()`.
But `console.error()` was used for a long time and thus it is preferable to keep
it as long as a good solution is not found with `ErrorHandler`.

Right now it's hard to define a good solution for `ErrorHandler` because:

1. Given the nature of the SW registration errors (usually outside the control
   of the developer, different error messages on each browser/version, often
   quite generic error messages, etc.), passing them to the `ErrorHandler` is
   not particularly helpful.
2. While `ErrorHandler#handleError()` accepts an argument of type `any` (so
   theoretically we could pass any object without changing the public API), most
   apps expect an `Error` instance, so many apps could break if we changed the
   shape.
3. Ideally, the Angular community want to re-think the `ErrorHandler` API
   and add support for being able to pass additional metadata for each error
   (such as the source of the error or some identifier, etc.). This change,
   however, could potentially affect many apps out there, so the community must
   put some thought into it and design it in a way that accounts for the needs
   of all packages (not just the SW).
4. Given that we want to more holistically revisit the `ErrorHandler` API, any
   changes we make in the short term to address the issue just for the SW will
   make it more difficult/breaky for people to move to a new API in the future.

To see the whole explanation see GitHub PR #40236.

PR Close #40236

packages/service-worker/src/module.ts

@@ -7,7 +7,7 @@
  */
 
 import {isPlatformBrowser} from '@angular/common';
-import {APP_INITIALIZER, ApplicationRef, ErrorHandler, InjectionToken, Injector, ModuleWithProviders, NgModule, NgZone, PLATFORM_ID} from '@angular/core';
+import {APP_INITIALIZER, ApplicationRef, InjectionToken, Injector, ModuleWithProviders, NgModule, NgZone, PLATFORM_ID} from '@angular/core';
 import {merge, Observable, of} from 'rxjs';
 import {delay, filter, take} from 'rxjs/operators';
 
@@ -128,10 +128,9 @@ export function ngswAppInitializer(
     const ngZone = injector.get(NgZone);
     ngZone.runOutsideAngular(
         () => readyToRegister$.pipe(take(1)).subscribe(
-            () => navigator.serviceWorker.register(script, {scope: options.scope}).catch(err => {
-              const errorHandler = injector.get(ErrorHandler);
-              errorHandler.handleError(err);
-            })));
+            () =>
+                navigator.serviceWorker.register(script, {scope: options.scope})
+                    .catch(err => console.error('Service worker registration failed with:', err))));
   };
   return initializer;
 }

packages/service-worker/test/module_spec.ts

@@ -6,7 +6,7 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {ApplicationRef, ErrorHandler, PLATFORM_ID} from '@angular/core';
+import {ApplicationRef, PLATFORM_ID} from '@angular/core';
 import {fakeAsync, flushMicrotasks, TestBed, tick} from '@angular/core/testing';
 import {Subject} from 'rxjs';
 import {filter, take} from 'rxjs/operators';
@@ -21,7 +21,6 @@ describe('ServiceWorkerModule', () => {
     return;
   }
 
-  let errorHandlerSpy: jasmine.Spy;
   let swRegisterSpy: jasmine.Spy;
 
   const untilStable = () => {
@@ -35,14 +34,9 @@ describe('ServiceWorkerModule', () => {
 
   describe('register()', () => {
     const configTestBed = async (opts: SwRegistrationOptions) => {
-      const errorHandler = {handleError: () => {}};
-      errorHandlerSpy = spyOn(errorHandler, 'handleError');
       TestBed.configureTestingModule({
         imports: [ServiceWorkerModule.register('sw.js', opts)],
-        providers: [
-          {provide: ErrorHandler, useValue: errorHandler},
-          {provide: PLATFORM_ID, useValue: 'browser'},
-        ],
+        providers: [{provide: PLATFORM_ID, useValue: 'browser'}],
       });
 
       await untilStable();
@@ -77,10 +71,12 @@ describe('ServiceWorkerModule', () => {
     });
 
     it('catches and a logs registration errors', async () => {
+      const consoleErrorSpy = spyOn(console, 'error');
       swRegisterSpy.and.returnValue(Promise.reject('no reason'));
 
       await configTestBed({enabled: true, scope: 'foo'});
-      expect(errorHandlerSpy).toHaveBeenCalledWith('no reason');
+      expect(consoleErrorSpy)
+          .toHaveBeenCalledWith('Service worker registration failed with:', 'no reason');
     });
   });