Merge pull request #1448 from webauthn4j/update-angular-to-18

Update Angular to 18

samples/lib/spa-angular-client/build.gradle

@@ -27,10 +27,10 @@ node {
   download = true
 
   // Version of node to use.
-  version = '18.18.2'
+  version = '20.14.0'
 
   // Version of npm to use.
-  npmVersion = '10.2.0'
+  npmVersion = '10.8.1'
 }
 
 npm_run_build {

samples/lib/spa-angular-client/package.json

@@ -17,18 +17,18 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^17.3.6",
-    "@angular/cdk": "^17.3.6",
-    "@angular/common": "^17.3.6",
-    "@angular/compiler": "^17.3.6",
-    "@angular/core": "^17.3.6",
-    "@angular/forms": "^17.3.6",
-    "@angular/localize": "^17.3.6",
-    "@angular/platform-browser": "^17.3.6",
-    "@angular/platform-browser-dynamic": "^17.3.6",
-    "@angular/router": "^17.3.6",
+    "@angular/animations": "^18.0.3",
+    "@angular/cdk": "^18.0.3",
+    "@angular/common": "^18.0.3",
+    "@angular/compiler": "^18.0.3",
+    "@angular/core": "^18.0.3",
+    "@angular/forms": "^18.0.3",
+    "@angular/localize": "^18.0.3",
+    "@angular/platform-browser": "^18.0.3",
+    "@angular/platform-browser-dynamic": "^18.0.3",
+    "@angular/router": "^18.0.3",
     "@fortawesome/fontawesome-free": "^6.5.2",
-    "@ng-bootstrap/ng-bootstrap": "^16.0.0",
+    "@ng-bootstrap/ng-bootstrap": "^17.0.0",
     "@popperjs/core": "^2.11.8",
     "bootstrap": "^5.3.3",
     "bowser": "^2.11.0",
@@ -38,10 +38,10 @@
     "zone.js": "~0.14.6"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^17.3.6",
-    "@angular/cli": "^17.3.6",
-    "@angular/compiler-cli": "^17.3.6",
-    "@angular/language-service": "^18.0.1",
+    "@angular-devkit/build-angular": "^18.0.4",
+    "@angular/cli": "^18.0.4",
+    "@angular/compiler-cli": "^18.0.3",
+    "@angular/language-service": "^18.0.3",
     "@types/base64-arraybuffer": "^0.2.0",
     "@types/jasmine": "~5.1.4",
     "@types/jasminewd2": "~2.0.13",
@@ -61,4 +61,4 @@
     "tslint": "~6.1.3",
     "typescript": "~5.4.5"
   }
-}
+}

samples/lib/spa-angular-client/src/app/app.module.ts

@@ -24,7 +24,7 @@ import {RouterModule} from "@angular/router";
 import {BrowserAnimationsModule} from "@angular/platform-browser/animations";
 import {NgbModule} from "@ng-bootstrap/ng-bootstrap"
 import {FormsModule} from "@angular/forms";
-import {HTTP_INTERCEPTORS, HttpClientModule} from "@angular/common/http";
+import { HTTP_INTERCEPTORS, provideHttpClient, withInterceptorsFromDi } from "@angular/common/http";
 import {AuthenticatorLoginComponent} from './authenticator-login/authenticator-login.component';
 import {PasswordLoginComponent} from './password-login/password-login.component';
 import {DashboardComponent} from "./dashboard/dashboard.component";
@@ -38,8 +38,7 @@ import {AuthGuard} from "./auth/auth.guard";
 import {AuthInterceptor} from "./auth/auth.interceptor";
 import {ResidentKeyRequirementDialogComponent} from './resident-key-requirement-dialog/resident-key-requirement-dialog.component';
 
