Chorehancement: update to Angular v22, 'zoneless' / 'reactive' (#13114)

src-ui/src/app/components/common/page-header/page-header.component.spec.ts

@@ -1,6 +1,7 @@
 import { Clipboard } from '@angular/cdk/clipboard'
 import { ComponentFixture, TestBed } from '@angular/core/testing'
 import { Title } from '@angular/platform-browser'
+import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'
 import { environment } from 'src/environments/environment'
 import { PageHeaderComponent } from './page-header.component'
 
@@ -13,7 +14,7 @@ describe('PageHeaderComponent', () => {
   beforeEach(async () => {
     TestBed.configureTestingModule({
       providers: [],
-      imports: [PageHeaderComponent],
+      imports: [NgxBootstrapIconsModule.pick(allIcons), PageHeaderComponent],
     }).compileComponents()
 
     titleService = TestBed.inject(Title)
@@ -23,9 +24,13 @@ describe('PageHeaderComponent', () => {
     fixture.detectChanges()
   })
 
+  afterEach(() => {
+    jest.useRealTimers()
+  })
+
   it('should display title + subtitle', () => {
-    component.title = 'Foo'
-    component.subTitle = 'Bar'
+    fixture.componentRef.setInput('title', 'Foo')
+    fixture.componentRef.setInput('subTitle', 'Bar')
     fixture.detectChanges()
     expect(fixture.nativeElement.textContent).toContain('Foo')
     expect(fixture.nativeElement.textContent).toContain('Bar')
@@ -33,19 +38,20 @@ describe('PageHeaderComponent', () => {
 
   it('should set html title', () => {
     const titleSpy = jest.spyOn(titleService, 'setTitle')
-    component.title = 'Foo Bar'
+    fixture.componentRef.setInput('title', 'Foo Bar')
+    fixture.detectChanges()
     expect(titleSpy).toHaveBeenCalledWith(`Foo Bar - ${environment.appTitle}`)
   })
 
   it('should copy id to clipboard, reset after 3 seconds', () => {
     jest.useFakeTimers()
-    component.id = 42 as any
+    fixture.componentRef.setInput('id', 42)
     jest.spyOn(clipboard, 'copy').mockReturnValue(true)
     component.copyID()
     expect(clipboard.copy).toHaveBeenCalledWith('42')
-    expect(component.copied).toBe(true)
+    expect(component.copied()).toBe(true)
 
     jest.advanceTimersByTime(3000)
-    expect(component.copied).toBe(false)
+    expect(component.copied()).toBe(false)
   })
 })