bug(stepper): aria-disabled not properly updated for step header buttons in linear steppers
- Vorherrschende Sprache
- TypeScript
- Sterne
- 25k
- Forks
- 6.8k
- Ø Merge
- 1 T. 8 Std.
- Gemergte PRs (30 T.)
- 91
Beschreibung
#### Reproduction
Example of a linear stepper with this issue: https://stackblitz.com/angular/vbkvxdpeoml?file=src%2Fapp%2Fstepper-overview-example.ts
Steps to reproduce:
1. Enable linear mode
2. Fill out first step
3. Go back to step header using keyboard navigation
4. Move focus to next step
#### Expected Behavior
The screen reader should read aloud the content of the button but not mention anything about being disabled since clicking the button will work.
#### Actual Behavior
The screen reader says the button is disabled.
This is because aria-disabled attribute is still set on the button, but shouldn't be anymore since the step is now complete.
#### Environment
- Angular: 12.2.4
- CDK/Material: 12.2.4
- Tested on Chrome with NVDA, ChromeVox, and VoiceOver.
Beitragsleitfaden
Rechercherichtung
Beginne mit dem verknüpften StackBlitz-Beispiel unter src/app/stepper-overview-example.ts und reproduziere die Tastatursequenz in einem linearen Stepper. Verfolge den aria-disabled-Zustand der Schaltfläche der Schrittüberschrift; fertig, wenn die unterstützende Technologie diese Schaltfläche nicht mehr als deaktiviert meldet, nachdem der erste Schritt abgeschlossen ist und der Fokus zur nächsten Überschrift verschoben wurde.
Vom Indexierungsmodell aus dem Issue-Text verfasst.
Bewertung
- Tech-Stack
- angular, typescript
- Bereich
- accessibility, frontend
- Issue-Typ
- Bug
- Schwierigkeit
- 3/5
- Geschätzter Aufwand
- 1-2 Tage
- Aktivitätsstatus
- Veraltet
- Klarheit
- Größtenteils klar
- Anfängerfreundlichkeit
- 45/100