fix jest tests

frontend/src/app/components/check-in-history-dialog/check-in-history-dialog.component.spec.ts

@@ -2,15 +2,18 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
 
 import { CheckInHistoryDialogComponent } from './check-in-history-dialog.component';
 import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from '@angular/material/dialog';
-import { HttpClientTestingModule } from '@angular/common/http/testing';
+import { provideHttpClientTesting } from '@angular/common/http/testing';
 import { checkInMetric, checkInMetricWriteableFalse, keyResult } from '../../shared/testData';
 import { By } from '@angular/platform-browser';
 import { DialogService } from '../../services/dialog.service';
 import { TranslateModule, TranslateService } from '@ngx-translate/core';
-import { DialogHeaderComponent } from '../../shared/custom/dialog-header/dialog-header.component';
 import { MatIconModule } from '@angular/material/icon';
 import { SpinnerComponent } from '../../shared/custom/spinner/spinner.component';
 import { MatProgressSpinner } from '@angular/material/progress-spinner';
+import { provideRouter } from '@angular/router';
+import { provideHttpClient } from '@angular/common/http';
+import { DialogTemplateCoreComponent } from '../../shared/custom/dialog-template-core/dialog-template-core.component';
+import { MatDividerModule } from '@angular/material/divider';
 
 const checkInService = {
   getAllCheckInOfKeyResult: jest.fn(),
@@ -22,10 +25,13 @@ describe('CheckInHistoryDialogComponent', () => {
 
   beforeEach(() => {
     TestBed.configureTestingModule({
-      declarations: [CheckInHistoryDialogComponent, DialogHeaderComponent, SpinnerComponent],
+      declarations: [CheckInHistoryDialogComponent, DialogTemplateCoreComponent, SpinnerComponent],
 
-      imports: [HttpClientTestingModule, TranslateModule.forRoot(), MatIconModule, MatProgressSpinner],
+      imports: [TranslateModule.forRoot(), MatIconModule, MatProgressSpinner, MatDividerModule, MatDialogModule],
       providers: [
+        provideRouter([]),
+        provideHttpClient(),
+        provideHttpClientTesting(),
         TranslateService,
         DialogService,
         { provide: MAT_DIALOG_DATA, useValue: { keyResult: keyResult } },

frontend/src/app/components/checkin/check-in-form/check-in-form.component.spec.ts

@@ -11,7 +11,6 @@ import {
   keyResultMetric,
   keyResultOrdinal,
 } from '../../../shared/testData';
-import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { MatIconModule } from '@angular/material/icon';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatSelectModule } from '@angular/material/select';
@@ -23,11 +22,16 @@ import { ParseUnitValuePipe } from '../../../shared/pipes/parse-unit-value/parse
 import { CheckInService } from '../../../services/check-in.service';
 import { of } from 'rxjs';
 import { ActionService } from '../../../services/action.service';
+// @ts-ignore
 import * as de from '../../../../assets/i18n/de.json';
 import { TranslateTestingModule } from 'ngx-translate-testing';
-import { DialogHeaderComponent } from '../../../shared/custom/dialog-header/dialog-header.component';
 import { ConfidenceComponent } from '../../confidence/confidence.component';
 import { MatSliderModule } from '@angular/material/slider';
+import { provideRouter } from '@angular/router';
+import { provideHttpClient } from '@angular/common/http';
+import { provideHttpClientTesting } from '@angular/common/http/testing';
+import { DialogTemplateCoreComponent } from '../../../shared/custom/dialog-template-core/dialog-template-core.component';
+import { MatDividerModule } from '@angular/material/divider';
 
 const dialogMock = {
   close: jest.fn(),
@@ -48,7 +52,6 @@ describe('CheckInFormComponent', () => {
   beforeEach(() => {
     TestBed.configureTestingModule({
       imports: [
-        HttpClientTestingModule,
         MatDialogModule,
         MatIconModule,
         MatFormFieldModule,
@@ -63,15 +66,19 @@ describe('CheckInFormComponent', () => {
         TranslateTestingModule.withTranslations({
           de: de,
         }),
+        MatDividerModule,
       ],
       providers: [
+        provideRouter([]),
+        provideHttpClient(),
+        provideHttpClientTesting(),
         { provide: MAT_DIALOG_DATA, useValue: { keyResult: {} } },
         { provide: MatDialogRef, useValue: dialogMock },
         { provide: CheckInService, useValue: checkInServiceMock },
         { provide: ActionService, useValue: actionServiceMock },
         ParseUnitValuePipe,
       ],
-      declarations: [CheckInFormComponent, DialogHeaderComponent, ConfidenceComponent],
+      declarations: [CheckInFormComponent, DialogTemplateCoreComponent, ConfidenceComponent],
     });
     fixture = TestBed.createComponent(CheckInFormComponent);
     component = fixture.componentInstance;

frontend/src/app/shared/dialog/complete-dialog/complete-dialog.component.spec.ts

@@ -25,6 +25,7 @@ let matDataMock: { objective: { objectiveId: number | undefined; teamId: number
 describe('CompleteDialogComponent', () => {
   let component: CompleteDialogComponent;
   let fixture: ComponentFixture<CompleteDialogComponent>;
+  let debugElement: any;
 
   beforeEach(() => {
     TestBed.configureTestingModule({
@@ -42,6 +43,7 @@ describe('CompleteDialogComponent', () => {
     fixture = TestBed.createComponent(CompleteDialogComponent);
     component = fixture.componentInstance;
     fixture.detectChanges();
+    debugElement = fixture.debugElement.nativeElement;
   });
 
   it('should create', () => {
@@ -52,7 +54,7 @@ describe('CompleteDialogComponent', () => {
     let elements = document.querySelectorAll('.valuation-card');
     let successful = document.querySelectorAll('.card-hover-successful');
     let notSuccessful = document.querySelectorAll('.card-hover-not-successful');
-    let submitButton = document.querySelectorAll('button')[0];
+    let submitButton = debugElement.querySelector('[data-testid="submit"]');
 
     expect(elements.length).toEqual(2);
     expect(successful.length).toEqual(1);
@@ -66,7 +68,7 @@ describe('CompleteDialogComponent', () => {
   it('should change isSuccessful value on card click and remove class card-hover', () => {
     component.switchSuccessState('successful');
     let elements = document.querySelectorAll('.card-hover');
-    let submitButton = document.querySelectorAll('button')[1];
+    let submitButton = debugElement.querySelector('[data-testid="submit"]');
 
     expect(component.completeForm.value.isSuccessful).toBeTruthy();
     expect(component.completeForm.invalid).toBeFalsy();

frontend/src/app/shared/dialog/confirm-dialog/confirm-dialog.component.spec.ts

@@ -11,9 +11,10 @@ import { MatInputModule } from '@angular/material/input';
 import { MatRadioModule } from '@angular/material/radio';
 import { ReactiveFormsModule } from '@angular/forms';
 import { TranslateModule, TranslateService } from '@ngx-translate/core';
-import { DialogHeaderComponent } from '../../custom/dialog-header/dialog-header.component';
 import { MatIconModule } from '@angular/material/icon';
 import { ConfirmDialogData } from '../../../services/dialog.service';
+import { DialogTemplateCoreComponent } from '../../custom/dialog-template-core/dialog-template-core.component';
+import { MatDividerModule } from '@angular/material/divider';
 
 const dialogRefMock = {
   close: jest.fn(),
@@ -35,8 +36,9 @@ describe('ConfirmDialogComponent', () => {
         ReactiveFormsModule,
         TranslateModule.forRoot(),
         MatIconModule,
+        MatDividerModule,
       ],
-      declarations: [ConfirmDialogComponent, DialogHeaderComponent],
+      declarations: [ConfirmDialogComponent, DialogTemplateCoreComponent],
       providers: [
         TranslateService,
         { provide: MAT_DIALOG_DATA, useValue: { title: '', text: '' } as ConfirmDialogData },

frontend/src/app/team-management/member-detail/member-detail.component.spec.ts

@@ -1,7 +1,6 @@
 import { ComponentFixture, fakeAsync, TestBed, tick } from '@angular/core/testing';
 import { MemberDetailComponent } from './member-detail.component';
-import { HttpClientTestingModule } from '@angular/common/http/testing';
-import { ActivatedRoute } from '@angular/router';
+import { ActivatedRoute, provideRouter } from '@angular/router';
 import { delay, of } from 'rxjs';
 import { TranslateModule } from '@ngx-translate/core';
 import { BrowserModule } from '@angular/platform-browser';
@@ -18,6 +17,9 @@ import { PuzzleIconComponent } from '../../shared/custom/puzzle-icon/puzzle-icon
 import { CommonModule } from '@angular/common';
 import { NO_ERRORS_SCHEMA } from '@angular/core';
 import { DialogService } from '../../services/dialog.service';
+import { provideHttpClient } from '@angular/common/http';
+import { provideHttpClientTesting } from '@angular/common/http/testing';
+import { DialogTemplateCoreComponent } from '../../shared/custom/dialog-template-core/dialog-template-core.component';
 
 describe('MemberDetailComponent', () => {
   let component: MemberDetailComponent;
@@ -44,6 +46,7 @@ describe('MemberDetailComponent', () => {
 
   const dialogServiceMock = {
     open: jest.fn(),
+    openConfirmDialog: jest.fn(),
   };
 
   beforeEach(async () => {
@@ -54,17 +57,13 @@ describe('MemberDetailComponent', () => {
         ShowEditRoleComponent,
         PuzzleIconButtonComponent,
         PuzzleIconComponent,
+        DialogTemplateCoreComponent,
       ],
-      imports: [
-        HttpClientTestingModule,
-        TranslateModule.forRoot(),
-        BrowserModule,
-        SharedModule,
-        MatTableModule,
-        MatIconModule,
-        CommonModule,
-      ],
+      imports: [TranslateModule.forRoot(), BrowserModule, SharedModule, MatTableModule, MatIconModule, CommonModule],
       providers: [
+        provideRouter([]),
+        provideHttpClient(),
+        provideHttpClientTesting(),
         { provide: ActivatedRoute, useValue: activatedRouteMock },
         { provide: UserService, useValue: userServiceMock },
         { provide: TeamService, useValue: teamServiceMock },
@@ -112,7 +111,7 @@ describe('MemberDetailComponent', () => {
     const userTeam = testUser.userTeamList[0];
     teamServiceMock.removeUserFromTeam.mockReturnValue(of());
     userServiceMock.getUserById.mockReturnValue(of(user));
-    dialogServiceMock.open.mockReturnValue({
+    dialogServiceMock.openConfirmDialog.mockReturnValue({
       afterClosed: () => of(true),
     });
 
@@ -129,7 +128,7 @@ describe('MemberDetailComponent', () => {
     const userTeam = testUser.userTeamList[0];
     teamServiceMock.removeUserFromTeam.mockReturnValue(of());
     userServiceMock.getUserById.mockReturnValue(of(user));
-    dialogServiceMock.open.mockReturnValue({
+    dialogServiceMock.openConfirmDialog.mockReturnValue({
       afterClosed: () => of(false),
     });
 

frontend/src/app/team-management/member-list/member-list-table/member-list-table.component.spec.ts

@@ -29,6 +29,7 @@ describe('MemberListTableComponent', () => {
 
   const dialogService = {
     open: jest.fn(),
+    openConfirmDialog: jest.fn(),
   };
 
   beforeEach(async () => {
@@ -94,7 +95,7 @@ describe('MemberListTableComponent', () => {
     teamServiceMock.removeUserFromTeam.mockReturnValue(of(null));
     userServiceMock.reloadUsers.mockReturnValue(of());
     userServiceMock.reloadCurrentUser.mockReturnValue(of());
-    dialogService.open.mockReturnValue({
+    dialogService.openConfirmDialog.mockReturnValue({
       afterClosed: () => of(true),
     });
 
@@ -115,7 +116,7 @@ describe('MemberListTableComponent', () => {
     teamServiceMock.removeUserFromTeam.mockReturnValue(of(null));
     userServiceMock.reloadUsers.mockReturnValue(of());
     userServiceMock.reloadCurrentUser.mockReturnValue(of());
-    dialogService.open.mockReturnValue({
+    dialogService.openConfirmDialog.mockReturnValue({
       afterClosed: () => of(false),
     });
 

frontend/src/app/team-management/member-list/member-list.component.spec.ts

@@ -1,10 +1,10 @@
 import { ComponentFixture, fakeAsync, TestBed, tick } from '@angular/core/testing';
-import { ActivatedRoute, Router } from '@angular/router';
+import { ActivatedRoute, provideRouter, Router } from '@angular/router';
 import { ChangeDetectorRef } from '@angular/core';
 import { of } from 'rxjs';
 import { MemberListComponent } from './member-list.component';
 import { UserService } from '../../services/user.service';
-import { HttpClientTestingModule } from '@angular/common/http/testing';
+import { provideHttpClientTesting } from '@angular/common/http/testing';
 import { User } from '../../shared/types/model/User';
 import { team1, team2, team3, testUser, users } from '../../shared/testData';
 import { convertFromUser, convertFromUsers, UserTableEntry } from '../../shared/types/model/UserTableEntry';
@@ -18,6 +18,7 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { MemberListTableComponent } from './member-list-table/member-list-table.component';
 import { MemberListMobileComponent } from './member-list-mobile/member-list-mobile.component';
 import { DialogService } from '../../services/dialog.service';
+import { provideHttpClient } from '@angular/common/http';
 
 const userServiceMock = {
   getUsers: jest.fn(),
@@ -42,6 +43,7 @@ const routerMock = {
 
 const dialogService = {
   open: jest.fn(),
+  openConfirmDialog: jest.fn(),
 };
 
 describe('MemberListComponent', () => {
@@ -51,8 +53,11 @@ describe('MemberListComponent', () => {
   beforeEach(() => {
     TestBed.configureTestingModule({
       declarations: [MemberListComponent, MemberListTableComponent, MemberListMobileComponent],
-      imports: [HttpClientTestingModule, TranslateTestingModule, BrowserAnimationsModule],
+      imports: [TranslateTestingModule, BrowserAnimationsModule],
       providers: [
+        provideRouter([]),
+        provideHttpClient(),
+        provideHttpClientTesting(),
         { provide: UserService, useValue: userServiceMock },
         { provide: ActivatedRoute, useValue: activatedRouteMock },
         { provide: TeamService, useValue: teamServiceMock },
@@ -180,7 +185,7 @@ describe('MemberListComponent', () => {
   it('deleteTeam should trigger teamService.deleteTeam and navigate', fakeAsync(() => {
     routerMock.navigateByUrl.mockReturnValue(of(null));
     teamServiceMock.deleteTeam.mockReturnValue(of(null));
-    dialogService.open.mockReturnValue({
+    dialogService.openConfirmDialog.mockReturnValue({
       afterClosed: () => of(true),
     });
 
@@ -200,7 +205,7 @@ describe('MemberListComponent', () => {
   it('deleteTeam should not trigger teamService.deleteTeam if dialog is canceled', fakeAsync(() => {
     routerMock.navigateByUrl.mockReturnValue(of(null));
     teamServiceMock.deleteTeam.mockReturnValue(of(null));
-    dialogService.open.mockReturnValue({
+    dialogService.openConfirmDialog.mockReturnValue({
       afterClosed: () => of(false),
     });