aria-conditional-attr
aria-errormessage requiere que aria-invalid tenga un valor distinto de false
Comprueba que los elementos con aria-errormessage también tengan aria-invalid establecido en "true", "grammar" o "spelling"; de lo contrario, el mensaje de error se descarta del árbol de accesibilidad.
Ámbito de aplicación. Elementos con un atributo aria-errormessage no vacío.
Resultado esperado. Según la especificación ARIA, aria-errormessage solo se expone a la tecnología de asistencia cuando aria-invalid está presente con un valor distinto de "false" (es decir, "true", "grammar" o "spelling"). Un elemento con aria-errormessage pero con aria-invalid ausente o en "false" descarta silenciosamente el mensaje de error del árbol de accesibilidad; los autores casi siempre pretenden que se exponga. Devuelve cantTell en lugar de fail: aria-errormessage solo se expone una vez que se establece aria-invalid, por lo que la referencia está actualmente inactiva. Que eso le cueste algo al usuario depende de si el mensaje se transmite de otra forma (texto visible junto al campo, aria-describedby), algo que el marcado estático no resuelve.
Qué informa un hallazgo.
ariaInvalid: el valor dearia-invaliddel elemento, en minúsculas; una cadena vacía cuando el atributo está ausente.
Estos campos de data.details ayudan a leer y reproducir un hallazgo. Salvo reasonCode y los pocos campos que Esquema de salida indica como estables, no son un contrato estable: un campo puede cambiar de nombre o desaparecer en una versión menor, así que no construyas sobre ellos.
Ejemplos
<input type="text" aria-invalid="true" aria-errormessage="err1"><span id="err1">Enter a valid email address.</span>
aria-invalid="true" significa que aria-errormessage se expone a la tecnología de asistencia.
<input type="text" aria-errormessage="err1"><span id="err1">Enter a valid email address.</span>
Sin aria-invalid establecido en un valor distinto de "false", aria-errormessage nunca se expone: la referencia está actualmente inactiva.
Cómo comprobarlo
Cuando esta regla no puede decidir, informa cantTell y deja la pregunta a una persona. Cada pregunta que puede plantear aparece aquí bajo su código de motivo, con los pasos para responderla. Un hallazgo lleva los mismos pasos en howToCheck, en el idioma del análisis. Consulta Esquema de salida.
ARIA_ERRORMESSAGE_WITHOUT_TRUTHY_INVALID
- Inspeccionar el campo que indica el informe y anotar el id de su aria-errormessage.
- Introducir un valor no válido (o dejar vacío un campo obligatorio) y enviar el formulario o salir del campo, para que aparezca cualquier error.
- Observar si el elemento con ese id muestra ahora texto de error, y volver a inspeccionar el campo en busca de aria-invalid="true".
- Con un lector de pantalla, volver al campo y escuchar el mensaje de error.
- Si no se oye el error en el campo, comprobar si la página lo lee de otra forma, por ejemplo en cuanto aparece el mensaje, sin mover el foco. Solo cuenta si el lector de pantalla anuncia el mensaje completo.
Se cumple. Cuando se muestra el error, el lector de pantalla lo anuncia, ya sea en el campo (aria-invalid="true" o el mensaje en aria-describedby) o en cuanto aparece; cuando no hay error, no hay nada que exponer.
No se cumple. El texto de error es visible pero aria-invalid sigue ausente o en false, y el lector de pantalla no anuncia el mensaje ni en el campo ni cuando aparece, lo que incumple WCAG 3.3.1 / 4.1.2 (véase ARIA21).