AppPrimaryButton: Fokus-Semantik geht verloren (Web/Screenreader) #61

New issue

Open

opened 2026-11-04 00:19:27 +00:00 by cschlaefke · 0 comments

cschlaefke commented

2026-11-04 00:19:27 +00:00

Owner

Befund

Im Review von PR A zu #49 aufgefallen (vorbestehend, nicht durch #49 verursacht):

app/lib/core/widgets/app_primary_button.dart:66-70 umschließt den FilledButton mit Semantics(button: true, …, excludeSemantics: true). Dadurch verwirft es die Fokus-Flags des Buttons (focusable/focused), und sie werden nicht neu gesetzt.

Messung im Flutter-Web-Build (Playwright-Probe):

Nach dem Tabben bekommt „Create account“ (OutlinedButton) DOM-Fokus (flt-semantics role=button tabindex=0), der primäre Button „Sign in“ nie: Das Element hat kein tabindex.
Nach Shift+Tab bleibt der DOM-Fokus auf „Create account“, während der Flutter-Fokus weiterwandert: Flutter-Fokus und DOM-/Screenreader-Fokus laufen auseinander.
Folge: Ein Screenreader im Web sagt beim primären Button voraussichtlich das falsche Element an. Betrifft alle Auth-Screens, die AppPrimaryButton nutzen (QUE-06 Kriterium 4, Tastaturbedienung/Fokus).

Vorschlag

AppPrimaryButton korrigieren: entweder focusable: enabled und focused aus einem FocusNode setzen, oder excludeSemantics entfernen, so dass die Button-Semantik des FilledButton erhalten bleibt.
Widget-Test isSemantics(isFocusable: true) auf dem Knopf.
Danach im Test e2e/tests/web/krit49-anmeldung-einstieg.spec.ts auch für „Sign in“ toBeFocused prüfen.

Nicht geprüft

Echter Screenreader (VoiceOver/TalkBack/NVDA), iOS/Android.

Refs #49, QUE-06

## Befund Im Review von PR A zu #49 aufgefallen (vorbestehend, nicht durch #49 verursacht): `app/lib/core/widgets/app_primary_button.dart:66-70` umschließt den `FilledButton` mit `Semantics(button: true, …, excludeSemantics: true)`. Dadurch verwirft es die Fokus-Flags des Buttons (`focusable`/`focused`), und sie werden nicht neu gesetzt. Messung im Flutter-Web-Build (Playwright-Probe): - Nach dem Tabben bekommt „Create account“ (OutlinedButton) DOM-Fokus (`flt-semantics role=button tabindex=0`), der primäre Button „Sign in“ nie: Das Element hat kein `tabindex`. - Nach Shift+Tab bleibt der DOM-Fokus auf „Create account“, während der Flutter-Fokus weiterwandert: Flutter-Fokus und DOM-/Screenreader-Fokus laufen auseinander. - Folge: Ein Screenreader im Web sagt beim primären Button voraussichtlich das falsche Element an. Betrifft alle Auth-Screens, die `AppPrimaryButton` nutzen (QUE-06 Kriterium 4, Tastaturbedienung/Fokus). ## Vorschlag - `AppPrimaryButton` korrigieren: entweder `focusable: enabled` und `focused` aus einem `FocusNode` setzen, oder `excludeSemantics` entfernen, so dass die Button-Semantik des `FilledButton` erhalten bleibt. - Widget-Test `isSemantics(isFocusable: true)` auf dem Knopf. - Danach im Test `e2e/tests/web/krit49-anmeldung-einstieg.spec.ts` auch für „Sign in“ `toBeFocused` prüfen. ## Nicht geprüft Echter Screenreader (VoiceOver/TalkBack/NVDA), iOS/Android. Refs #49, QUE-06