Ambito in axe Esperto

Definisci un ambito nell'estensione axe Expert quando vuoi testare solo determinate parti di una pagina anziché l'intera pagina. In molti siti web ci sono elementi o aree "modello" comuni a molte pagine di un sito. Può essere utilizzato per testare in modo specifico i componenti comuni del modello oppure per ignorarli e concentrarsi sul contenuto che non fa parte dei componenti comuni (ad esempio, sezioni di intestazione, piè di pagina o navigazione). La versione 1.1 e le successive dell'estensione Axe Expert sono state progettate e implementate utilizzando selettori CSS (Cascading Style Sheet) allo scopo di definire l'ambito.

Supporto della versione XPath

Axe Monitor v6.0 o versione successiva supporta sia il selettore CSS che le tecnologie XPath, poiché in precedenza la versione 1.0 di XPath era supportata dalla versione 1.0 di Axe Expert Extension. Per ulteriori informazioni, vedere XML Path Language (XPath) versione 1.0 - W3C.

Per evitare la duplicazione delle violazioni durante l'analisi di più pagine, la funzionalità di definizione dell'area di applicazione di axe Expert Extension fornisce un modo per limitare ciò che viene analizzato a una o più sezioni specifiche di una pagina, ignorando il contenuto comune e ripetuto che non è selezionato come parte dell'area di applicazione. Definire le definizioni di ambito durante l'analisi con script avrà lo stesso effetto dell'analisi statica. In altre parole, includere nello script solo le parti definite della pagina. Questo processo è particolarmente utile quando si testano solo definizioni dell'area di applicazione che coprono le aree di contenuto della pagina, eliminando i problemi ripetitivi riscontrati nei modelli di test.

Abilitazione della funzionalità Scope senza accedere ad axe Monitor

Per abilitare la visualizzazione della funzionalità Scope nel pannello Impostazioni senza accedere a axe Monitor, attenersi alla seguente procedura:

1. Seleziona Scope nel menu a discesa dell'axe Expert Extension per accedere alla scheda Impostazioni :

   

2. L'estensione visualizza la scheda axe Expert Extension Scope vuota al primo accesso:

   

   NON effettuare l'accesso ad axe Monitor. In alternativa, crea un nuovo ambito privo di progetto utilizzando le Descrizioni delle opzioni e le Descrizioni delle colonne:

   

Abilitazione della funzionalità Ambito durante l'accesso ad axe Monitor

Per abilitare la visualizzazione della funzionalità Scope nel pannello Impostazioni durante l'accesso ad axe Monitor, attenersi alla seguente procedura:

1. Accedi ad axe Monitor nella scheda Impostazioni nel pannello axe Expert. Per i dettagli completi, vedere Accedi ad axe Monitor.

   Dopo aver effettuato l'accesso, la sezione Selezione progetto viene visualizzata nel pannello Impostazioni.

2. Selezionare un progetto utilizzando il menu Seleziona un progetto e il pulsante nel pannello Impostazioni. Per maggiori dettagli, vedere Seleziona un progetto di axe Monitor.

   La funzionalità Definizioni ambito viene visualizzata sotto le sezioni di selezione del progetto e di download dei problemi nel pannello Impostazioni.

   

Descrizioni delle opzioni

Una volta abilitata, vedrai la sezione Ambito nel pannello Impostazioni in Estensione Esperto axe, che mostra un gruppo di opzioni di pulsanti di scelta Analizza ambito con le seguenti tre opzioni disponibili tra cui selezionare:

• Intera pagina: selezionare per restringere l'ambito definito quando si esegue un'analisi nel pannello Analisi all'intera pagina caricata nel browser.
• Solo contenuto: selezionare per definire l'ambito quando si esegue un'analisi nel pannello Analizza solo gli elementi di contenuto che non fanno parte di alcun modello definito nella tabella Definizioni di ambito riportata di seguito.
• Solo template: seleziona questa opzione per perfezionare l'analisi eseguita nel pannello Analizza su tutto tranne le definizioni del contenuto nella pagina caricata in fase di test.

