Scelta di un'integrazione Node.js
Come scegliere il pacchetto Axe DevTools for Web adatto al tipo di test che stai scrivendo
Axe DevTools for Web offre diversi pacchetti Node.js e JavaScript. Eseguono tutti le stesse regole di accessibilità e producono lo stesso tipo di risultati. La differenza sta in ciò che viene scansionato, che dipende dal tipo di test che stai scrivendo:
- Rendi il markup nel test e vuoi scansionarlo, come in un test di componente o unità. Usa
@axe-devtools/browser. - Il tuo test porta un browser su una pagina e vuoi scansionare quella pagina, come in un test end-to-end. Usa il pacchetto per lo strumento che già guida il tuo browser.
Se sai già quale pacchetto ti serve, vai a Opzioni di installazione.
Scansione del markup reso dal tuo test
Il pacchetto @axe-devtools/browser è una libreria JavaScript caricata nella pagina su cui i tuoi test operano. Lo inizializzi una volta, poi passi AxeDevTools.run() un elemento DOM da scansionare. Poiché accetta un elemento anziché una sessione del browser, è adatto a runner di test che rendono il proprio markup, come Jasmine, Karma, o una libreria di test che gira sotto Jest.
Nonostante il nome, @axe-devtools/browser non è uno strumento interattivo o un'estensione del browser. Viene eseguito all'interno di test automatizzati allo stesso modo degli altri pacchetti.
Karma
Karma non è un'integrazione separata. Scrivi i test con @axe-devtools/browser, e aggiungi @axe-devtools/karma-json-reporter come plugin di Karma. Il reporter scrive un file JSON per ogni scansione registrata, e @axe-devtools/cli trasforma quei file in report dopo l'esecuzione del test.
Scansione delle pagine navigate dal tuo test
Se la tua suite di test apre pagine in un browser, scegli il pacchetto che corrisponde allo strumento che già guida quel browser. Ognuno aggiunge la scansione dell'accessibilità alla sessione che i tuoi test già utilizzano, quindi non è necessario modificare il modo in cui i tuoi test avviano il browser o raggiungono la pagina.
| I tuoi test utilizzano | Pacchetto | Guida |
|---|---|---|
| Playwright | @axe-devtools/playwright |
Playwright |
| Puppeteer | @axe-devtools/puppeteer |
Puppeteer |
| WebdriverIO | @axe-devtools/webdriverio |
WebdriverIO |
WebDriverJS (selenium-webdriver) |
@axe-devtools/webdriverjs |
WebDriverJS |
| Cypress | @axe-devtools/cypress |
Cypress |
Cypress è configurato in modo diverso dagli altri. Invece di creare un oggetto Axe DevTools intorno a un driver, registri un plugin in cypress.config.js e importi il pacchetto nel tuo file di supporto, che aggiunge comandi Axe DevTools a cy.
Cucumber
Anche Cucumber non è un'integrazione separata. Configura prima WebDriverJS, WebdriverIO, o Puppeteer, poi definisci passaggi Gherkin riutilizzabili che lo chiamano.
Reportistica, registrazione e Axe Developer Hub
Questi pacchetti funzionano insieme a qualsiasi delle integrazioni sopra, anziché sostituirne una:
- Node Reporter (
@axe-devtools/reporter) genera report dai tuoi risultati salvati. - Node Logger (
@axe-devtools/logger) registra i risultati dell'accessibilità mentre i tuoi test sono in esecuzione. - Caricamento dei tuoi risultati su Axe Developer Hub spiega come inviare risultati ad Axe Developer Hub.
Non sei ancora sicuro
Se nessuno di questi corrisponde a come funzionano i tuoi test, contatta il tuo rappresentante Deque o chiedi tramite il nostro servizio di supporto.
