vitest implementation

src/app/widget-modules/components/add-song/add-song.component.spec.ts

@@ -1,4 +1,4 @@
-import {ComponentFixture, TestBed, waitForAsync} from '@angular/core/testing';
+import {ComponentFixture, TestBed} from '@angular/core/testing';
 
 import {AddSongComponent} from './add-song.component';
 
@@ -6,11 +6,11 @@ describe('AddSongComponent', () => {
   let component: AddSongComponent;
   let fixture: ComponentFixture<AddSongComponent>;
 
-  beforeEach(waitForAsync(() => {
-    void TestBed.configureTestingModule({
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
       imports: [AddSongComponent],
     }).compileComponents();
-  }));
+  });
 
   beforeEach(() => {
     fixture = TestBed.createComponent(AddSongComponent);

src/app/widget-modules/components/application-frame/navigation/brand/brand.component.spec.ts

@@ -1,4 +1,4 @@
-import {ComponentFixture, TestBed, waitForAsync} from '@angular/core/testing';
+import {ComponentFixture, TestBed} from '@angular/core/testing';
 
 import {BrandComponent} from './brand.component';
 
@@ -6,11 +6,11 @@ describe('BrandComponent', () => {
   let component: BrandComponent;
   let fixture: ComponentFixture<BrandComponent>;
 
-  beforeEach(waitForAsync(() => {
-    void TestBed.configureTestingModule({
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
       imports: [BrandComponent],
     }).compileComponents();
-  }));
+  });
 
   beforeEach(() => {
     fixture = TestBed.createComponent(BrandComponent);

src/app/widget-modules/components/application-frame/navigation/filter/filter.component.spec.ts

@@ -1,4 +1,4 @@
-import {ComponentFixture, TestBed, waitForAsync} from '@angular/core/testing';
+import {ComponentFixture, TestBed} from '@angular/core/testing';
 
 import {FilterComponent} from './filter.component';
 
@@ -6,11 +6,11 @@ describe('FilterComponent', () => {
   let component: FilterComponent;
   let fixture: ComponentFixture<FilterComponent>;
 
-  beforeEach(waitForAsync(() => {
-    void TestBed.configureTestingModule({
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
       imports: [FilterComponent],
     }).compileComponents();
-  }));
+  });
 
   beforeEach(() => {
     fixture = TestBed.createComponent(FilterComponent);

src/app/widget-modules/components/application-frame/navigation/link/link.component.spec.ts

@@ -1,4 +1,4 @@
-import {ComponentFixture, TestBed, waitForAsync} from '@angular/core/testing';
+import {ComponentFixture, TestBed} from '@angular/core/testing';
 
 import {LinkComponent} from './link.component';
 
@@ -6,11 +6,11 @@ describe('LinkComponent', () => {
   let component: LinkComponent;
   let fixture: ComponentFixture<LinkComponent>;
 
-  beforeEach(waitForAsync(() => {
-    void TestBed.configureTestingModule({
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
       imports: [LinkComponent],
     }).compileComponents();
-  }));
+  });
 
   beforeEach(() => {
     fixture = TestBed.createComponent(LinkComponent);

src/app/widget-modules/components/application-frame/navigation/navigation.component.spec.ts

@@ -1,4 +1,4 @@
-import {ComponentFixture, TestBed, waitForAsync} from '@angular/core/testing';
+import {ComponentFixture, TestBed} from '@angular/core/testing';
 
 import {NavigationComponent} from './navigation.component';
 
@@ -6,11 +6,11 @@ describe('NavigationComponent', () => {
   let component: NavigationComponent;
   let fixture: ComponentFixture<NavigationComponent>;
 
-  beforeEach(waitForAsync(() => {
-    void TestBed.configureTestingModule({
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
       imports: [NavigationComponent],
     }).compileComponents();
-  }));
+  });
 
   beforeEach(() => {
     fixture = TestBed.createComponent(NavigationComponent);

src/app/widget-modules/components/button-row/button-row.component.spec.ts

@@ -1,4 +1,4 @@
-import {ComponentFixture, TestBed, waitForAsync} from '@angular/core/testing';
+import {ComponentFixture, TestBed} from '@angular/core/testing';
 
 import {ButtonRowComponent} from './button-row.component';
 
@@ -6,11 +6,11 @@ describe('ButtonRowComponent', () => {
   let component: ButtonRowComponent;
   let fixture: ComponentFixture<ButtonRowComponent>;
 
-  beforeEach(waitForAsync(() => {
-    void TestBed.configureTestingModule({
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
       imports: [ButtonRowComponent],
     }).compileComponents();
-  }));
+  });
 
   beforeEach(() => {
     fixture = TestBed.createComponent(ButtonRowComponent);

src/app/widget-modules/components/button/button.component.spec.ts

@@ -1,4 +1,4 @@
-import {ComponentFixture, TestBed, waitForAsync} from '@angular/core/testing';
+import {ComponentFixture, TestBed} from '@angular/core/testing';
 
 import {ButtonComponent} from './button.component';
 
@@ -6,11 +6,11 @@ describe('ButtonComponent', () => {
   let component: ButtonComponent;
   let fixture: ComponentFixture<ButtonComponent>;
 
-  beforeEach(waitForAsync(() => {
-    void TestBed.configureTestingModule({
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
       imports: [ButtonComponent],
     }).compileComponents();
-  }));
+  });
 
   beforeEach(() => {
     fixture = TestBed.createComponent(ButtonComponent);

src/app/widget-modules/components/card/card.component.spec.ts

@@ -1,4 +1,4 @@
-import {ComponentFixture, TestBed, waitForAsync} from '@angular/core/testing';
+import {ComponentFixture, TestBed} from '@angular/core/testing';
 
 import {CardComponent} from './card.component';
 
@@ -6,11 +6,11 @@ describe('CardComponent', () => {
   let component: CardComponent;
   let fixture: ComponentFixture<CardComponent>;
 
-  beforeEach(waitForAsync(() => {
-    void TestBed.configureTestingModule({
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
       imports: [CardComponent],
     }).compileComponents();
-  }));
+  });
 
   beforeEach(() => {
     fixture = TestBed.createComponent(CardComponent);

src/app/widget-modules/components/list-header/list-header.component.spec.ts

@@ -1,4 +1,4 @@
-import {ComponentFixture, TestBed, waitForAsync} from '@angular/core/testing';
+import {ComponentFixture, TestBed} from '@angular/core/testing';
 
 import {ListHeaderComponent} from './list-header.component';
 
@@ -6,11 +6,11 @@ describe('ListHeaderComponent', () => {
   let component: ListHeaderComponent;
   let fixture: ComponentFixture<ListHeaderComponent>;
 
-  beforeEach(waitForAsync(() => {
-    void TestBed.configureTestingModule({
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
       imports: [ListHeaderComponent],
     }).compileComponents();
-  }));
+  });
 
   beforeEach(() => {
     fixture = TestBed.createComponent(ListHeaderComponent);

src/app/widget-modules/components/logo/logo.component.spec.ts

@@ -1,4 +1,4 @@
-import {ComponentFixture, TestBed, waitForAsync} from '@angular/core/testing';
+import {ComponentFixture, TestBed} from '@angular/core/testing';
 
 import {LogoComponent} from './logo.component';
 
@@ -6,11 +6,11 @@ describe('LogoComponent', () => {
   let component: LogoComponent;
   let fixture: ComponentFixture<LogoComponent>;
 
-  beforeEach(waitForAsync(() => {
-    void TestBed.configureTestingModule({
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
       imports: [LogoComponent],
     }).compileComponents();
-  }));
+  });
 
   beforeEach(() => {
     fixture = TestBed.createComponent(LogoComponent);

src/app/widget-modules/components/menu-button/menu-button.component.spec.ts

@@ -1,4 +1,4 @@
-import {ComponentFixture, TestBed, waitForAsync} from '@angular/core/testing';
+import {ComponentFixture, TestBed} from '@angular/core/testing';
 
 import {MenuButtonComponent} from './menu-button.component';
 
@@ -6,11 +6,11 @@ describe('MenuButtonComponent', () => {
   let component: MenuButtonComponent;
   let fixture: ComponentFixture<MenuButtonComponent>;
 
-  beforeEach(waitForAsync(() => {
-    void TestBed.configureTestingModule({
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
       imports: [MenuButtonComponent],
     }).compileComponents();
-  }));
+  });
 
   beforeEach(() => {
     fixture = TestBed.createComponent(MenuButtonComponent);

src/app/widget-modules/components/song-text/song-text.component.spec.ts

@@ -1,4 +1,4 @@
-import {ComponentFixture, TestBed, waitForAsync} from '@angular/core/testing';
+import {ComponentFixture, TestBed} from '@angular/core/testing';
 
 import {SongTextComponent} from './song-text.component';
 
@@ -6,11 +6,11 @@ describe('SongTextComponent', () => {
   let component: SongTextComponent;
   let fixture: ComponentFixture<SongTextComponent>;
 
-  beforeEach(waitForAsync(() => {
-    void TestBed.configureTestingModule({
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
       imports: [SongTextComponent],
     }).compileComponents();
-  }));
+  });
 
   beforeEach(() => {
     fixture = TestBed.createComponent(SongTextComponent);

src/app/widget-modules/guards/role.guard.spec.ts

@@ -1,6 +1,6 @@
 import {TestBed} from '@angular/core/testing';
 import {Router} from '@angular/router';
-import {of} from 'rxjs';
+import {firstValueFrom, of} from 'rxjs';
 import {UserService} from '../../services/user/user.service';
 import {RoleGuard} from './role.guard';
 
@@ -30,14 +30,13 @@ describe('RoleGuard', () => {
     expect(() => guard.canActivate({data: {}} as never)).toThrowError('requiredRoles is not defined!');
   });
 
-  it('should deny access when there is no current user', done => {
-    guard.canActivate({data: {requiredRoles: ['leader']}} as never).subscribe(result => {
-      expect(result).toEqual({commands: ['brand', 'new-user']} as never);
-      done();
-    });
+  it('should deny access when there is no current user', async () => {
+    await expectAsync(firstValueFrom(guard.canActivate({data: {requiredRoles: ['leader']}} as never))).toBeResolvedTo(
+      {commands: ['brand', 'new-user']} as never
+    );
   });
 
-  it('should allow admins regardless of requiredRoles', done => {
+  it('should allow admins regardless of requiredRoles', async () => {
     TestBed.resetTestingModule();
     routerSpy = jasmine.createSpyObj<Router>('Router', ['createUrlTree']);
     TestBed.configureTestingModule({
@@ -48,13 +47,10 @@ describe('RoleGuard', () => {
     });
     guard = TestBed.inject(RoleGuard);
 
-    guard.canActivate({data: {requiredRoles: ['leader']}} as never).subscribe(result => {
-      expect(result).toBeTrue();
-      done();
-    });
+    await expectAsync(firstValueFrom(guard.canActivate({data: {requiredRoles: ['leader']}} as never))).toBeResolvedTo(true);
   });
 
-  it('should allow users with a matching required role', done => {
+  it('should allow users with a matching required role', async () => {
     TestBed.resetTestingModule();
     routerSpy = jasmine.createSpyObj<Router>('Router', ['createUrlTree']);
     TestBed.configureTestingModule({
@@ -65,13 +61,10 @@ describe('RoleGuard', () => {
     });
     guard = TestBed.inject(RoleGuard);
 
-    guard.canActivate({data: {requiredRoles: ['leader']}} as never).subscribe(result => {
-      expect(result).toBeTrue();
-      done();
-    });
+    await expectAsync(firstValueFrom(guard.canActivate({data: {requiredRoles: ['leader']}} as never))).toBeResolvedTo(true);
   });
 
-  it('should redirect users without the required role to their role default route', done => {
+  it('should redirect users without the required role to their role default route', async () => {
     TestBed.resetTestingModule();
     routerSpy = jasmine.createSpyObj<Router>('Router', ['createUrlTree']);
     routerSpy.createUrlTree.and.returnValue({redirect: ['presentation']} as never);
@@ -83,14 +76,12 @@ describe('RoleGuard', () => {
     });
     guard = TestBed.inject(RoleGuard);
 
-    guard.canActivate({data: {requiredRoles: ['leader']}} as never).subscribe(result => {
-      expect(routerSpy.createUrlTree).toHaveBeenCalledWith(['presentation']);
-      expect(result).toEqual({redirect: ['presentation']} as never);
-      done();
-    });
+    const result = await firstValueFrom(guard.canActivate({data: {requiredRoles: ['leader']}} as never));
+    expect(routerSpy.createUrlTree).toHaveBeenCalledWith(['presentation']);
+    expect(result).toEqual({redirect: ['presentation']} as never);
   });
 
-  it('should redirect members to shows instead of new-user', done => {
+  it('should redirect members to shows instead of new-user', async () => {
     TestBed.resetTestingModule();
     routerSpy = jasmine.createSpyObj<Router>('Router', ['createUrlTree']);
     routerSpy.createUrlTree.and.returnValue({redirect: ['shows']} as never);
@@ -102,14 +93,12 @@ describe('RoleGuard', () => {
     });
     guard = TestBed.inject(RoleGuard);
 
-    guard.canActivate({data: {requiredRoles: ['user']}} as never).subscribe(result => {
-      expect(routerSpy.createUrlTree).toHaveBeenCalledWith(['shows']);
-      expect(result).toEqual({redirect: ['shows']} as never);
-      done();
-    });
+    const result = await firstValueFrom(guard.canActivate({data: {requiredRoles: ['user']}} as never));
+    expect(routerSpy.createUrlTree).toHaveBeenCalledWith(['shows']);
+    expect(result).toEqual({redirect: ['shows']} as never);
   });
 
-  it('should choose a matching default route from all assigned roles', done => {
+  it('should choose a matching default route from all assigned roles', async () => {
     TestBed.resetTestingModule();
     routerSpy = jasmine.createSpyObj<Router>('Router', ['createUrlTree']);
     routerSpy.createUrlTree.and.callFake(commands => ({redirect: commands}) as never);
@@ -121,10 +110,8 @@ describe('RoleGuard', () => {
     });
     guard = TestBed.inject(RoleGuard);
 
-    guard.canActivate({data: {requiredRoles: ['presenter']}} as never).subscribe(result => {
-      expect(routerSpy.createUrlTree).toHaveBeenCalledWith(['shows']);
-      expect(result).toEqual({redirect: ['shows']} as never);
-      done();
-    });
+    const result = await firstValueFrom(guard.canActivate({data: {requiredRoles: ['presenter']}} as never));
+    expect(routerSpy.createUrlTree).toHaveBeenCalledWith(['shows']);
+    expect(result).toEqual({redirect: ['shows']} as never);
   });
 });