diff --git a/alfa-client/libs/admin-settings/src/lib/postfach/postfach-container/postfach-form/postfach-form.component.ts b/alfa-client/libs/admin-settings/src/lib/postfach/postfach-container/postfach-form/postfach-form.component.ts index 0a56b56ad85f682fdbd327eade606509e833acae..f63f202379e5516f96668102acda229996af14f8 100644 --- a/alfa-client/libs/admin-settings/src/lib/postfach/postfach-container/postfach-form/postfach-form.component.ts +++ b/alfa-client/libs/admin-settings/src/lib/postfach/postfach-container/postfach-form/postfach-form.component.ts @@ -12,7 +12,7 @@ export class PostfachFormComponent { protected readonly PostfachFormService = PostfachFormService; - submit() { + public submit() { this.formService.submit(); } } diff --git a/alfa-client/libs/admin-settings/src/lib/shared/navigation-item/navigation-item.component.html b/alfa-client/libs/admin-settings/src/lib/shared/navigation-item/navigation-item.component.html index fb2dab49082015f1e43bd6ff8724459338ed0d17..c9f7e36c16335c9f94d205e9724542a219c62612 100644 --- a/alfa-client/libs/admin-settings/src/lib/shared/navigation-item/navigation-item.component.html +++ b/alfa-client/libs/admin-settings/src/lib/shared/navigation-item/navigation-item.component.html @@ -4,6 +4,6 @@ data-test-id="anchor" class="hover:bg-ozgblue-200 active:bg-ozgblue-200/75 flex items-center gap-4 rounded-full p-3 font-semibold" > - <img [src]="imageSrc" [alt]="name" class="w-6" data-test-id="image" /> - <span data-test-id="navigation-label">{{ name }}</span> + <img [src]="imageSrc" [alt]="name" class="w-6" [attr.data-test-id]="'image-' + name" /> + <span [attr.data-test-id]="'navigation-label-' + name | convertForDataTest">{{ name }}</span> </a> diff --git a/alfa-client/libs/admin-settings/src/lib/shared/navigation-item/navigation-item.component.spec.ts b/alfa-client/libs/admin-settings/src/lib/shared/navigation-item/navigation-item.component.spec.ts index 29cf3f4aff39bb46cf596218b6de69e55f378db2..e800d7acf9df48a08b81190c029858010e332ad3 100644 --- a/alfa-client/libs/admin-settings/src/lib/shared/navigation-item/navigation-item.component.spec.ts +++ b/alfa-client/libs/admin-settings/src/lib/shared/navigation-item/navigation-item.component.spec.ts @@ -1,19 +1,23 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ReactiveFormsModule } from '@angular/forms'; import { NavigationItemComponent } from './navigation-item.component'; -import { existsAsHtmlElement, getElementFromFixture } from '@alfa-client/test-utils'; +import { getElementFromFixture } from '@alfa-client/test-utils'; import { getDataTestIdOf } from 'libs/tech-shared/test/data-test'; import { RouterTestingModule } from '@angular/router/testing'; +import { ConvertForDataTestPipe } from '@alfa-client/tech-shared'; describe('NavigationItemComponent', () => { let component: NavigationItemComponent; let fixture: ComponentFixture<NavigationItemComponent>; const anchorLink = getDataTestIdOf('anchor'); + const navigationLabelName = 'test'; + const image = getDataTestIdOf('image-' + navigationLabelName); + const label = getDataTestIdOf('navigation-label-' + navigationLabelName); beforeEach(async () => { await TestBed.configureTestingModule({ - declarations: [NavigationItemComponent], + declarations: [NavigationItemComponent, ConvertForDataTestPipe], imports: [ReactiveFormsModule, RouterTestingModule], }).compileComponents(); }); @@ -21,6 +25,7 @@ describe('NavigationItemComponent', () => { beforeEach(() => { fixture = TestBed.createComponent(NavigationItemComponent); component = fixture.componentInstance; + component.name = 'test'; fixture.detectChanges(); }); @@ -29,11 +34,13 @@ describe('NavigationItemComponent', () => { }); it('should use imageSrc input', () => { - component.imageSrc = 'imagesrc'; + const imageSrc = 'imagesrc'; + component.imageSrc = imageSrc; fixture.detectChanges(); - existsAsHtmlElement(fixture, 'img[src="imagesrc"]'); + const imageElement: HTMLImageElement = getElementFromFixture(fixture, image); + expect(imageElement.getAttribute('src')).toBe(imageSrc); }); it('should use router link', () => { @@ -47,23 +54,13 @@ describe('NavigationItemComponent', () => { }); describe('image name', () => { - const navigationLabelName = 'navname'; - it('should be used for alt', () => { - component.name = navigationLabelName; - - fixture.detectChanges(); - - const imageElement = getElementFromFixture(fixture, getDataTestIdOf('image')); + const imageElement = getElementFromFixture(fixture, image); expect(imageElement.alt).toBe(navigationLabelName); }); it('should be used for navigation-label', () => { - component.name = navigationLabelName; - - fixture.detectChanges(); - - const labelElement = getElementFromFixture(fixture, getDataTestIdOf('navigation-label')); + const labelElement = getElementFromFixture(fixture, label); expect(labelElement.textContent).toBe(navigationLabelName); }); });