update failing frontend unit tests after changing auth lib

puzzle · Aug 30, 2024 · 12b668b · 12b668b
1 parent e48e838
commit 12b668b
Show file tree

Hide file tree

Showing 10 changed files with 113 additions and 87 deletions.
diff --git a/frontend/src/app/app.component.spec.ts b/frontend/src/app/app.component.spec.ts
@@ -1,5 +1,4 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { RouterTestingModule } from '@angular/router/testing';
 import { AppComponent } from './app.component';
 import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
 import { TranslateTestingModule } from 'ngx-translate-testing';
@@ -10,31 +9,12 @@ import { HarnessLoader } from '@angular/cdk/testing';
 import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
 import { MatSidenavModule } from '@angular/material/sidenav';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
-import { NavigationEnd, Routes } from '@angular/router';
+import { RouterModule, Routes } from '@angular/router';
 import { of } from 'rxjs';
 import { OverviewComponent } from './overview/overview.component';
 import { ObjectiveDetailComponent } from './objective-detail/objective-detail.component';
 import { CommonModule } from '@angular/common';
-import { OpenIdConfiguration } from 'angular-auth-oidc-client';
-
-const oauthServiceMock = {
-  configure(environment: OpenIdConfiguration): void {},
-  initCodeFlow(): void {},
-  setupAutomaticSilentRefresh(): void {},
-  hasValidAccessToken(): boolean {
-    return true;
-  },
-  loadDiscoveryDocumentAndTryLogin(): Promise<any> {
-    this.initCodeFlow();
-    return Promise.resolve();
-  },
-};
-
-const routerMock = {
-  root: jest.fn(),
-  // Router
-  events: of(new NavigationEnd(0, 'http://localhost:4200/objective/2', 'http://localhost:4200/objective/2')),
-};
+import { StsConfigLoader } from 'angular-auth-oidc-client';
 
 const routes: Routes = [
   {
@@ -52,17 +32,24 @@ describe('AppComponent', () => {
   beforeEach(async () => {
     await TestBed.configureTestingModule({
       imports: [
-        RouterTestingModule.withRoutes(routes),
+        RouterModule.forRoot(routes),
         HttpClientTestingModule,
         TranslateTestingModule.withTranslations({
           de: de,
         }),
-        // OAuthModule.forRoot(),
         MatSidenavModule,
         NoopAnimationsModule,
         CommonModule,
       ],
-      // providers: [{ provide: OAuthService, useValue: oauthServiceMock }],
+      providers: [
+        {
+          provide: StsConfigLoader,
+          useValue: {
+            loadConfig: () => of({}),
+            loadConfigs: () => of({}),
+          },
+        },
+      ],
       declarations: [AppComponent, OverviewComponent],
       schemas: [CUSTOM_ELEMENTS_SCHEMA],
     })

diff --git a/frontend/src/app/application-top-bar/application-top-bar.component.spec.ts b/frontend/src/app/application-top-bar/application-top-bar.component.spec.ts
@@ -1,8 +1,6 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-
 import { ApplicationTopBarComponent } from './application-top-bar.component';
 import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-// import { DateTimeProvider, OAuthLogger, OAuthService, UrlHelperService } from 'angular-oauth2-oidc';
 import { HttpClient, HttpHandler } from '@angular/common/http';
 import { MatMenuModule } from '@angular/material/menu';
 import { HarnessLoader } from '@angular/cdk/testing';
@@ -13,11 +11,11 @@ import { MatDialog, MatDialogModule } from '@angular/material/dialog';
 import { of } from 'rxjs';
 import { team1 } from '../shared/testData';
 import { OidcSecurityService } from 'angular-auth-oidc-client';
+import { NgOptimizedImage } from '@angular/common';
 
 const oAuthMock = {
-  getIdentityClaims: jest.fn(),
-  logOut: jest.fn(),
-  hasValidIdToken: jest.fn(),
+  getUserData: jest.fn(),
+  logOff: jest.fn(),
 };
 
 const dialogMock = {
@@ -31,7 +29,7 @@ describe('ApplicationHeaderComponent', () => {
 
   beforeEach(() => {
     TestBed.configureTestingModule({
-      imports: [MatMenuModule, NoopAnimationsModule, MatDialogModule],
+      imports: [MatMenuModule, NoopAnimationsModule, MatDialogModule, NgOptimizedImage],
       declarations: [ApplicationTopBarComponent],
       providers: [
         { provide: OidcSecurityService, useValue: oAuthMock },
@@ -58,12 +56,14 @@ describe('ApplicationHeaderComponent', () => {
   });
 
   it('logout function should get called on button click', async () => {
+    oAuthMock.getUserData.mockReturnValue(of({ name: 'Username' }));
+
     const harness = await loader.getHarness(MatMenuHarness);
     await harness.open();
     fixture.detectChanges();
     harness.getItems().then((items) => {
       items[0].click();
-      expect(oAuthMock.logOut).toBeCalledTimes(1);
+      expect(oAuthMock.logOff).toHaveBeenCalledTimes(1);
     });
   });
 

diff --git a/frontend/src/app/objective-filter/objective-filter.component.spec.ts b/frontend/src/app/objective-filter/objective-filter.component.spec.ts
@@ -15,24 +15,35 @@ import { Router } from '@angular/router';
 import { RouterTestingHarness } from '@angular/router/testing';
 import { authGuard } from '../shared/guards/auth.guard';
 import { OverviewComponent } from '../overview/overview.component';
+import { AbstractLoggerService, AutoLoginPartialRoutesGuard, StsConfigLoader } from 'angular-auth-oidc-client';
+import { of } from 'rxjs';
 
 describe('ObjectiveFilterComponent', () => {
   let component: ObjectiveFilterComponent;
   let fixture: ComponentFixture<ObjectiveFilterComponent>;
   let loader: HarnessLoader;
   let router: Router;
 
-  const authGuardMock = () => {
-    return Promise.resolve(true);
-  };
-
   beforeEach(() => {
     TestBed.configureTestingModule({
       declarations: [ObjectiveFilterComponent, OverviewComponent],
       providers: [
         {
-          provide: authGuard,
-          useValue: authGuardMock,
+          provide: StsConfigLoader,
+          useValue: {
+            loadConfig: () => of({}),
+            loadConfigs: () => of([{}]),
+          },
+        },
+        {
+          provide: AbstractLoggerService,
+          useValue: {
+            logError: () => of({}),
+          },
+        },
+        {
+          provide: AutoLoginPartialRoutesGuard,
+          useValue: () => Promise.resolve(true),
         },
       ],
       imports: [

diff --git a/frontend/src/app/overview/overview.component.spec.ts b/frontend/src/app/overview/overview.component.spec.ts
@@ -14,6 +14,8 @@ import { MatDialogModule, MatDialogRef } from '@angular/material/dialog';
 import { MatIconModule } from '@angular/material/icon';
 import { MatMenuModule } from '@angular/material/menu';
 import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { AbstractLoggerService, AutoLoginPartialRoutesGuard, StsConfigLoader } from 'angular-auth-oidc-client';
+import { NgOptimizedImage } from '@angular/common';
 
 const overviewService = {
   getOverview: jest.fn(),
@@ -44,16 +46,23 @@ describe('OverviewComponent', () => {
   let fixture: ComponentFixture<OverviewComponent>;
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      imports: [HttpClientTestingModule, AppRoutingModule, MatDialogModule, MatIconModule, MatMenuModule],
+      imports: [
+        HttpClientTestingModule,
+        AppRoutingModule,
+        MatDialogModule,
+        MatIconModule,
+        MatMenuModule,
+        NgOptimizedImage,
+      ],
       declarations: [OverviewComponent, ApplicationBannerComponent, ApplicationTopBarComponent],
       providers: [
         {
           provide: OverviewService,
           useValue: overviewService,
         },
         {
-          provide: authGuard,
-          useValue: authGuardMock,
+          provide: AutoLoginPartialRoutesGuard,
+          useValue: () => Promise.resolve(true),
         },
         {
           provide: RefreshDataService,
@@ -63,10 +72,19 @@ describe('OverviewComponent', () => {
           provide: MatDialogRef,
           useValue: {},
         },
-        // OAuthService,
-        // UrlHelperService,
-        // OAuthLogger,
-        // DateTimeProvider,
+        {
+          provide: StsConfigLoader,
+          useValue: {
+            loadConfig: () => of({}),
+            loadConfigs: () => of([{}]),
+          },
+        },
+        {
+          provide: AbstractLoggerService,
+          useValue: {
+            logError: () => of({}),
+          },
+        },
       ],
       schemas: [CUSTOM_ELEMENTS_SCHEMA],
     }).compileComponents();

diff --git a/frontend/src/app/shared/dialog/key-result-form/key-result-form.component.spec.ts b/frontend/src/app/shared/dialog/key-result-form/key-result-form.component.spec.ts
@@ -15,7 +15,6 @@ import { MatRadioModule } from '@angular/material/radio';
 import { KeyResultObjective } from '../../types/model/KeyResultObjective';
 import { User } from '../../types/model/User';
 import { DialogHeaderComponent } from '../../custom/dialog-header/dialog-header.component';
-import { OAuthService } from 'angular-oauth2-oidc';
 import { KeyresultTypeComponent } from '../../../keyresult-type/keyresult-type.component';
 import { ActionPlanComponent } from '../../../action-plan/action-plan.component';
 import { TranslateModule, TranslateService } from '@ngx-translate/core';
@@ -26,15 +25,17 @@ import { Action } from '../../types/model/Action';
 import { KeyResultMetric } from '../../types/model/KeyResultMetric';
 import { KeyResultOrdinal } from '../../types/model/KeyResultOrdinal';
 import { TranslateTestingModule } from 'ngx-translate-testing';
+// @ts-ignore
 import * as de from '../../../../assets/i18n/de.json';
+import { OidcSecurityService } from 'angular-auth-oidc-client';
 
 describe('KeyResultFormComponent', () => {
   let component: KeyResultFormComponent;
   let fixture: ComponentFixture<KeyResultFormComponent>;
 
   const oauthMockService = {
-    getIdentityClaims() {
-      return { name: users[1].firstname + ' ' + users[1].lastname };
+    getUserData() {
+      return of({ name: users[1].firstname + ' ' + users[1].lastname });
     },
   };
 
@@ -115,7 +116,7 @@ describe('KeyResultFormComponent', () => {
             useValue: matDialogRefMock,
           },
           {
-            provide: OAuthService,
+            provide: OidcSecurityService,
             useValue: oauthMockService,
           },
         ],
@@ -233,7 +234,9 @@ describe('KeyResultFormComponent', () => {
     });
 
     it('should get username from oauthService  right', () => {
-      expect(component.getUserName()).toEqual('Paco Egiman');
+      component.getUserName().subscribe((userName) => {
+        expect(userName).toEqual('Bob Baumeister');
+      });
     });
   });
 });
diff --git a/frontend/src/app/shared/dialog/key-result-form/key-result-form.component.ts b/frontend/src/app/shared/dialog/key-result-form/key-result-form.component.ts
@@ -4,7 +4,7 @@ import { User } from '../../types/model/User';
 import { KeyResult } from '../../types/model/KeyResult';
 import { KeyResultMetric } from '../../types/model/KeyResultMetric';
 import { KeyResultOrdinal } from '../../types/model/KeyResultOrdinal';
-import { BehaviorSubject, filter, map, Observable, of, startWith, switchMap } from 'rxjs';
+import { BehaviorSubject, filter, map, Observable, of, startWith, switchMap, tap } from 'rxjs';
 import { UserService } from '../../services/user.service';
 import { Action } from '../../types/model/Action';
 import { formInputCheck, hasFormFieldErrors } from '../../common';

diff --git a/frontend/src/app/shared/dialog/keyresult-dialog/keyresult-dialog.component.spec.ts b/frontend/src/app/shared/dialog/keyresult-dialog/keyresult-dialog.component.spec.ts
@@ -17,22 +17,22 @@ import { MatSelectModule } from '@angular/material/select';
 import { MatRadioModule } from '@angular/material/radio';
 import { KeyResultObjective } from '../../types/model/KeyResultObjective';
 import { DialogHeaderComponent } from '../../custom/dialog-header/dialog-header.component';
-import { OAuthService } from 'angular-oauth2-oidc';
 import { KeyresultTypeComponent } from '../../../keyresult-type/keyresult-type.component';
 import { ActionPlanComponent } from '../../../action-plan/action-plan.component';
 import { TranslateModule, TranslateService } from '@ngx-translate/core';
 import { DragDropModule } from '@angular/cdk/drag-drop';
 import { UserService } from '../../services/user.service';
 import { KeyResultFormComponent } from '../key-result-form/key-result-form.component';
+import { OidcSecurityService } from 'angular-auth-oidc-client';
 
 describe('KeyresultDialogComponent', () => {
   let component: KeyresultDialogComponent;
   let fixture: ComponentFixture<KeyresultDialogComponent>;
   let keyResultService: KeyresultService;
 
   const oauthMockService = {
-    getIdentityClaims() {
-      return { name: users[1].firstname + ' ' + users[1].lastname };
+    getUserData() {
+      return of({ name: users[1].firstname + ' ' + users[1].lastname });
     },
   };
 
@@ -277,7 +277,7 @@ describe('KeyresultDialogComponent', () => {
             useValue: { objective: fullObjective, keyResult: undefined },
           },
           {
-            provide: OAuthService,
+            provide: OidcSecurityService,
             useValue: oauthMockService,
           },
         ],
@@ -419,7 +419,7 @@ describe('KeyresultDialogComponent', () => {
             },
           },
           {
-            provide: OAuthService,
+            provide: OidcSecurityService,
             useValue: oauthMockService,
           },
           {
@@ -562,7 +562,7 @@ describe('KeyresultDialogComponent', () => {
             useValue: matDialogRefMock,
           },
           {
-            provide: OAuthService,
+            provide: OidcSecurityService,
             useValue: oauthMockService,
           },
           {