angular / angular/components

bug(mat-option): JAWS 2023 does not announce a checked option as selected in a multiple selection mat-select

Abierto
#28,214 4 comentarios 0 reacciones 1 asignado Asignado a @adolgachev Ver en GitHub
Accessibility area: material/select P3
Lenguaje dominante
TypeScript
Estrellas
25k
Forks
6.8k
Merge medio
1 d 8 h
PR fusionados (30 d)
91

Descripción

### Is this a regression?

- [ ] Yes, this behavior used to work in the previous version

### The previous version in which this bug was not present was

_No response_

### Description

The screen reader JAWS version 2023 does not announce a checked option as selected in a multiple selection mat-select. It does announce unchecked options as selected.

I tried other Windows screen readers, NVDA does not announce it either but Narrator does. So it could be a screen reader implementation issue.

Also, this issue has been discussed before: https://github.com/angular/components/issues/21949 and it was considered to be working as expected. But I want to bring this up again because I consider that the mat-option component is not following the WAI ARIA Listbox pattern completely, please see Note 1 in this section https://www.w3.org/WAI/ARIA/apg/patterns/listbox/#roles_states_properties.

> 1. Some factors to consider when choosing whether to indicate selection with aria-selected or aria-checked are:
Some design systems use aria-selected for single-select widgets and aria-checked for multi-select widgets. In the absence of factors that would make an alternative convention more appropriate, this is a recommended convention.

Mat Option uses aria-select for both single and multiple selection. Based on this recommendation, it should use aria-selected for single selection and aria-checked for multiple selection.

### Reproduction

Steps to reproduce:
1. Start JAWS in a Windows machine.
2. Go to https://material.angular.io/components/select/overview#select-multiple
3. Select the multiple selection dropdown.
4. Navigate through the options using the arrow keys.
5. Select a few options.
6. Navigate through selected and unselected options and check how the screen reader announces them.

### Expected Behavior

I expect screen readers to announce if an option is selected or unselected.

### Actual Behavior

JAWS only announces the status of an unselected option.

### Environment

- Angular: 15.2.9
- CDK/Material: 15.2.9
- Browser(s): Chrome 119.0.6045.199
- Operating System: Windows 10 Enterprise

Guía de contribución

Abrir la guía de contribución

Evaluación

Este issue todavía no se ha evaluado.

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.