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.

Configurazione e Utilizzo

Assicurati di avere accesso a Deque's registry. In caso contrario, fai riferimento a setup documentation.

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 - Be axe Clean (be_axe_clean)

Per costruire un controllo di accessibilità RSpec con axe, inizia con expect(page).to be_axe_clean e aggiungi eventuali clausole necessarie. (L'oggetto page proviene dal tuo WebDriver scelto.)

Matcher - Be Audited for Accessibility (be_audited_for_accessibility)

Per costruire un controllo di accessibilità RSpec con axe, inizia con expect(page).to be_audited_for_accessibility e aggiungi eventuali clausole concatenabili necessarie.

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 CSS selector valido. La clausola within accetta un singolo selettore, un array di selettori, o un hash che descrive iframes con selettori.

Per ulteriori informazioni, vedere context parameter documentation.

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 CSS selector valido. La clausola excluding accetta un singolo selettore, un array di selettori, o un hash che descrive iframes con selettori.

Per ulteriori informazioni, vedere context parameter documentation.

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 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 tag names are documented accettabili così come un complete listing of rules 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 Controllo

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

Per ulteriori informazioni, vedere rules documentation 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 solo_controllo 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 di Esclusione delle Regole

La clausola esclusione 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 rules documentation 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 il matcher - Be Audited for accessibility

Il matcher essere_verificato_per_accessibilità fornisce supporto per due clausole aggiuntive.

according_to_ruleset- Clausola del set di regole

La clausola del set di regole secondo_il_set_di_regole 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 di registrazione dei risultati

Per registrare i risultati dal matcher base e dalle clausole, invocare il metodo concatenabile registrazione_risultati 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 advanced usage per vedere come configurare l'API per:

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

Is this page helpful?

Help us improve this page

Still need help?