Ponlo en tu app Teclado y accesibilidad
Teclado y accesibilidad
Todo lo que hace el ratón lo hace también el teclado, y a un lector de pantalla se le dice dónde está. axe revisa cada estado al que llegan los tests del navegador, según WCAG 2.2 AA, en ambos temas.
Las teclas
| Tecla | Qué hace |
|---|---|
| ↑ ↓, Inicio, Fin | Por la lista o la cuadrícula. |
| Enter | Abrir: en una carpeta entra, un archivo se abre en el visor. |
| Espacio, Mayús + ↑ ↓, ⌘/Ctrl + A | Elegir varios. |
| F2 | Renombrar. |
| Supr, Retroceso | A la papelera. |
| ⌘/Ctrl + Z | Deshacer el último envío a la papelera, movimiento, cambio de nombre o color. |
| Mayús + F10, la tecla de menú | El menú de lo elegido. |
| ← → | En el visor: el archivo anterior y el siguiente. |
| Escape | Cerrar el menú, el diálogo o el visor. |
Lo que oye un lector de pantalla
- La lista es un listbox: cada entrada se anuncia con su propietario, fecha y tamaño, y cuántas hay elegidas.
- El aviso es un status que se lee, con su botón Deshacer al alcance del Tab.
- Los diálogos retienen el foco dentro y lo devuelven donde estaba al cerrarse.
- El panel de subidas es una región; cada archivo tiene una barra de progreso con su nombre, y un fallo es una alerta.
- Los colores de una carpeta son un grupo de botones de opción, cada uno con nombre.
Cómo se comprueba
npm run test:browser recorre el drive solo con el teclado y pasa axe en cada estado: vacío y con archivos, la lista y la cuadrícula, cada diálogo, la papelera, una búsqueda, el español al ancho de un móvil, un enlace sin sesión, y lo mismo en el tema oscuro, elegido y según el sistema.