fix(auth): Semantics-Knoten im breiten Layout trennen (a11y Web)

cschlaefke commented

2026-11-03 12:23:11 +00:00

Owner

Zusammenfassung

Behebt #41: Im breiten Layout (>= 600 dp) steckt der Inhalt in einer Card in AppFormScaffold. Card ist ein Semantics-Container ohne explicitChildNodes und faltete Überschrift, Text und Knopf zu einem Knoten (im Web ein einziges <h2> mit dem Gesamttext, kein button-Knoten). Seiten mit Eingabefeld fielen nicht auf, weil deren Widgets eigene Container sind; im schmalen Layout gibt es keine Karte. Fix: Semantics(explicitChildNodes: true) um den Karteninhalt (app_form_scaffold.dart), wirkt für alle Auth-Screens.

Closes #41

Akzeptanzkriterien

Ursache belegt (Widget-Test mit getSemantics: 400x800 = 3 Knoten, 1280x720 = 1 Knoten; DOM im Browser)
Überschrift, Text und Knopf sind getrennte Knoten (heading, text, button mit Label)
Widget-Test je betroffenem Screen (EmailLink ready/recovery/success, CheckEmail Bestätigung/Reset, Reset-Erfolgsansicht) im breiten und schmalen Layout
pressFirstButton entfernt, E2E klickt getByRole('button', …)
Doku: docs/design/auth-screens.md (Regel für Semantics-Struktur), Spec-Nachtrag

Tests

519 Widget-/Unit-Tests grün, dart format/flutter analyze ohne Befund.
Gegenprobe (Reviewer unabhängig): mit dem alten app_form_scaffold.dart schlagen 6 der 7 neuen Tests fehl.
E2E lokal mit frischem Web-Build: web 21/21 (krit01 + krit08 7/7), api 59/59, throttle 4/4 vor den letzten Test-Anpassungen.

Review

code-reviewer: kein Blocker. Behoben (ffc30db): Spec-Nachtrag, aussagekräftigerer Banner-Test, robustere Semantics-Helfer (isSemantics, expectButtonSemantics), Test im schmalen Layout, präzisere Doku.

Hinweise / offen

Nicht geprüft mit echtem Screenreader (VoiceOver, TalkBack, NVDA): Lesereihenfolge, ob die Karte als zusätzliche leere „Gruppe“ angesagt wird (der Karten-Knoten bleibt erhalten; Alternative Card(semanticContainer: false)), Live-Region-Ansagen der Banner, Überschriften-Navigation.
Eine eigene Card um Seiteninhalt bräuchte künftig dasselbe explicitChildNodes.
Nicht getestet: Android/iOS auf Geräten.

🤖 Generated with Claude Code

## Zusammenfassung Behebt #41: Im breiten Layout (>= 600 dp) steckt der Inhalt in einer `Card` in `AppFormScaffold`. `Card` ist ein Semantics-Container ohne `explicitChildNodes` und faltete Überschrift, Text und Knopf zu **einem** Knoten (im Web ein einziges `<h2>` mit dem Gesamttext, kein `button`-Knoten). Seiten mit Eingabefeld fielen nicht auf, weil deren Widgets eigene Container sind; im schmalen Layout gibt es keine Karte. Fix: `Semantics(explicitChildNodes: true)` um den Karteninhalt (`app_form_scaffold.dart`), wirkt für alle Auth-Screens. Closes #41 ## Akzeptanzkriterien - [x] Ursache belegt (Widget-Test mit `getSemantics`: 400x800 = 3 Knoten, 1280x720 = 1 Knoten; DOM im Browser) - [x] Überschrift, Text und Knopf sind getrennte Knoten (heading, text, button mit Label) - [x] Widget-Test je betroffenem Screen (EmailLink ready/recovery/success, CheckEmail Bestätigung/Reset, Reset-Erfolgsansicht) im breiten und schmalen Layout - [x] `pressFirstButton` entfernt, E2E klickt `getByRole('button', …)` - [x] Doku: `docs/design/auth-screens.md` (Regel für Semantics-Struktur), Spec-Nachtrag ## Tests - 519 Widget-/Unit-Tests grün, `dart format`/`flutter analyze` ohne Befund. - Gegenprobe (Reviewer unabhängig): mit dem alten `app_form_scaffold.dart` schlagen 6 der 7 neuen Tests fehl. - E2E lokal mit frischem Web-Build: web 21/21 (krit01 + krit08 7/7), api 59/59, throttle 4/4 vor den letzten Test-Anpassungen. ## Review `code-reviewer`: kein Blocker. Behoben (`ffc30db`): Spec-Nachtrag, aussagekräftigerer Banner-Test, robustere Semantics-Helfer (`isSemantics`, `expectButtonSemantics`), Test im schmalen Layout, präzisere Doku. ## Hinweise / offen - **Nicht geprüft mit echtem Screenreader** (VoiceOver, TalkBack, NVDA): Lesereihenfolge, ob die Karte als zusätzliche leere „Gruppe“ angesagt wird (der Karten-Knoten bleibt erhalten; Alternative `Card(semanticContainer: false)`), Live-Region-Ansagen der Banner, Überschriften-Navigation. - Eine eigene `Card` um Seiteninhalt bräuchte künftig dasselbe `explicitChildNodes`. - Nicht getestet: Android/iOS auf Geräten. 🤖 Generated with [Claude Code](https://claude.com/claude-code)

