Tiene un Rol de Accesibilidad Válido

ID de la Regla: has-valid-accessibility-role

WCAG 2.0 (A) 4.1.2

accessibilityRole comunica el propósito de un componente al usuario de tecnología de asistencia.

accessibilityRole puede ser uno de los siguientes:

• ajustable Usado cuando un elemento se puede "ajustar" (por ejemplo, un deslizador).
• alerta Usado cuando un elemento contiene texto importante para presentar al usuario.
• botón Usado cuando el elemento debe tratarse como un botón.
• casilla de verificación Usado cuando un elemento representa una casilla de verificación que puede estar marcada, desmarcada o tener un estado de marcado mixto.
• cuadro combinado Usado cuando un elemento representa un cuadro combinado, que permite al usuario seleccionar entre varias opciones.
• encabezado Usado cuando un elemento actúa como un encabezado para una sección de contenido (por ejemplo, el título de una barra de navegación).
• imagen Usado cuando el elemento debe tratarse como una imagen. Se puede combinar con un botón o enlace.
• botón de imagen Usado cuando el elemento debe tratarse como un botón y también es una imagen.
• tecla de teclado Usado cuando el elemento actúa como una tecla de teclado.
• enlace Usado cuando el elemento debe tratarse como un enlace.
• menú Usado cuando el componente es un menú de opciones.
• barra de menú Usado cuando un componente es un contenedor de múltiples menús.
• elemento de menú Usado para representar un elemento dentro de un menú.
• ninguno Usado cuando el elemento no tiene un rol.
• barra de progreso Usado para representar un componente que indica el progreso de una tarea.
• radio Usado para representar un botón de opción.
• grupo de radio Usado para representar un grupo de botones de opción.
• barra de desplazamiento Usado para representar una barra de desplazamiento.
• búsqueda Usado cuando un elemento de campo de texto también debe ser tratado como un campo de búsqueda.
• botón de giro Usado para representar un botón que abre una lista de opciones.
• resumen Usado cuando un elemento se puede usar para proporcionar un resumen rápido de las condiciones actuales en la aplicación cuando la aplicación se inicia por primera vez.
• interruptor Usado para representar un interruptor que se puede encender y apagar.
• pestaña Se usa para representar una pestaña.
• lista de pestañas Se usa para representar una lista de pestañas.
• texto Se usa cuando el elemento debe tratarse como texto estático que no puede cambiar.
• temporizador Se usa para representar un temporizador.
• botón de alternar Se usa para representar un botón de alternar. Debe usarse con accessibilityState check para indicar si el botón está activado o desactivado.
• barra de herramientas Se usa para representar una barra de herramientas (un contenedor de botones de acción o componentes).
• cuadrícula Se usa con ScrollView, VirtualizedList, FlatList o SectionList para representar una cuadrícula. Añade los anuncios de entrada/salida de cuadrícula al GridView de Android.

Por qué importa

Los elementos asignados con valores de rol inválidos no son interpretados por las tecnologías de asistencia como pretende el desarrollador.

Cuando los lectores de pantalla y otras tecnologías de asistencia no conocen el rol de cada elemento, no pueden interactuar con él de manera inteligente, ni pueden comunicar el rol al usuario. Las características, propiedades y métodos de un elemento para transmitir información hacia y/o desde el usuario no pueden ser comunicados a través de tecnologías de asistencia cuando un valor de rol no es válido.

Cómo solucionar el problema

Asegúrate de que el valor accessibilityRole es un rol válido.

Ejemplos que pasan

<TouchableOpacity accessibilityRole="button">
  <Text>Increase Count</Text>
</TouchableOpacity>

Ejemplos que fallan

<TouchableOpacity accessibilityRole="secondary-button">
  <Text>Increase Count</Text>
</TouchableOpacity>

Recursos

• React Native accessibilityRole