-@NgModule({
-    declarations: [
+@NgModule({ declarations: [
         AppComponent,
         LoginComponent,
         AuthenticatorLoginComponent,
@@ -53,22 +52,17 @@ import {ResidentKeyRequirementDialogComponent} from './resident-key-requirement-
         HeaderComponent,
         ResidentKeyRequirementDialogComponent
     ],
-    imports: [
-        BrowserModule,
-        BrowserAnimationsModule,
-        AppRoutingModule,
-        HttpClientModule,
-        FormsModule,
-        NgbModule
-    ],
     exports: [
         RouterModule
     ],
-    providers: [
+    bootstrap: [AppComponent], imports: [BrowserModule,
+        BrowserAnimationsModule,
+        AppRoutingModule,
+        FormsModule,
+        NgbModule], providers: [
         AuthGuard,
         { provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true },
-    ],
-    bootstrap: [AppComponent]
-})
+        provideHttpClient(withInterceptorsFromDi()),
+    ] })
 export class AppModule {
 }

samples/lib/spa-angular-client/src/app/auth/auth.interceptor.ts

@@ -15,7 +15,7 @@
  */
 
 import {Injectable} from "@angular/core";
-import {HttpErrorResponse, HttpEvent, HttpHandler, HttpInterceptor, HttpRequest} from "@angular/common/http";
+import { HttpErrorResponse, HttpEvent, HttpHandler, HttpInterceptor, HttpRequest } from "@angular/common/http";
 import {Observable} from "rxjs/internal/Observable";
 import {throwError} from "rxjs";
 import {Router} from "@angular/router";

samples/lib/spa-angular-client/src/app/auth/auth.service.spec.ts

@@ -17,12 +17,14 @@
 import {TestBed} from '@angular/core/testing';
 
 import {AuthService} from './auth.service';
-import {HttpClientTestingModule} from "@angular/common/http/testing";
+import { provideHttpClientTesting } from "@angular/common/http/testing";
+import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';
 
 describe('AuthService', () => {
   beforeEach(() => TestBed.configureTestingModule({
-    imports: [HttpClientTestingModule]
-  }));
+    imports: [],
+    providers: [provideHttpClient(withInterceptorsFromDi()), provideHttpClientTesting()]
+}));
 
   it('should be created', () => {
     const service: AuthService = TestBed.get(AuthService);

samples/lib/spa-angular-client/src/app/auth/auth.service.ts

@@ -15,7 +15,7 @@
  */
 
 import {Injectable} from '@angular/core';
-import {HttpClient} from "@angular/common/http";
+import { HttpClient } from "@angular/common/http";
 import * as base64url from "../webauthn/base64url";
 import {WebAuthnService} from "../webauthn/web-authn.service";
 import {Observable} from "rxjs/internal/Observable";

samples/lib/spa-angular-client/src/app/profile/profile.service.ts

@@ -15,7 +15,7 @@
  */
 
 import {Injectable, OnInit} from '@angular/core';
-import {HttpClient} from "@angular/common/http";
+import { HttpClient } from "@angular/common/http";
 import {RegisteringAuthenticatorViewModel} from "../webauthn/registering-authenticator.view-model";
 import {WebAuthnService} from "../webauthn/web-authn.service";
 import {Observable} from "rxjs/internal/Observable";

samples/lib/spa-angular-client/src/app/webauthn/web-authn.service.spec.ts

@@ -20,8 +20,8 @@
 import {TestBed} from '@angular/core/testing';
 
 import {WebAuthnService} from './web-authn.service';
-import {HttpClientTestingModule, HttpTestingController} from "@angular/common/http/testing";
-import {HttpClient} from "@angular/common/http";
+import { HttpTestingController, provideHttpClientTesting } from "@angular/common/http/testing";
+import { HttpClient, provideHttpClient, withInterceptorsFromDi } from "@angular/common/http";
 
 describe('WebAuthnService', () => {
 
@@ -30,8 +30,9 @@ describe('WebAuthnService', () => {
 
   beforeEach(() => {
     TestBed.configureTestingModule({
-      imports: [HttpClientTestingModule]
-    });
+    imports: [],
+    providers: [provideHttpClient(withInterceptorsFromDi()), provideHttpClientTesting()]
+});
 
     httpClient = TestBed.get(HttpClient);
     httpTestingController = TestBed.get(HttpTestingController);

samples/lib/spa-angular-client/src/app/webauthn/web-authn.service.ts

@@ -18,7 +18,7 @@
 // DO NOT REMOVE: The above comment is mandatory to use webappsec-credential-management type definition
 
 import {Injectable} from '@angular/core';
-import {HttpClient} from "@angular/common/http";
+import { HttpClient } from "@angular/common/http";
 import * as base64url from "./base64url";
 import {WebAuthn4NgCredentialCreationOptions} from "./web-authn-4-ng-credential-creation-options";
 import {WebAuthn4NgCredentialRequestOptions} from "./web-authn-4-ng-credential-request-options";