feat(voyage): build A11Y-panel from DS-primitives (greenfield)

This commit is contained in:
Kjell Tore Guttormsen 2026-05-10 17:56:49 +02:00
commit b70b480d0d
2 changed files with 113 additions and 1 deletions

View file

@ -337,3 +337,48 @@ test('voyage-playground.html setActiveAnchor toggles data-active on badges (v4.3
// injectAnchorBadges must propagate resolved state to badge data-resolved
assert.match(text, /setAttribute\('data-resolved',\s*'true'\)/, 'data-resolved set on resolved badge required');
});
// v4.3 Step 22 — A11Y-panel built from DS-primitives (greenfield)
test('voyage-playground.html declares voyage-a11y-panel with guide-panel--info (v4.3 Step 22)', () => {
const text = readFileSync(HTML, 'utf-8');
assert.match(text, /id="voyage-a11y-panel"[^>]*guide-panel guide-panel--info/, 'voyage-a11y-panel with guide-panel--info required');
// Must be hidden by default (placeholder until Wave 7)
assert.match(text, /id="voyage-a11y-panel"[\s\S]{0,300}\bhidden\b/, 'voyage-a11y-panel hidden by default required');
});
test('voyage-playground.html declares data-action="toggle-a11y-panel" toggle-button (v4.3 Step 22)', () => {
const text = readFileSync(HTML, 'utf-8');
assert.match(text, /data-action="toggle-a11y-panel"/, 'toggle-a11y-panel button required');
// aria-controls must point at the panel id
assert.match(text, /data-action="toggle-a11y-panel"[\s\S]*?aria-controls="voyage-a11y-panel"/, 'aria-controls binding required');
});
test('voyage-playground.html A11Y-panel uses key-stats severity grid (v4.3 Step 22)', () => {
const text = readFileSync(HTML, 'utf-8');
// key-stats grid with critical/high/medium/low severity modifiers
assert.match(text, /class="key-stat key-stat--critical"/, 'key-stat--critical required');
assert.match(text, /class="key-stat key-stat--high"/, 'key-stat--high (serious) required');
assert.match(text, /class="key-stat key-stat--medium"/, 'key-stat--medium (moderate) required');
assert.match(text, /class="key-stat key-stat--low"/, 'key-stat--low (minor) required');
// axe-core severity vocabulary on data-a11y-stat
assert.match(text, /data-a11y-stat="critical"/, 'data-a11y-stat="critical" required');
assert.match(text, /data-a11y-stat="serious"/, 'data-a11y-stat="serious" required');
assert.match(text, /data-a11y-stat="moderate"/, 'data-a11y-stat="moderate" required');
assert.match(text, /data-a11y-stat="minor"/, 'data-a11y-stat="minor" required');
});
test('voyage-playground.html A11Y-panel uses findings__items placeholder list (v4.3 Step 22)', () => {
const text = readFileSync(HTML, 'utf-8');
// Match either attribute order (class= or id= first); just confirm both live on the same <ol>.
assert.match(text, /<ol[^>]*class="findings__items"[^>]*id="voyage-a11y-findings"|<ol[^>]*id="voyage-a11y-findings"[^>]*class="findings__items"/, 'findings__items list (id=voyage-a11y-findings) required');
// Placeholder line referencing the Wave 7 Playwright spec
assert.match(text, /Kjør axe-spec/, 'placeholder hint "Kjør axe-spec" required');
});
test('voyage-playground.html declares wireA11yToggle JS function (v4.3 Step 22)', () => {
const text = readFileSync(HTML, 'utf-8');
assert.match(text, /function\s+wireA11yToggle\s*\(\s*\)/, 'wireA11yToggle() function required');
// Toggle must flip hidden + aria-expanded
assert.match(text, /panel\.hidden\s*=\s*!willOpen/, 'panel.hidden toggle required');
assert.match(text, /setAttribute\('aria-expanded'/, 'aria-expanded update required');
});