Axe DevTools RSpec

This page is not available in the language you requested. You have been redirected to the English version of the page.
Link to this page copied to clipboard

Configurazione e utilizzo della gemma axe-devtools-rspec per i test di accessibilità basati su RSpec

Not for use with personal data

La gemma axe-devtools-rspec fornisce matcher personalizzati per valutare se una determinata pagina è axe pulita.

Questa gemma si estende oltre passaggi forniti dalla gemma axe-core-rspec.

Impostazione e utilizzo

Assicurati di avere accesso a Registro di Deque. In caso contrario, fai riferimento a documentazione di configurazione.

Per configurare la gemma RSpec, segui questi passaggi:

  • Aggiungi axe-devtools-rspec al tuo file Gemfile o gemspec ed esegui bundle install.
gem "axe-devtools-rspec"
spec.add_dependency "axe-devtools-rspec"
  • Richiedi axe-rspec, che estende RSpec con matcher personalizzati. Idealmente, questo dovrebbe essere specificato nel file spec/spec_helper.rb.
require 'axe-rspec'
  • Usa la gemma con il WebDriver di tua scelta.

API

Matcher - Essere Axe Clean (be_axe_clean)

Per costruire un controllo di accessibilità Axe con RSpec, inizia con expect(page).to be_axe_clean e aggiungi qualsiasi clausola necessaria. (L'oggetto page proviene dal WebDriver scelto.)

Matcher - Essere sottoposto ad audit per l'accessibilità (be_audited_for_accessibility)

Per costruire un controllo di accessibilità Axe con RSpec, inizia con expect(page).to be_audited_for_accessibility e aggiungi qualsiasi clausola concatenabile necessaria.

expect(page).to be_audited_for_accessibility

Clausole

Le clausole sono metodi concatenabili per il matcher personalizzato be_axe_clean. Clausole configurabili permettono una maggiore granularità nei test e nelle aspettative.

within- Clausola di inclusione

La clausola within specifica quali elementi della pagina devono essere controllati. Deve essere fornito un selettore CSS valido. La clausola within accetta un singolo selettore, un array di selettori, o un hash che descrive iframes con selettori.

Per ulteriori informazioni, vedere documentazione del parametro di contesto.

Esempi:

# Simple selector
expect(page).to be_axe_clean.within '#selector1'

# Compound selector
# Include all elements with the class 'selector2' inside the element with id 'selector1'
expect(page).to be_audited_for_accessibility.within '#selector1 .selector2'

# Multiple selectors
# Include the element with id 'selector1' *and* all elements with class 'selector2'
expect(page).to be_audited_for_accessibility.within '#selector1', '.selector2'

# IFrame selector
# Include the element with id 'selector1' inside the IFrame with id 'frame1'
expect(page).to be_axe_clean.within iframe: '#frame1', selector: '#selector1'

# Multiple IFrame selectors
# Include the element with id 'selector1' inside the IFrame with id 'frame1'
# Include the element with id 'selector2' inside the IFrame with id 'frame2'
expect(page).to be_audited_for_accessibility.within(
  {iframe: '#frame1', selector: '#selector1'},
  {iframe: '#frame2', selector: '#selector2'}
)

# Simple selectors *and* IFrame selector
# Include the element with id 'selector1' *and* all elements with class 'selector2'
# Include the element with id 'selector3' inside the IFrame with id 'frame'
expect(page).to be_audited_for_accessibility.within '#selector1', '.selector2', iframe: '#frame', selector: '#selector3'

# Nested IFrame selectors
# Include the element selector1 inside the IFrame with id 'frame2',
# inside the IFrame with id 'frame1'
expect(page).to be_axe_clean.within(iframe: '#frame1', selector:
  {iframe: '#frame2', selector: '#selector1'}
)
excluding- Clausola di esclusione

La clausola excluding specifica quali elementi del documento devono essere ignorati. Deve essere fornito un selettore CSS valido. La clausola excluding accetta un singolo selettore, un array di selettori, o un hash che descrive iframes con selettori.

Per ulteriori informazioni, vedere documentazione del parametro di contesto.

Esempi:

# Simple selector
expect(page).to be_audited_for_accessibility.excluding '#selector1'

# Compound selector
# Exclude all elements with the class 'selector2' inside the element with id 'selector1'
expect(page).to be_axe_clean.excluding '#selector1 .selector2'

# Multiple selectors
# Exclude the element with id 'selector1' *and* all elements with class 'selector2'
expect(page).to be_audited_for_accessibility.excluding '#selector1', '.selector2'

# IFrame selector
# Exclude the element with id 'selector1' inside the IFrame with id 'frame1'
expect(page).to be_axe_clean.excluding iframe: '#frame1', selector: '#selector1'

# Multiple IFrame selectors
# Exclude the element with id 'selector1' inside the IFrame with id 'frame1'
# Exclude the element with id 'selector2' inside the IFrame with id 'frame2'
expect(page).to be_axe_clean.excluding(
  {iframe: '#frame1', selector: '#selector1'},
  {iframe: '#frame2', selector: '#selector2'}
)

# Simple selectors with IFrame selector
# Exclude the element with id 'selector1' *and* all elements with class 'selector2'
# Exclude the element with id 'selector3' inside the IFrame with id 'frame'
expect(page).to be_audited_for_accessibility.excluding '#selector1', '.selector2', iframe: '#frame', selector: '#selector3'

# Nested IFrame selectors
# Exclude the element selector1 inside the IFrame with id 'frame2',
# inside the IFrame with id 'frame1'
expect(page).to be_axe_clean.excluding(iframe: '#frame1', selector:
  {iframe: '#frame2', selector: '#selector1'}
)
according_to- Clausola dello standard di accessibilità (Tag)

La clausola according_to specifica quale standard di accessibilità (o standard) deve essere utilizzato per controllare la pagina. Gli standard di accessibilità sono specificati per nome. La clausola according_to accetta un singolo tag, o un array di tag.

I i nomi dei tag sono documentati accettabili così come un elenco completo delle regole che corrisponde a ciascun tag.

# Single standard
expect(page).to be_audited_for_accessibility.according_to :wcag2a

# Multiple standards
expect(page).to be_axe_clean.according_to :wcag2a, :section508
checking- Clausola delle regole di verifica

La clausola checking specifica quali regole di aggiuntivo controllare oltre ai tag specificati (se presenti) o al set di regole predefinito. La clausola checking accetta una singola regola, o un array di regole.

Per ulteriori informazioni, vedere documentazione delle regole per un elenco di ID delle regole valide.

# Checking a single rule
expect(page).to be_axe_clean.checking :label

# Checking multiple rules
expect(page).to be_axe_clean.checking :label, :tabindex

# Example specifying an additional best practice rule in addition to all rules in the WCAG2A standard
expect(page).to be_audited_for_accessibility.according_to(:wcag2a).checking(:tabindex)
checking_only- Clausola delle regole esclusive

La clausola checking_only specifica quali regole controllare esclusivamente. Utilizzando questo matcher si escludono tutto regole al di fuori della lista.

# Checking a single rule
expect(page).to be_axe_clean.checking_only :label

# Checking multiple rules
expect(page).to be_audited_for_accessibility.checking_only :label, :tabindex
skipping- Clausola delle regole di salto

La clausola skipping specifica quali regole saltare. Ciò consente di fornire uno standard di accessibilità (tramite la clausola tag) ignorando però una particolare regola. Le regole sono specificate con ID delle regole separati da virgole.

Per ulteriori informazioni, vedere documentazione delle regole per un elenco di ID delle regole valide.

# Skipping a single rule
expect(page).to be_axe_clean.skipping :label

# Skipping multiple rules
expect(page).to be_audited_for_accessibility.skipping :label, :tabindex

# Example specifying an additional best practice rule in addition to all rules in the WCAG2A standard
expect(page).to be_axe_clean.according_to(:wcag2a).skipping(:label)
Clausole disponibili solo per matcher - Essere sottoposto ad audit per l'accessibilità

Il matcher be_audited_for_accessibility fornisce supporto per due clausole aggiuntive.

according_to_ruleset- Clausola del set di regole

La clausola del set di regole according_to_ruleset aiuta a specificare un singolo set di regole (ad esempio, 508, wcag2, wcag2.1) da utilizzare per verificare la pagina.

 expect(page)
      .to be_audited_for_accessibility
      .according_to_ruleset('wcag2.1')
logging_results- Clausola sui risultati di registrazione

Per registrare i risultati dal matcher base e dalle clausole, invocare il metodo concatenabile logging_results come mostrato di seguito.

expect(page)
  .to be_audited_for_accessibility
  .logging_results({
    output_directory: 'attest-results',
    test_machine: 'Jenkins CI Server',
    test_suite_name: 'Landing Page',
    ui_state: 'Page Load',
    user_agent: 'Headless Chrome'
  })
Interoperabilità tra clausole

Tutte le clausole descritte possono essere combinate e abbinate con concatenazione di metodi. Di seguito sono riportati alcuni esempi.

expect(page).to be_axe_clean.within('.main', '.header').excluding('.footer')

expect(page).to be_audited_for_accessibility.excluding('#sidebar').according_to(:wcag2a, :wcag2aa).skipping(:color-contrast)

expect(page).to be_axe_clean.within('.main').checking_only :document-title, :label

expect(page).to be_audited_for_accessibility.according_to(:best-practice).checking(:aria-roles, :definition-list)

Uso avanzato dell'API

Fare riferimento a uso avanzato per vedere come configurare l'API per:

  • Regole personalizzate
  • Percorso personalizzato alla fonte di axe-core
  • Registrazione dell'uso
  • Reportistica

Is this page helpful?

Help us improve this page

Still need help?