Análisis de iframes
Cómo las Axe DevTools para APIs Web analizan contenido dentro de iframes, y cómo delimitar o restringir el análisis de marcos.
Las páginas a menudo colocan contenido sustancial dentro de elementos <iframe>: formularios de pago, reproductores de medios, mapas incrustados, widgets de chat y ayuda, y componentes de terceros. Las Axe DevTools para APIs Web analizan el contenido de esos marcos como parte de un análisis ordinario de página, en todos los idiomas soportados, de modo que el contenido enmarcado no queda fuera de tu cobertura y no necesita un conjunto de pruebas separado.
No hay nada que activar. axe-core se carga en los marcos de la página, cada marco se analiza junto con el documento de nivel superior, y los resultados se combinan en un solo informe para la página.
Cómo se informan los resultados de los marcos
Los resultados de los marcos llegan en las mismas matrices violations, passes, incomplete y inapplicable que el resto de la página. Lo que los identifica es la matriz target en cada nodo de resultado: contiene un selector por nivel de anidamiento del marco, seguido por un selector para el elemento en sí.
- Un
targetcon una entrada es un elemento en el documento de nivel superior. - Un
targetcon dos entradas es un elemento dentro de un marco: el primer selector encuentra el marco en el documento principal, y el segundo encuentra el elemento dentro de ese documento del marco. - Cada entrada adicional representa otro nivel de anidamiento de marcos.
Para ver la estructura completa del resultado, consulta la Referencia de la API de JavaScript del navegador.
Delimitar el análisis a un marco o dentro de él
Cada API que acepta selectores include y exclude también acepta un camino a través de marcos anidados. La regla es la misma en todos los idiomas: todos los selectores menos el último coinciden con elementos sucesivos <iframe>, y el último coincide con el elemento a analizar dentro del marco más interno. El orden importa, porque el marco debe preceder al elemento dentro de él.
| Idioma | Cómo apuntar a un elemento dentro de un marco | Referencia |
|---|---|---|
| Node.js y JavaScript | Pasa un arreglo de selectores a include o exclude |
Referencia de la API de JavaScript del navegador |
| C# | Including/Excluding con varios selectores, o un selector FromFrames |
Referencia de la API de C# |
| Java | including/excluding con un List<String>, o un IFrameSelector con Hamcrest |
Pruebas de Selenium, Referencia de la API de Hamcrest |
| Python | including()/excluding() con varios selectores |
Referencia de la API de Python |
| Ruby | Una cláusula within con un iframe: y un hash selector: |
RSpec |
Dado que una lista de selectores siempre se lee como un camino a través de marcos, no se puede usar para seleccionar varios elementos no relacionados. Para analizar más de una región de una página, usa el método include o exclude una vez por región.
Restringir el análisis de marcos
Los marcos hacen que una página sea más dinámica, y en páginas donde se agregan o eliminan marcos mientras se ejecuta un análisis, inyectar axe-core en cada marco puede fallar. La API de Java proporciona un sistema de seguridad que limita un análisis al documento de nivel superior: llama a disableIframeTesting() antes de ejecutar, y axe-core no se inyecta en ningún marco. Consulta Pruebas de Selenium.
La opción de ejecución de axe-core iframes no apaga el análisis de marcos en estas APIs. Debido a que cada biblioteca inyecta axe-core en los marcos a través del controlador del navegador en vez de dejar que axe-core los recorra, un análisis informa los resultados de los marcos independientemente de si la opción está configurada. Para limitar el alcance de un análisis, excluye el marco en su lugar, usando el método exclude para tu idioma.
Marcos de origen cruzado y en sandbox
Un marco solo puede ser analizado cuando axe-core puede ejecutarse dentro de él y reportar sus resultados de regreso.
Los marcos de origen cruzado son analizados. Debido a que estas APIs manejan una sesión real del navegador e inyectan axe-core en cada marco a través del controlador, un marco servido desde un origen diferente se analiza como cualquier otro marco, y sus resultados aparecen con el resto de la página.
Los marcos en sandbox dependen de la biblioteca. Un marco con un atributo sandbox que omite allow-scripts bloquea la ejecución del script que axe-core necesita. Algunas bibliotecas resuelven esto y analizan el marco de todos modos; otras reportan el marco como no probado. La API de Python expone without_iframe_sandboxes(), lo que elimina el atributo sandbox para que axe-core se pueda ejecutar dentro de esos marcos. Consulta la Referencia de la API de Python.
Usa la regla frame-tested de axe-core para distinguir "sin problemas en este marco" de "este marco nunca fue analizado". Un marco que axe-core no pudo alcanzar se informa como incompleto, y uno al que sí alcanzó pasa la regla. Es una regla de mejor práctica, por lo que solo aparece cuando tu conjunto de reglas incluye reglas de mejor práctica; un conjunto de reglas limitado a las reglas WCAG la omite, y un marco no analizado entonces no produce ninguna señal en absoluto.