diff --git a/frontend/e2e/header.spec.ts b/frontend/e2e/header.spec.ts index 8317c742..813316a7 100644 --- a/frontend/e2e/header.spec.ts +++ b/frontend/e2e/header.spec.ts @@ -1,7 +1,7 @@ import { test, expect } from '@playwright/test'; import AxeBuilder from '@axe-core/playwright'; -// #012851 — brand-navy, defined as --c-primary in layout.css +// #012851 — brand-navy, set as --c-header in layout.css (both light and dark mode) const BRAND_NAVY = 'rgb(1, 40, 81)'; test.describe('Header — brand-navy background', () => { @@ -94,3 +94,25 @@ test.describe('Login page — AuthHeader', () => { expect(results.violations).toEqual([]); }); }); + +test.describe('Forgot-password page — AuthHeader', () => { + test.use({ storageState: { cookies: [], origins: [] } }); + + test('forgot-password page has brand-navy header', async ({ page }) => { + await page.goto('/forgot-password'); + + const header = page.locator('header'); + await expect(header).toBeVisible(); + + const bg = await header.evaluate((el) => getComputedStyle(el).backgroundColor); + expect(bg).toBe(BRAND_NAVY); + }); + + test('forgot-password page header passes accessibility audit', async ({ page }) => { + await page.goto('/forgot-password'); + await expect(page.locator('header')).toBeVisible(); + + const results = await new AxeBuilder({ page }).include('header').analyze(); + expect(results.violations).toEqual([]); + }); +}); diff --git a/frontend/src/routes/AuthHeader.svelte b/frontend/src/routes/AuthHeader.svelte index 6e8aafd6..5520bf8f 100644 --- a/frontend/src/routes/AuthHeader.svelte +++ b/frontend/src/routes/AuthHeader.svelte @@ -2,7 +2,7 @@ import LanguageSwitcher from '$lib/components/LanguageSwitcher.svelte'; -
+