feat(a11y): axe-core regression guard + seek-bar label fix

## Plan Deliver the "Accessibility audit pass" Release Hardening roadmap item by adding a repeatable, automated accessibility guard and fixing the violations it finds. Feldenkrais is inclusive by nature — accessibility is a release value, not a nice-to-have. ## Outcome 1. **`src/components/__tests__/a11y.test.tsx`** — runs **axe-core** (full WCAG 2.0/2.1 A+AA ruleset) against the rendered key components: `AudioPlayer` (with and without an audio source), `RestOverlay` (modal dialog), and `ShareSheet` (modal dialog with form). These are the components with the most a11y surface. 2. **Fixed a real critical violation** (found by the test): the `AudioPlayer` seek-bar (`<input type="range">`) had no accessible name — screen readers announced only "slider" with no context. Now carries a descriptive `aria-label` that reads the current position and duration (e.g. *"Wiedergabeposition, 0:05 von 12:30"*). 3. **Extended `blackbox_test.py`** with 5 structural a11y invariants (Test 15) checked against the SSR document shell: `<html lang="de">`, viewport meta tag, skip-to-content link present, non-empty `<title>`, page reachable. ## Impact on release goals - **Release Hardening "Accessibility audit pass"** moves `[ ]` → `[x]`. - The app now has a **repeatable automated a11y gate** (component-level axe + document-shell blackbox) that catches regressions *before merge*, not a one-off manual pass. - One real WCAG-A violation (unlabelled form control, **critical** severity) was found by the new guard and fixed. ## Blackbox - [x] `python3 scripts/blackbox_test.py --target local` → **41/41 green** (36 prior + 5 new structural a11y: lang, viewport, skip-link, title, page-reachable). - Unit suite: **110/110 green** (18 files, +4 axe-core tests). TSC clean. - axe-core: **0 violations** across all rendered key components. ## Six-perspectives check - [x] **Product:** Inclusive by default — screen-reader and keyboard users can now navigate the lesson player; aligns with the "felt change for everyone" ethos. - [x] **Engineering:** Minimal diff (one aria-label); tests are guardrails, not ceremony; no behaviour change. - [x] **Psychology:** Reduces friction for users relying on assistive tech — autonomy-supportive (they can navigate independently). - [x] **Biomechanics:** N/A (no movement cues introduced). - [x] **Anatomy:** N/A (no anatomical claims introduced). - [x] **Feldenkrais:** Accessibility *is* the Feldenkrais principle of meeting the user where they are. Pure alignment, no conflict. ## Risk **Low.** The seek-bar `aria-label` is additive (no behaviour change). The a11y tests are guardrails — they fail loudly if a future change reintroduces an unlabelled control or breaks a landmark. No Feldenkrais-principle surface touched (pure accessibility work). ## Checklist - [x] Branch off latest `dev` - [x] Conventional Commits - [x] Patchlog entry appended - [x] Roadmap status updated - [x] No secrets / no large binaries - [x] TSC clean --- _This PR was created by an AI agent (OpenHands) on behalf of the ATM automation._

KnallerKalle commented

2026-08-13 16:48:24 +00:00

(Migrated from github.com)

Plan

Deliver the "Accessibility audit pass" Release Hardening roadmap item by adding a repeatable, automated accessibility guard and fixing the violations it finds. Feldenkrais is inclusive by nature — accessibility is a release value, not a nice-to-have.

Outcome

src/components/__tests__/a11y.test.tsx — runs axe-core (full WCAG 2.0/2.1 A+AA ruleset) against the rendered key components: AudioPlayer (with and without an audio source), RestOverlay (modal dialog), and ShareSheet (modal dialog with form). These are the components with the most a11y surface.
Fixed a real critical violation (found by the test): the AudioPlayer seek-bar (<input type="range">) had no accessible name — screen readers announced only "slider" with no context. Now carries a descriptive aria-label that reads the current position and duration (e.g. "Wiedergabeposition, 0:05 von 12:30").
Extended blackbox_test.py with 5 structural a11y invariants (Test 15) checked against the SSR document shell: <html lang="de">, viewport meta tag, skip-to-content link present, non-empty <title>, page reachable.

Impact on release goals

Release Hardening "Accessibility audit pass" moves [ ] → [x].
The app now has a repeatable automated a11y gate (component-level axe + document-shell blackbox) that catches regressions before merge, not a one-off manual pass.
One real WCAG-A violation (unlabelled form control, critical severity) was found by the new guard and fixed.

Blackbox

python3 scripts/blackbox_test.py --target local → 41/41 green (36 prior + 5 new structural a11y: lang, viewport, skip-link, title, page-reachable).
Unit suite: 110/110 green (18 files, +4 axe-core tests). TSC clean.
axe-core: 0 violations across all rendered key components.

Six-perspectives check

Product: Inclusive by default — screen-reader and keyboard users can now navigate the lesson player; aligns with the "felt change for everyone" ethos.
Engineering: Minimal diff (one aria-label); tests are guardrails, not ceremony; no behaviour change.
Psychology: Reduces friction for users relying on assistive tech — autonomy-supportive (they can navigate independently).
Biomechanics: N/A (no movement cues introduced).
Anatomy: N/A (no anatomical claims introduced).
Feldenkrais: Accessibility is the Feldenkrais principle of meeting the user where they are. Pure alignment, no conflict.

Risk

Low. The seek-bar aria-label is additive (no behaviour change). The a11y tests are guardrails — they fail loudly if a future change reintroduces an unlabelled control or breaks a landmark. No Feldenkrais-principle surface touched (pure accessibility work).

Checklist

Branch off latest dev
Conventional Commits
Patchlog entry appended
Roadmap status updated
No secrets / no large binaries
TSC clean

This PR was created by an AI agent (OpenHands) on behalf of the ATM automation.

Rows
Columns

feat(a11y): axe-core regression guard + seek-bar label fix #63