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

test(a11y): add dark mode axe + color-scheme tests for issue #166

Browse Source 
Two failing test suites that encode the regressions this issue fixes:
- accessibility.spec.ts: axe wcag2aa in both prefers-color-scheme:dark
  and data-theme='dark' — fails because --c-ink-3:#6b7280 on #1a1a1a = 3.2:1
- theme.spec.ts: color-scheme computed property is 'dark' in dark mode
  — fails because neither dark CSS block sets color-scheme: dark

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-03-31 11:22:35 +02:00
parent a6ee444f3b
commit 56926efd03
2 changed files with 79 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -60,6 +60,34 @@ test.describe('Theme toggle', () => {
await expect(page.locator('html')).toHaveAttribute('data-theme', 'dark');
});
test('color-scheme is dark when data-theme=dark is set', async ({ page }) => {
await page.goto('/');
await page.waitForSelector('[data-hydrated]');
await page.evaluate(() => document.documentElement.setAttribute('data-theme', 'dark'));
const colorScheme = await page.evaluate(
() => getComputedStyle(document.documentElement).colorScheme
);
expect(colorScheme).toBe('dark');
});
test('color-scheme is dark in prefers-color-scheme: dark media', async ({ browser }) => {
const context = await browser.newContext({
colorScheme: 'dark',
storageState: 'e2e/.auth/user.json'
});
const page = await context.newPage();
await page.goto('/');
await page.waitForSelector('[data-hydrated]');
const colorScheme = await page.evaluate(
() => getComputedStyle(document.documentElement).colorScheme
);
await context.close();
expect(colorScheme).toBe('dark');
});
test('saved theme is applied before first paint (no flash)', async ({ page }) => {
// Set dark theme in localStorage before navigating
await page.goto('/');