marcel/familienarchiv
1
0
Fork 0
Code Issues 103 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

test(dark-mode): add failing test for --c-header token on header element

Browse Source 
Header should use bg-header (rgb(1,51,94) = #01335e) in dark mode instead
of bg-surface. Currently fails because header still uses bg-surface.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-03-31 11:39:37 +02:00
parent 7e43bd43a4
commit 938a4b07bf
1 changed files with 14 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
frontend/e2e/theme.spec.ts
View File

@@ -60,6 +60,20 @@ test.describe('Theme toggle', () => {
await expect(page.locator('html')).toHaveAttribute('data-theme', 'dark'); await expect(page.locator('html')).toHaveAttribute('data-theme', 'dark');
}); });
test('header uses --c-header token background in dark mode', async ({ page }) => {
await page.goto('/');
await page.waitForSelector('[data-hydrated]');
await page.evaluate(() => document.documentElement.setAttribute('data-theme', 'dark'));
const headerBg = await page.evaluate(() => {
const header = document.querySelector('header');
return header ? getComputedStyle(header).backgroundColor : null;
});
// --c-header in dark mode = #01335e → rgb(1, 51, 94)
expect(headerBg).toBe('rgb(1, 51, 94)');
});
test('color-scheme is dark when data-theme=dark is set', async ({ page }) => { test('color-scheme is dark when data-theme=dark is set', async ({ page }) => {
await page.goto('/'); await page.goto('/');
await page.waitForSelector('[data-hydrated]'); await page.waitForSelector('[data-hydrated]');