cschlaefke added 3 commits 2026-11-03 12:23:11 +00:00

fix(auth): keep heading, text and button as separate semantics nodes in the wide card cda9417353

Card is a semantics container without explicitChildNodes, so on >= 600 dp
(web/tablet) title, text and button folded into one node. AppFormScaffold now
wraps the card content in Semantics(explicitChildNodes: true).

Refs #41

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

test(e2e): click buttons via getByRole instead of keyboard helper eb63636fd9

Removes pressFirstButton; the web build now exposes real button nodes.

Refs #41

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

fix(auth): address review findings for semantics split

CI / flutter (pull_request) Successful in 1m14s

Details

CI / web-build (pull_request) Successful in 53s

Details

CI / supabase (pull_request) Successful in 3s

Details

CI / supabase-tests (pull_request) Successful in 30s

Details

CI / e2e (pull_request) Successful in 2m56s

Details

ffc30db2e5

Refs #41

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

cschlaefke added the

status/ready-for-merge

label 2026-11-03 12:30:47 +00:00

cschlaefke commented

2026-11-03 12:30:50 +00:00

Author

Owner

Review- und CI-Ergebnis (Fix #41)

CI (Commit ffc30db): alle 5 Jobs grün – flutter (1m14s), web-build (53s), supabase (3s), supabase-tests (30s), e2e (2m56s). Damit läuft der Umbau der Web-E2E-Tests (getByRole('button') statt Tastatur-Hilfsfunktion) auch auf dem Runner grün.

Code-Review (Agent code-reviewer): kein Blocker. Ursache schlüssig belegt, Fix minimal und ohne Nebenwirkungen auf Live-Regionen, Fokus-Reihenfolge, Seiten mit Eingabefeld und schmales Layout. Gegenprobe unabhängig bestätigt: mit dem alten app_form_scaffold.dart schlagen 6 der 7 neuen Tests fehl. Alle Anmerkungen in ffc30db behoben (Spec-Nachtrag, aussagekräftigerer Banner-Test, robustere Semantics-Helfer, Test im schmalen Layout, präzisere Doku).

Bitte beachten:

Nicht geprüft mit echtem Screenreader (VoiceOver, TalkBack, NVDA): Lesereihenfolge, ob die Card als zusätzliche leere „Gruppe“ angesagt wird (Alternative: Card(semanticContainer: false)), Live-Region-Ansagen der Banner, Überschriften-Navigation.
Nicht getestet: Android/iOS auf Geräten.

Merge durch Chris. Mit dem Merge ist Issue #41 geschlossen.

## Review- und CI-Ergebnis (Fix #41) **CI (Commit `ffc30db`):** alle 5 Jobs grün – `flutter` (1m14s), `web-build` (53s), `supabase` (3s), `supabase-tests` (30s), `e2e` (2m56s). Damit läuft der Umbau der Web-E2E-Tests (`getByRole('button')` statt Tastatur-Hilfsfunktion) auch auf dem Runner grün. **Code-Review (Agent `code-reviewer`):** kein Blocker. Ursache schlüssig belegt, Fix minimal und ohne Nebenwirkungen auf Live-Regionen, Fokus-Reihenfolge, Seiten mit Eingabefeld und schmales Layout. Gegenprobe unabhängig bestätigt: mit dem alten `app_form_scaffold.dart` schlagen 6 der 7 neuen Tests fehl. Alle Anmerkungen in `ffc30db` behoben (Spec-Nachtrag, aussagekräftigerer Banner-Test, robustere Semantics-Helfer, Test im schmalen Layout, präzisere Doku). **Bitte beachten:** - Nicht geprüft mit echtem Screenreader (VoiceOver, TalkBack, NVDA): Lesereihenfolge, ob die Card als zusätzliche leere „Gruppe“ angesagt wird (Alternative: `Card(semanticContainer: false)`), Live-Region-Ansagen der Banner, Überschriften-Navigation. - Nicht getestet: Android/iOS auf Geräten. Merge durch Chris. Mit dem Merge ist Issue #41 geschlossen.

cschlaefke merged commit 455b3bf708 into main

2026-11-03 12:32:34 +00:00

cschlaefke deleted branch fix/41-semantics-split

2026-11-03 12:32:34 +00:00

cschlaefke referenced this pull request from a commit

2026-11-03 12:32:36 +00:00

Merge pull request 'fix(auth): Semantics-Knoten im breiten Layout trennen (a11y Web)' (#48) from fix/41-semantics-split into main

fix(auth): Semantics-Knoten im breiten Layout trennen (a11y Web) #48

Zusammenfassung

Akzeptanzkriterien

Tests

Review

Hinweise / offen

Review- und CI-Ergebnis (Fix #41)