Analizzare gli iframes
Come l'Axe DevTools for Web CLI analizza il contenuto all'interno degli iframes, e come raggiungere gli elementi all'interno di un frame.
Le pagine spesso inseriscono contenuti sostanziali all'interno degli elementi <iframe>: moduli di pagamento, lettori multimediali, mappe incorporate, widget di chat e aiuto, e componenti di terze parti. Il CLI analizza il contenuto di questi frame come parte di un'analisi ordinaria della pagina, quindi il contenuto nei frame non rappresenta una lacuna nella tua copertura.
Non c'è nulla da attivare. axe-core viene caricato nei frame della pagina, ciascun frame viene analizzato insieme al documento di livello superiore e i risultati vengono combinati nello stesso file di risultati JSON per la pagina.
Come vengono riportati i risultati dei frame
I risultati dei frame arrivano nelle stesse array violations, passes, incomplete e inapplicable come il resto della pagina. Ciò che li identifica è l'array target su ciascun nodo risultante: contiene un selettore per ogni livello di nidificazione dei frame, seguito da un selettore per l'elemento stesso.
- Un
targetcon un'entrata è un elemento nel documento di livello superiore. - Un
targetcon due entrate è un elemento all'interno di un frame: il primo selettore trova il frame nel documento genitore, e il secondo trova l'elemento all'interno del documento di quel frame. - Ogni entrata aggiuntiva rappresenta un ulteriore livello di nidificazione dei frame.
Ciò significa che un report può indicare un elemento che non esiste nell'HTML della pagina stessa. Leggi l'array target dall'esterno verso l'interno per trovare dove si trova effettivamente l'elemento.
Indirizzare gli elementi all'interno di un frame
Per agire su o analizzare un elemento all'interno di un frame, utilizza un file spec e indica il selettore come un elenco. Tutti i selettori nell'elenco tranne l'ultimo identificano gli elementi <iframe> successivi da navigare, e l'ultimo identifica l'elemento di destinazione all'interno del frame più interno. Vedi Selettori per le regole complete e gli esempi.
# Analyze only the card form inside the card-fields frame,
# which is itself inside the payment-widget frame
analyze only element ["iframe.payment-widget", "#card-fields", "form"]
# Analyze the page, but skip everything inside a third-party frame
analyze the page excluding element [".third-party-frame", "html"]Scrivi l'elenco senza spazio tra [ e il primo segno di virgolette, altrimenti il file spec non passa la validazione.
I selettori consapevoli dei frame funzionano sia per le azioni sulla pagina che per analyze, quindi un workflow può cliccare un pulsante o riempire un campo all'interno di un frame prima di analizzare il risultato. Vedi Azioni sulla pagina.
Poiché un elenco di selettori viene sempre letto come un percorso attraverso i frame, non può essere utilizzato per selezionare diversi elementi non correlati. Per limitare un'analisi a più di una regione di una pagina, ripeti la clausola element.
Frame e Modalità URI
Le opzioni --include e --exclude di axe <url> accettano un elenco di selettori CSS separati da virgole che vengono valutati solo contro il documento di livello superiore, quindi non possono mirare a un elemento all'interno di un frame. Il contenuto all'interno dei frame viene comunque analizzato; semplicemente non puoi delimitarlo dalla riga di comando.
Due conseguenze sono degne di nota:
- Nominare un elemento frame, come in
--include "#checkout-frame", delimita l'analisi a quel frame e tutto ciò che è al suo interno, poiché il contenuto del frame viene analizzato con esso. - I selettori extra dopo il primo sono ignorati silenziosamente quando non corrispondono a nulla nel documento di livello superiore.
--include "#outer,#inner,#leaf"produce esattamente gli stessi risultati di--include "#outer", senza alcun avviso che il resto del percorso sia stato troncato. Un selettore che esiste solo all'interno di un frame fallisce del tutto conNo elements found for include in page Context.
Usa un file spec quando hai bisogno di mirare a qualcosa all'interno di un frame.
La regola frame-tested di axe-core segnala qualsiasi frame che axe-core non è riuscito a raggiungere, che è come distinguere "nessun problema in questo frame" da "questo frame non è mai stato analizzato." È una regola di buona pratica, quindi non fa parte dei set di regole WCAG che il CLI esegue di default; per ottenere quei risultati, utilizza un set di regole personalizzato che includa le regole di buona pratica. Vedi Regole personalizzate.