Accessibility is half-baked
Nadie ha tomado este issue todavía.
Evaluación
- Dificultad
- 4/5
- Tiempo estimado
- 3-5 días
- Aptitud para principiantes
- 35/100
- Tipo de issue
- Error
- Claridad
- Bastante claro
- Estado de actividad
- Estancado
- Stack tecnológico
- react, typescript
- Área
- accessibility, frontend
Línea de trabajo
El issue no menciona archivos, tests ni puntos de entrada. Empieza localizando el trigger del dropdown y la implementación del menú; después, inspecciona el comportamiento existente de aria-activedescendant. Se considera terminado cuando el trigger está asociado al menú, la navegación mediante teclado usa roving tabindex con el foco en el primer elemento al abrirse y Escape cierra el menú.
Escrito por el modelo de indexación a partir del texto del issue.
Descripción
Hi, I see there are some ARIA attributes in place for menus. However, the dropdown can't be navigated with the keyboard, and the trigger button is not associated with the menu.
First, the button needs to be bound to the menu–this can be done with aria-controls="theMenuID", aria-haspopup="true", and aria-expanded="true | false".
When the dropdown opens, focus should be sent to the first item (which needs tabindex="0") instead of the unordered list which has tabindex. Using the roving tabindex technique, only one item can be tabbable at a time when the menu is open. You've already got aria-activedescendant working, so the tabindex and focus management portions will get you part of the way there!
Hooking up the escape key to close the menu would be a nice addition, too.
- Lenguaje dominante
- TypeScript
- Estrellas
- 181
- Forks
- 112
- Merge medio
- 12 h 52 min
- PR fusionados (30 d)
- 2
Guía de contribución
No hay ninguna guía de contribución indexada para este repositorio
Primeros pasos
- Lee el issue completo y luego la guía de contribución del proyecto.
- Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
- Haz un fork del repositorio y trabaja en una rama.
- Abre un pull request que haga referencia al número del issue.
Más de react-component/dropdown
-
safari 浏览器手势放大后下拉菜单位置不正确 Abierto
Dificultad 3/5 1-2 días Aptitud para principiantes 45/100
react-component/dropdown#245 ·
-
Dificultad 3/5 1-2 días Aptitud para principiantes 35/100
react-component/dropdown#242 ·
-
Dificultad 5/5 Más de una semana Aptitud para principiantes 15/100
react-component/dropdown#241 ·
-
Dificultad 5/5 Más de una semana Aptitud para principiantes 20/100
react-component/dropdown#231 ·
-
Dificultad 3/5 1-2 días Aptitud para principiantes 35/100
react-component/dropdown#229 ·
Todos los issues de react-component/dropdown
Issues similares
-
bug(cli): hapi doctor inline-media prints a fabricated B:\ helper-script path in packaged installs Abierto
Dificultad 2/5 1-3 horas Aptitud para principiantes 70/100
-
Crush Abierto
Dificultad 1/5 Menos de una hora Aptitud para principiantes 85/100
catppuccin/catppuccin#3125 ·
-
Add a SECURITY.md Abierto
Dificultad 1/5 Menos de una hora Aptitud para principiantes 90/100
ElementsProject/cln-application#167 · 1 comentario · 1 reacción ·
-
Dificultad 2/5 1-3 horas Aptitud para principiantes 75/100
Quantco/pnpm-licenses#17 ·
-
Dificultad 2/5 1-3 horas Aptitud para principiantes 75/100