script nits: slider hover/visibility pause + silent autoplay + iframe amp guard

ContentSlider: autoplay's setInterval now pauses on mouseenter and on
document visibilitychange (tab hidden), resumes on mouseleave/visible,
and is always clearable (timer var + clearInterval). The aria-live
region is "off" while autoplay is silently auto-rotating and only
flips to "polite" on manual next/prev/dot navigation, so screen readers
aren't spammed with an announcement every `interval` ms (F-export
review Minor). Updates the one existing test that hard-coded
aria-live="polite" as always-on to match this intentional behavior
change.

(Countdown's ticking-interval-stops-at-zero nit shipped in the previous
commit alongside its node-id migration, since both touched the same
inline script.)

Adds regression tests locking in that MapEmbed/VideoBlock iframe src
attributes (built by string concatenation with literal `&` query
params) are HTML-entity-encoded via the existing escapeAttr(safeUrl())
pipeline -- verified already correct, no source change needed there.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-07-12 14:35:27 -07:00
parent 8029126ab7
commit 177eda93d0
4 changed files with 124 additions and 11 deletions
@@ -23,9 +23,9 @@ describe('ContentSlider.toHtml accessibility (F1.1)', () => {
expect(html).toMatch(/<button[^>]*aria-label="Go to slide 3"/);
});
test('slides are wrapped in an aria-live="polite" region', () => {
test('slides are wrapped in an aria-live region', () => {
const { html } = toHtml({ slides }, '');
expect(html).toContain('aria-live="polite"');
expect(html).toMatch(/aria-live="(polite|off)"/);
});
test('decorative chevron icons in arrows are aria-hidden', () => {
@@ -34,3 +34,60 @@ describe('ContentSlider.toHtml accessibility (F1.1)', () => {
expect(html).toMatch(/<i class="fa fa-chevron-right" aria-hidden="true"><\/i>/);
});
});
describe('ContentSlider.toHtml deterministic + unique scope ids (thread node id)', () => {
test('same node id -> identical output across calls (deterministic, no Math.random)', () => {
const { html: html1 } = toHtml({ slides }, '', 'node-cs1');
const { html: html2 } = toHtml({ slides }, '', 'node-cs1');
expect(html1).toBe(html2);
});
test('different node ids -> different, non-colliding scope ids (identical slides, no collision)', () => {
const { html: html1 } = toHtml({ slides }, '', 'node-cs1');
const { html: html2 } = toHtml({ slides }, '', 'node-cs2');
const id1 = html1.match(/<section id="([^"]+)"/)![1];
const id2 = html2.match(/<section id="([^"]+)"/)![1];
expect(id1).not.toBe(id2);
});
test('no nodeId (legacy 2-arg call): still deterministic across repeated calls, not random', () => {
const { html: html1 } = toHtml({ slides }, '');
const { html: html2 } = toHtml({ slides }, '');
expect(html1).toBe(html2);
});
});
describe('ContentSlider.toHtml autoplay silences aria-live and is pausable (F-export review Minor)', () => {
test('aria-live is "off" while autoplay is running, to avoid announcing every auto-rotation', () => {
const { html } = toHtml({ slides, autoplay: true }, '');
expect(html).toContain('aria-live="off"');
});
test('aria-live stays "polite" when autoplay is disabled', () => {
const { html } = toHtml({ slides, autoplay: false }, '');
expect(html).toContain('aria-live="polite"');
});
test('manual navigation (next/prev/dot) marks the live region "polite"', () => {
const { html } = toHtml({ slides, autoplay: true }, '');
expect(html).toMatch(/setAttribute\(["']aria-live["'],\s*["']polite["']\)/);
});
test('autoplay pauses on hover and resumes on mouse leave', () => {
const { html } = toHtml({ slides, autoplay: true }, '');
expect(html).toMatch(/addEventListener\(["']mouseenter["']/);
expect(html).toMatch(/addEventListener\(["']mouseleave["']/);
});
test('autoplay pauses when the tab is hidden (visibilitychange) and the interval is clearable', () => {
const { html } = toHtml({ slides, autoplay: true }, '');
expect(html).toMatch(/visibilitychange/);
expect(html).toMatch(/clearInterval\(/);
});
test('no autoplay: no setInterval/hover/visibility wiring at all', () => {
const { html } = toHtml({ slides, autoplay: false }, '');
expect(html).not.toMatch(/setInterval\(/);
expect(html).not.toMatch(/visibilitychange/);
});
});