55 lines
3.1 KiB
JavaScript
55 lines
3.1 KiB
JavaScript
// @ts-check
|
||
// Tests: A1–A5 (feature checks) and AX1–AX5 (axe scans)
|
||
const { test, expect } = require('@playwright/test');
|
||
|
||
// ── A1: Skip link ──────────────────────────────────────────────────────────────
|
||
test('A1: skip link targets #main-content and is first focusable element', async ({ page }) => {
|
||
await page.goto('/');
|
||
const skipLink = page.locator('.skip-link');
|
||
await expect(skipLink).toBeAttached();
|
||
await expect(skipLink).toHaveAttribute('href', '#main-content');
|
||
await expect(page.locator('#main-content')).toBeAttached();
|
||
});
|
||
|
||
// ── A2: Color token contrast ───────────────────────────────────────────────────
|
||
test('A2: contrast tokens meet WCAG AA 4.5:1 floor', async ({ page }) => {
|
||
await page.goto('/');
|
||
const [muted, accent] = await page.evaluate(() => [
|
||
getComputedStyle(document.documentElement).getPropertyValue('--color-ink-muted').trim(),
|
||
getComputedStyle(document.documentElement).getPropertyValue('--color-accent').trim(),
|
||
]);
|
||
expect(muted.toLowerCase()).toBe('#90887e');
|
||
expect(accent.toLowerCase()).toBe('#2e9880');
|
||
});
|
||
|
||
// ── A3: Filter button aria-pressed + toggle aria-expanded ──────────────────────
|
||
const TRIP_URL = '/trips/japan-korea-2026';
|
||
|
||
test('A3a: All-content filter has aria-pressed="true" on load', async ({ page }) => {
|
||
await page.goto(TRIP_URL);
|
||
await expect(page.locator('.trip-filter-btn[data-filter="all"]')).toHaveAttribute('aria-pressed', 'true');
|
||
await expect(page.locator('.trip-filter-btn[data-filter="journal"]')).toHaveAttribute('aria-pressed', 'false');
|
||
await expect(page.locator('.trip-filter-btn[data-filter="story"]')).toHaveAttribute('aria-pressed', 'false');
|
||
});
|
||
|
||
test('A3b: clicking Journal filter toggles aria-pressed', async ({ page }) => {
|
||
await page.goto(TRIP_URL);
|
||
await page.click('.trip-filter-btn[data-filter="journal"]');
|
||
await expect(page.locator('.trip-filter-btn[data-filter="journal"]')).toHaveAttribute('aria-pressed', 'true');
|
||
await expect(page.locator('.trip-filter-btn[data-filter="all"]')).toHaveAttribute('aria-pressed', 'false');
|
||
});
|
||
|
||
test('A3c: Stats toggle has aria-expanded="false" and aria-controls on load', async ({ page }) => {
|
||
await page.goto(TRIP_URL);
|
||
await expect(page.locator('#trip-stats-toggle')).toHaveAttribute('aria-expanded', 'false');
|
||
await expect(page.locator('#trip-stats-toggle')).toHaveAttribute('aria-controls', 'trip-stats-block');
|
||
});
|
||
|
||
test('A3d: clicking Stats toggle sets aria-expanded="true" then back to false', async ({ page }) => {
|
||
await page.goto(TRIP_URL);
|
||
await page.click('#trip-stats-toggle');
|
||
await expect(page.locator('#trip-stats-toggle')).toHaveAttribute('aria-expanded', 'true');
|
||
await page.click('#trip-stats-toggle');
|
||
await expect(page.locator('#trip-stats-toggle')).toHaveAttribute('aria-expanded', 'false');
|
||
});
|