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:

• adjustable Usado cuando un elemento se puede "ajustar" (por ejemplo, un deslizador).
• alert Usado cuando un elemento contiene texto importante para presentar al usuario.
• button Usado cuando el elemento debe tratarse como un botón.
• checkbox Usado cuando un elemento representa una casilla de verificación que puede estar marcada, desmarcada o tener un estado de marcado mixto.
• combobox Usado cuando un elemento representa un cuadro combinado, que permite al usuario seleccionar entre varias opciones.
• header 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).
• image Usado cuando el elemento debe tratarse como una imagen. Se puede combinar con un botón o enlace.
• imagebutton Usado cuando el elemento debe tratarse como un botón y también es una imagen.
• keyboardkey Usado cuando el elemento actúa como una tecla de teclado.
• link Usado cuando el elemento debe tratarse como un enlace.
• menu Usado cuando el componente es un menú de opciones.
• menubar Usado cuando un componente es un contenedor de múltiples menús.
• menuitem Usado para representar un elemento dentro de un menú.
• none Usado cuando el elemento no tiene un rol.
• progressbar Usado para representar un componente que indica el progreso de una tarea.
• radio Usado para representar un botón de opción.
• radiogroup Usado para representar un grupo de botones de opción.
• scrollbar Usado para representar una barra de desplazamiento.
• search Usado cuando un elemento de campo de texto también debe ser tratado como un campo de búsqueda.
• spinbutton Usado para representar un botón que abre una lista de opciones.
• summary 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.
• switch Usado para representar un interruptor que se puede encender y apagar.
• tab Se usa para representar una pestaña.
• tablist Se usa para representar una lista de pestañas.
• text Se usa cuando el elemento debe tratarse como texto estático que no puede cambiar.
• timer Se usa para representar un temporizador.
• togglebutton Se usa para representar un botón de alternar. Debe usarse con accessibilityState check para indicar si el botón está activado o desactivado.
• toolbar Se usa para representar una barra de herramientas (un contenedor de botones de acción o componentes).
• grid 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