build(ngrx.io): update to Angular 16 (#3871)

markostanimirovic · web-flow · commit d65c18893600 · 2023-05-05T07:11:08.000+02:00
diff --git a/projects/ngrx.io/package.json b/projects/ngrx.io/package.json
@@ -75,33 +75,33 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "15.0.4",
-    "@angular/cdk": "15.0.3",
-    "@angular/common": "15.0.4",
-    "@angular/core": "15.0.4",
-    "@angular/elements": "15.0.4",
+    "@angular/animations": "16.0.0",
+    "@angular/cdk": "16.0.0",
+    "@angular/common": "16.0.0",
+    "@angular/core": "16.0.0",
+    "@angular/elements": "16.0.0",
     "@angular/fire": "^7.5.0",
-    "@angular/forms": "15.0.4",
-    "@angular/material": "15.0.3",
-    "@angular/platform-browser": "15.0.4",
-    "@angular/platform-browser-dynamic": "15.0.4",
-    "@angular/router": "15.0.4",
-    "@angular/service-worker": "15.0.4",
+    "@angular/forms": "16.0.0",
+    "@angular/material": "16.0.0",
+    "@angular/platform-browser": "16.0.0",
+    "@angular/platform-browser-dynamic": "16.0.0",
+    "@angular/router": "16.0.0",
+    "@angular/service-worker": "16.0.0",
     "@webcomponents/custom-elements": "^1.2.0",
     "rxjs": "~7.5.0",
     "tslib": "^2.3.0",
     "webpack": "^4.0.0",
-    "zone.js": "~0.12.0"
+    "zone.js": "~0.13.0"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "15.0.4",
-    "@angular/cli": "15.0.4",
-    "@angular/compiler": "15.0.4",
-    "@angular/compiler-cli": "15.0.4",
-    "@angular/language-service": "15.0.4",
+    "@angular-devkit/build-angular": "16.0.0",
+    "@angular/cli": "16.0.0",
+    "@angular/compiler": "16.0.0",
+    "@angular/compiler-cli": "16.0.0",
+    "@angular/language-service": "16.0.0",
     "@types/jasmine": "~3.6.0",
     "@types/jasminewd2": "^2.0.4",
-    "@types/node": "18.7.1",
+    "@types/node": "18.16.3",
     "archiver": "^1.3.0",
     "canonical-path": "^0.0.2",
     "chalk": "^2.1.0",
@@ -148,9 +148,9 @@
     "semver": "^5.3.0",
     "shelljs": "^0.7.7",
     "tree-kill": "^1.1.0",
-    "ts-node": "^3.3.0",
+    "ts-node": "10.9.1",
     "tslint": "~6.1.0",
-    "typescript": "~4.8.2",
+    "typescript": "~5.0.4",
     "uglify-js": "^3.0.15",
     "unist-util-filter": "^0.2.1",
     "unist-util-source": "^1.0.1",
diff --git a/projects/ngrx.io/src/app/custom-elements/resource/resource-list.component.spec.ts b/projects/ngrx.io/src/app/custom-elements/resource/resource-list.component.spec.ts
@@ -1,4 +1,4 @@
-import { ReflectiveInjector } from '@angular/core';
+import { TestBed } from '@angular/core/testing';
 import { PlatformLocation } from '@angular/common';
 
 import { of } from 'rxjs';
@@ -12,17 +12,18 @@ import { Category } from './resource.model';
 // Let e2e tests verify how it displays.
 describe('ResourceListComponent', () => {
 
-    let injector: ReflectiveInjector;
     let location: TestPlatformLocation;
 
     beforeEach(() => {
-        injector = ReflectiveInjector.resolveAndCreate([
-            ResourceListComponent,
-            {provide: PlatformLocation, useClass: TestPlatformLocation },
-            {provide: ResourceService, useClass: TestResourceService }
-        ]);
-
-        location = injector.get(PlatformLocation);
+        TestBed.configureTestingModule({
+            providers: [
+                ResourceListComponent,
+                { provide: PlatformLocation, useClass: TestPlatformLocation },
+                { provide: ResourceService, useClass: TestResourceService },
+            ],
+        });
+
+        location = TestBed.inject(PlatformLocation);
     });
 
     it('should set the location w/o leading slashes', () => {
@@ -63,7 +64,7 @@ describe('ResourceListComponent', () => {
 
     /// / Test Helpers ////
     function  getComponent(): ResourceListComponent {
-        return injector.get(ResourceListComponent);
+        return TestBed.inject(ResourceListComponent);
     }
 
     class TestPlatformLocation {
diff --git a/projects/ngrx.io/src/app/search/search.service.spec.ts b/projects/ngrx.io/src/app/search/search.service.spec.ts
@@ -1,12 +1,11 @@
-import { ReflectiveInjector, NgZone } from '@angular/core';
-import { fakeAsync, tick } from '@angular/core/testing';
+import { NgZone } from '@angular/core';
+import { fakeAsync, TestBed, tick } from '@angular/core/testing';
 import { of } from 'rxjs';
 import { SearchService } from './search.service';
 import { WebWorkerClient } from 'app/shared/web-worker';
 
 describe('SearchService', () => {
 
-    let injector: ReflectiveInjector;
     let service: SearchService;
     let sendMessageSpy: jasmine.Spy;
     let mockWorker: WebWorkerClient;
@@ -16,11 +15,16 @@ describe('SearchService', () => {
         mockWorker = { sendMessage: sendMessageSpy } as any;
         spyOn(WebWorkerClient, 'create').and.returnValue(mockWorker);
 
-        injector = ReflectiveInjector.resolveAndCreate([
-            SearchService,
-            { provide: NgZone, useFactory: () => new NgZone({ enableLongStackTrace: false }) }
-        ]);
-        service = injector.get(SearchService);
+        TestBed.configureTestingModule({
+            providers: [
+                SearchService,
+                {
+                    provide: NgZone,
+                    useFactory: () => new NgZone({ enableLongStackTrace: false }),
+                },
+            ],
+        });
+        service = TestBed.inject(SearchService);
     });
 
     describe('initWorker', () => {
diff --git a/projects/ngrx.io/src/app/shared/deployment.service.spec.ts b/projects/ngrx.io/src/app/shared/deployment.service.spec.ts
@@ -1,34 +1,34 @@
-import { ReflectiveInjector } from '@angular/core';
+import { TestBed } from '@angular/core/testing';
 import { environment } from 'environments/environment';
 import { LocationService } from 'app/shared/location.service';
 import { MockLocationService } from 'testing/location.service';
 import { Deployment } from './deployment.service';
 
 describe('Deployment service', () => {
     describe('mode', () => {
+        beforeEach(() => {
+            TestBed.configureTestingModule({
+                providers: [
+                    Deployment,
+                    { provide: LocationService, useFactory: () => new MockLocationService('') },
+                ],
+            });
+        });
+
         it('should get the mode from the environment', () => {
             environment.mode = 'foo';
-            const deployment = getInjector().get(Deployment);
+            const deployment = TestBed.inject(Deployment);
             expect(deployment.mode).toEqual('foo');
         });
 
         it('should get the mode from the `mode` query parameter if available', () => {
-            const injector = getInjector();
-
-            const locationService: MockLocationService = injector.get(
+            const locationService: MockLocationService = TestBed.inject(
                 LocationService
-            );
+            ) as unknown as MockLocationService;
             locationService.search.and.returnValue({ mode: 'bar' });
 
-            const deployment = injector.get(Deployment);
+            const deployment = TestBed.inject(Deployment);
             expect(deployment.mode).toEqual('bar');
         });
     });
 });
-
-function getInjector() {
-    return ReflectiveInjector.resolveAndCreate([
-        Deployment,
-        { provide: LocationService, useFactory: () => new MockLocationService('') },
-    ]);
-}
diff --git a/projects/ngrx.io/src/app/shared/ga.service.spec.ts b/projects/ngrx.io/src/app/shared/ga.service.spec.ts
@@ -1,22 +1,23 @@
-import { ReflectiveInjector } from '@angular/core';
+import { TestBed } from '@angular/core/testing';
 
 import { GaService } from 'app/shared/ga.service';
 import { WindowToken } from 'app/shared/window';
 
 describe('GaService', () => {
     let gaService: GaService;
-    let injector: ReflectiveInjector;
     let gaSpy: jasmine.Spy;
     let mockWindow: any;
 
     beforeEach(() => {
         gaSpy = jasmine.createSpy('ga');
         mockWindow = { ga: gaSpy };
-        injector = ReflectiveInjector.resolveAndCreate([
-            GaService,
-            { provide: WindowToken, useFactory: () => mockWindow },
-        ]);
-        gaService = injector.get(GaService);
+        TestBed.configureTestingModule({
+            providers: [
+                GaService,
+                { provide: WindowToken, useFactory: () => mockWindow },
+            ],
+        });
+        gaService = TestBed.inject(GaService);
     });
 
     it('should initialize ga with "create" when constructed', () => {
diff --git a/projects/ngrx.io/src/app/shared/location.service.spec.ts b/projects/ngrx.io/src/app/shared/location.service.spec.ts
@@ -1,4 +1,4 @@
-import { ReflectiveInjector } from '@angular/core';
+import { TestBed } from '@angular/core/testing';
 import { Location, LocationStrategy, PlatformLocation } from '@angular/common';
 import { MockLocationStrategy } from '@angular/common/testing';
 import { Subject } from 'rxjs';
@@ -8,24 +8,25 @@ import { SwUpdatesService } from 'app/sw-updates/sw-updates.service';
 import { LocationService } from './location.service';
 
 describe('LocationService', () => {
-    let injector: ReflectiveInjector;
     let location: MockLocationStrategy;
     let service: LocationService;
     let swUpdates: MockSwUpdatesService;
 
     beforeEach(() => {
-        injector = ReflectiveInjector.resolveAndCreate([
-            LocationService,
-            Location,
-            { provide: GaService, useClass: TestGaService },
-            { provide: LocationStrategy, useClass: MockLocationStrategy },
-            { provide: PlatformLocation, useClass: MockPlatformLocation },
-            { provide: SwUpdatesService, useClass: MockSwUpdatesService },
-        ]);
-
-        location = injector.get(LocationStrategy);
-        service = injector.get(LocationService);
-        swUpdates = injector.get(SwUpdatesService);
+        TestBed.configureTestingModule({
+            providers: [
+                LocationService,
+                Location,
+                { provide: GaService, useClass: TestGaService },
+                { provide: LocationStrategy, useClass: MockLocationStrategy },
+                { provide: PlatformLocation, useClass: MockPlatformLocation },
+                { provide: SwUpdatesService, useClass: MockSwUpdatesService },
+            ],
+        });
+
+        location = TestBed.inject(LocationStrategy) as MockLocationStrategy;
+        service = TestBed.inject(LocationService);
+        swUpdates = TestBed.inject(SwUpdatesService) as unknown as MockSwUpdatesService;
     });
 
     describe('currentUrl', () => {
@@ -340,7 +341,7 @@ describe('LocationService', () => {
         let platformLocation: MockPlatformLocation;
 
         beforeEach(() => {
-            platformLocation = injector.get(PlatformLocation);
+            platformLocation = TestBed.inject(PlatformLocation) as unknown as MockPlatformLocation;
         });
 
         it('should call replaceState on PlatformLocation', () => {
@@ -558,7 +559,7 @@ describe('LocationService', () => {
         let gaLocationChanged: jasmine.Spy;
 
         beforeEach(() => {
-            const gaService = injector.get(GaService);
+            const gaService = TestBed.inject(GaService) as unknown as TestGaService;
             gaLocationChanged = gaService.locationChanged;
             // execute currentPath observable so that gaLocationChanged is called
             service.currentPath.subscribe();
diff --git a/projects/ngrx.io/src/app/shared/location.service.ts b/projects/ngrx.io/src/app/shared/location.service.ts
@@ -17,7 +17,7 @@ export class LocationService {
     currentUrl = this.urlSubject.pipe(map(url => this.stripSlashes(url)));
 
     currentPath = this.currentUrl.pipe(
-        map(url => (url.match(/[^?#]*/) || [])[0]), // strip query and hash
+        map(url => (url.match(/[^?#]*/) || [])[0] as string), // strip query and hash
         tap(path => this.gaService.locationChanged(path))
     );
 
diff --git a/projects/ngrx.io/src/app/shared/logger.service.spec.ts b/projects/ngrx.io/src/app/shared/logger.service.spec.ts
@@ -1,4 +1,5 @@
-import { ErrorHandler, ReflectiveInjector } from '@angular/core';
+import { ErrorHandler } from '@angular/core';
+import { TestBed } from '@angular/core/testing';
 import { Logger } from './logger.service';
 
 describe('logger service', () => {
@@ -10,12 +11,14 @@ describe('logger service', () => {
     beforeEach(() => {
         logSpy = spyOn(console, 'log');
         warnSpy = spyOn(console, 'warn');
-        const injector = ReflectiveInjector.resolveAndCreate([
-            Logger,
-            { provide: ErrorHandler, useClass: MockErrorHandler },
-        ]);
-        logger = injector.get(Logger);
-        errorHandler = injector.get(ErrorHandler);
+        TestBed.configureTestingModule({
+            providers: [
+                Logger,
+                { provide: ErrorHandler, useClass: MockErrorHandler },
+            ],
+        });
+        logger = TestBed.inject(Logger);
+        errorHandler = TestBed.inject(ErrorHandler);
     });
 
     describe('log', () => {
diff --git a/projects/ngrx.io/src/app/shared/reporting-error-handler.spec.ts b/projects/ngrx.io/src/app/shared/reporting-error-handler.spec.ts
@@ -1,4 +1,4 @@
-import { ErrorHandler, ReflectiveInjector } from '@angular/core';
+import { ErrorHandler, Injector } from '@angular/core';
 import { TestBed } from '@angular/core/testing';
 import { WindowToken } from 'app/shared/window';
 import { AppModule } from 'app/app.module';
@@ -14,11 +14,13 @@ describe('ReportingErrorHandler service', () => {
         onerrorSpy = jasmine.createSpy('onerror');
         superHandler = spyOn(ErrorHandler.prototype, 'handleError');
 
-        const injector = ReflectiveInjector.resolveAndCreate([
-            { provide: ErrorHandler, useClass: ReportingErrorHandler },
-            { provide: WindowToken, useFactory: () => ({ onerror: onerrorSpy }) },
-        ]);
-        handler = injector.get(ErrorHandler);
+        const injector = Injector.create({
+            providers: [
+                { provide: ErrorHandler, useClass: ReportingErrorHandler },
+                { provide: WindowToken, useFactory: () => ({ onerror: onerrorSpy }) },
+            ],
+        });
+        handler = injector.get(ErrorHandler) as unknown as ReportingErrorHandler;
     });
 
     it('should be registered on the AppModule', () => {
diff --git a/projects/ngrx.io/src/app/shared/scroll-spy.service.spec.ts b/projects/ngrx.io/src/app/shared/scroll-spy.service.spec.ts
@@ -1,6 +1,4 @@
-import { Injector, ReflectiveInjector } from '@angular/core';
 import { fakeAsync, tick } from '@angular/core/testing';
-import { DOCUMENT } from '@angular/common';
 
 import { ScrollService } from 'app/shared/scroll.service';
 import {
@@ -154,17 +152,12 @@ describe('ScrollSpiedElementGroup', () => {
 });
 
 describe('ScrollSpyService', () => {
-    let injector: Injector;
     let scrollSpyService: ScrollSpyService;
+    let document: Document;
 
     beforeEach(() => {
-        injector = ReflectiveInjector.resolveAndCreate([
-            { provide: DOCUMENT, useValue: { body: {} } },
-            { provide: ScrollService, useValue: { topOffset: 50 } },
-            ScrollSpyService,
-        ]);
-
-        scrollSpyService = injector.get(ScrollSpyService);
+        document = { body: {} } as Document;
+        scrollSpyService = new ScrollSpyService(document, { topOffset: 50 } as ScrollService);
     });
 
     describe('#spyOn()', () => {
@@ -520,7 +513,7 @@ describe('ScrollSpyService', () => {
         });
 
         it('should first re-calibrate if the content height has changed', () => {
-            const body = injector.get(DOCUMENT).body as any;
+            const body = document.body as any;
 
             scrollSpyService.spyOn([]);
             scrollSpyService.spyOn([]);
diff --git a/projects/ngrx.io/src/app/shared/scroll.service.spec.ts b/projects/ngrx.io/src/app/shared/scroll.service.spec.ts
diff --git a/projects/ngrx.io/src/app/shared/toc.service.spec.ts b/projects/ngrx.io/src/app/shared/toc.service.spec.ts
diff --git a/projects/ngrx.io/src/app/sw-updates/sw-updates.service.spec.ts b/projects/ngrx.io/src/app/sw-updates/sw-updates.service.spec.ts
diff --git a/projects/ngrx.io/yarn.lock b/projects/ngrx.io/yarn.lock
