Validación HTML: Un elemento "input" con un atributo "type" cuyo valor es "hidden" no debe tener ningún atributo "aria-*".

Acerca de este problema HTML

Los inputs ocultos están diseñados para transportar datos entre el cliente y el servidor sin ninguna interacción del usuario o presencia visual. El navegador no los renderiza, los lectores de pantalla no los anuncian y están completamente excluidos del árbol de accesibilidad. Como los atributos aria-* existen únicamente para transmitir información a las tecnologías de asistencia, añadirlos a un elemento que las tecnologías de asistencia no pueden percibir es contradictorio y sin sentido.

La especificación HTML prohíbe explícitamente los atributos aria-* en elementos input con type="hidden". Esta restricción existe porque los atributos WAI-ARIA — como aria-label, aria-invalid, aria-describedby, aria-required y todos los demás de la familia aria-* — están destinados a mejorar la representación accesible de elementos interactivos o visibles. Un input oculto no tiene tal representación, por lo que estos atributos no tienen dónde aplicarse.

Este problema surge comúnmente cuando:

Los frameworks de JavaScript o los motores de plantillas aplican atributos aria-* indiscriminadamente a todos los inputs de formulario, independientemente del tipo.
Un desarrollador cambia el tipo de un input de "text" a "hidden" pero olvida eliminar los atributos de accesibilidad que eran relevantes para la versión visible.
Las librerías de formularios o plugins de validación inyectan automáticamente atributos como aria-invalid en cada input de un formulario.

Para solucionar el problema, simplemente elimina todos los atributos aria-* de cualquier elemento input que tenga type="hidden". Si el atributo aria-* era significativo en un input previamente visible, no se necesita reemplazo — el input oculto no participa en absoluto en la experiencia del usuario.

Ejemplos

Incorrecto: input oculto con `aria-invalid`

<form action="/submit" method="post">
  <input type="hidden" name="referer" value="https://example.com" aria-invalid="false">
  <button type="submit">Submit</button>
</form>

Correcto: input oculto sin atributos `aria-*`

<form action="/submit" method="post">
  <input type="hidden" name="referer" value="https://example.com">
  <button type="submit">Submit</button>
</form>

Incorrecto: input oculto con múltiples atributos `aria-*`

<form action="/save" method="post">
  <input
    type="hidden"
    name="session_token"
    value="abc123"
    aria-label="Session token"
    aria-required="true"
    aria-describedby="token-help">
  <button type="submit">Save</button>
</form>

Correcto: todos los atributos `aria-*` eliminados

<form action="/save" method="post">
  <input type="hidden" name="session_token" value="abc123">
  <button type="submit">Save</button>
</form>

Correcto: atributos `aria-*` en un input visible (donde pertenecen)

Si el input debe ser visible y accesible, usa un valor de type apropiado en lugar de "hidden":

<form action="/login" method="post">
  <label for="username">Username</label>
  <input
    type="text"
    id="username"
    name="username"
    aria-required="true"
    aria-invalid="false"
    aria-describedby="username-help">
  <p id="username-help">Enter your registered email or username.</p>
  <button type="submit">Log in</button>
</form>