presentational-children-focusable-absent
Los roles con hijos presentacionales no deben contener contenido enfocable
Comprueba que un elemento cuyo rol hace presentacionales a sus hijos (button, checkbox, img, option, radio, slider, switch, tab, ...) no contenga ningún descendiente que reciba una parada de tabulación.
Ámbito de aplicación. Se aplica a elementos cuyo rol semántico es uno de los roles WAI-ARIA definidos como con hijos presentacionales (button, checkbox, img, menuitemcheckbox, menuitemradio, meter, option, progressbar, radio, scrollbar, separator, slider, switch, tab, además de doc-pagebreak y graphics-symbol de los módulos DPUB-ARIA/Graphics-ARIA, que heredan el mismo rasgo). El rol puede ser explícito (role="tab") o nativo (<button>, <meter>, <progress>, <option>). Un elemento personalizado cuyos ElementInternals le dan uno de esos roles (this.attachInternals().role), sin un atributo role que nombre otro, cuenta como lo hace un elemento nativo con ese rol.
Resultado esperado. Ningún descendiente del elemento forma parte de la navegación secuencial por foco. El mecanismo de hijos presentacionales elimina a todos los descendientes del árbol de accesibilidad, así que un descendiente que aún recibe una parada de tabulación obtiene el foco sin rol ni nombre que anunciar.
Qué informa un hallazgo.
role: el rol que hace presentacionales a los hijos del elemento.focusableElements: el nombre de etiqueta de cada parada de tabulación encontrada dentro del elemento, un elemento por parada de tabulación, en el orden del documento.
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
<button>Save</button>
No hay contenido presentacional que además resulte ser enfocable.
<button>Save<span role="button" aria-label="save options" aria-expanded="false" tabindex="0">▼</span></button>
El <span> anidado tiene su propio rol interactivo y parada de tabulación dentro del contenido presentacional del botón.