Descrizioni delle colonne

Sotto la sezione Opzioni ambito di analisi, vedrai la sezione della tabella delle definizioni di ambito, che mostra una tabella con le seguenti sei colonne di informazioni:

• Nome: campo di immissione testo utilizzato per assegnare alla definizione dell'ambito un nome chiaro e significativo (ad esempio, "Intestazione").
• Categoria: Campo del menu a discesa utilizzato per specificare il tipo di ambito. Le opzioni includono 'Template 1-4' (pagina intera) e 'Contenuto 1-4' (corpo della pagina). Possono essere utilizzati per raggruppare definizioni di ambito correlate in modo da poterle ordinare facilmente.
• Schema URL: un campo di immissione di testo utilizzato per specificare una o più parti di un sito Web che utilizza un set di modelli diverso rispetto alla parte principale del sito (ad esempio, un'area di shopping o di servizi per i membri), definito con una stringa di testo che appare immediatamente dopo il nome di dominio nell'indirizzo della pagina per un modello che utilizza una corrispondenza con carattere jolly (ad esempio, '/products' corrisponderebbe a '/products' così come a qualsiasi stringa di testo che lo segue).
• Selettori CSS: un campo di immissione di testo utilizzato per specificare il localizzatore del contenuto da scegliere come target (ad esempio, /html/body per il corpo del documento o html per specificare l'intera pagina). In genere, è necessario conoscere l'attributo id dell'elemento che si desidera valutare. Per esempio:
  • **/section[@id='content']** identifies a section tag with an id of "content": <section id="content">
  • **/div[@id='header-panel']** identifies a div with an id of "header-panel": <div id="header-panel">
  • **/div[@id='right-column']** identifies a div with an id of "right-column": <div id="right-column">
  • **/html/body/section/div[2]/div[3]** identifies an item without an id: the third div inside the second div inside the section tag inside the body of the html
• + Frame: fare clic per aggiungere una nuova riga sottostante che fornisce un campo di immissione del testo che è possibile utilizzare per inserire un localizzatore di selettore CSS selezionato (i dati della regione del nodo DOM) se la regione si trova all'interno di un frame. Il simbolo più si trasforma in un meno per indicare che è possibile rimuovere la linea dopo che è stata aggiunta.
• Azioni: all'interno di una riga vuota, il pulsante Salva viene visualizzato nella colonna Azioni, che consente di aggiungere la selezione/le voci come nuova riga di definizione dell'ambito. Dopo l'aggiunta di una riga, vengono visualizzati i pulsanti Modifica ed Elimina .

Aggiungere una definizione di ambito

Segui questa procedura ogni volta che vuoi limitare o restringere la porzione della pagina che stai analizzando a un selettore CSS o a un pattern URL categorizzato in base al contenuto, al modello o all'intera pagina. Per aggiungere una definizione di ambito è sufficiente popolare cinque colonne di informazioni nella tabella della sezione Ambito nel pannello Impostazioni in axe Expert, quindi selezionare il pulsante Salva.

Definizioni di ambito e associazione automatica con i progetti di axe Monitor

La sezione Ambito del pannello Settings viene visualizzata solo dopo che è stata stabilita una connessione con axe Monitor ed è stato selezionato un progetto. La definizione e il salvataggio di un ambito tramite questa procedura aggiungono la definizione dell'ambito al progetto selezionato in axe Monitor, in modo che quando si seleziona nuovamente il progetto in axe Expert Extension, le definizioni dell'ambito esistenti vengono caricate automaticamente nella scheda Settings . Ogni volta che selezioni il progetto, questa definizione di ambito verrà scaricata automaticamente in axe Expert Extension da axe Monitor.

Le definizioni di ambito aggiunte perfezionano l'analisi eseguita nel pannello Analizza in Axe Expert Extension nelle aree della pagina caricata che corrispondono all'ambito.

Prima di iniziare, è importante capire come abilitare la funzionalità di definizione dell'ambito e comprendere lo scopo di ogni opzione e campo della colonna della tabella.

1. Nella sezione Ambito del pannello Impostazioni, inserisci un testo significativo nella colonna Name (ad esempio, 'Header').

2. Nella colonna Category , accedi alle opzioni del menu a discesa, quindi seleziona un elemento nell'elenco (ad esempio, 'Template 1').

   Category L'elenco a discesa si chiude e la selezione viene inserita nel campo visualizzato.

3. Nel campo URL pattern , se lo desideri, inserisci la stringa di testo dopo il nome di dominio (ad esempio, '/html/head').

4. Facoltativamente, selezionare + Frame per visualizzare un nuovo campo Selettore CSS vuoto su una nuova riga sottostante, quindi inserisci il selettore per il componente, se è contenuto in una cornice.

   

5. Nel campo CSS Selector(s) , immetti il selettore che hai selezionato utilizzando lo strumento che preferisci (ad esempio, tramite right-click > Copy > Copy selector in Chrome DevTools dopo aver evidenziato il codice sorgente nello strumento Elements ).

6. Nella colonna Azioni, selezionare Save.

   

L'ambito aggiunto viene visualizzato come una nuova riga nella tabella e nella colonna Azioni sono visualizzati i pulsanti che consentono di modificarlo o eliminarlo. Inoltre, sotto la riga dell'ambito salvato viene visualizzata una nuova riga vuota, che consente di specificare e salvare un altro ambito, ecc.

Ora puoi selezionare l'opzione desiderata Analyze scope nella sezione sopra la tabella, quindi eseguire un'analisi sulla pagina caricata definita dall'ambito specificato.

Modificare una definizione di ambito

Modifica una definizione di ambito quando si desidera modificare una definizione di ambito esistente cambiando uno o più dei cinque campi di informazioni. Seleziona Edit nella Actions colonna della Scope tabella delle sezioni nel pannello Impostazioni in axe Expert consente di modificare l'ambito di ciò che verrà preso di mira quando si esegue un'analisi della pagina caricata nel pannello Analizza. Ciò modifica di conseguenza anche i dati memorizzati in axe Monitor.

1. Attiva Edit nella Actions colonna della Scope tabella delle sezioni.

   

   I campi diventano modificabili in ogni colonna e la Actions colonna visualizza un pulsante X e un pulsante Y. Save Cancel

2. Apportare le modifiche desiderate a uno o più campi della colonna, quindi attiva il pulsante Save nella Actions colonna.

   

Le modifiche salvate vengono visualizzate come una riga di sola lettura nella tabella e vengono sincronizzate automaticamente con axe Monitor.

Novità dell'estensione del browser Attest v2.8: il pulsante ANALYZE AGAIN button è disabilitato quando l'ambito dell'analisi non è salvato.

È troppo facile trascurare se un utente ha salvato o meno l'ambito dell'analisi corrente prima di fare clic su ANALYZE AGAINcliccando.

Per risolvere questo problema, abbiamo spostato il pulsante Save buttonaccanto ai pulsanti ANALYZE AGAIN buttone Back e button. Il pulsante ANALYZE AGAIN buttonè disabilitato e il pulsante Save e buttonè abilitato quando un utente scrive una nuova riga di ambito. Il pulsante ANALYZE AGAIN viene riattivato e il pulsante Save viene disabilitato quando l'utente salva il nuovo ambito. Questi due pulsanti non saranno mai abilitati contemporaneamente in axe Expert Extension.

Elimina una definizione di ambito

Eliminare una definizione di ambito per rimuovere una riga dalla Scope tabella delle sezioni nel Settings pannello. Questa azione rimuove anche la definizione dell'ambito da axe Monitor.

Nella colonna Actions , nella riga della definizione di ambito che vuoi eliminare, seleziona Delete.

La riga viene rimossa dalla tabella della sezione Definizioni di ambito.