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

Installatie en gebruik van de axe-devtools-rspec gem voor op RSpec gebaseerde toegankelijkheidstests

Not for use with personal data

De axe-devtools-rspec gem biedt aangepaste matchers om te beoordelen of een gegeven pagina axe schoon is.

Deze gem breidt zich uit bovenop stappen geleverd door de axe-core-rspec gem.

Installatie en Gebruik

Zorg ervoor dat je toegang hebt tot Deque's registry. Zo niet, raadpleeg dan de setup documentation.

Om de RSpec gem op te zetten, volg je deze stappen:

  • Voeg axe-devtools-rspec toe aan je Gemfile of gemspec-bestand en voer bundle install uit.
gem "axe-devtools-rspec"
spec.add_dependency "axe-devtools-rspec"
  • Require axe-rspec, die RSpec uitbreidt met aangepaste matchers. Idealiter wordt dit gespecificeerd in het bestand spec/spec_helper.rb.
require 'axe-rspec'
  • Gebruik de gem met de WebDriver van jouw keuze.

API

Matcher - Wees Axe Schoon (be_axe_clean)

Om een axe toegankelijkheids-RSpec-check te construeren, begin je met expect(page).to be_axe_clean en voeg je eventuele benodigde clausules toe. (Het page object komt van jouw gekozen WebDriver.)

Matcher - Wordt Geauditeerd voor Toegankelijkheid (be_audited_for_accessibility)

Om een axe toegankelijkheids-RSpec-check te construeren, begin je met expect(page).to be_audited_for_accessibility en voeg je eventuele benodigde schakelbare clausules toe.

expect(page).to be_audited_for_accessibility

Clausules

Clausules zijn schakelbare methoden voor de be_axe_clean aangepaste matcher. Configureerbare clausules zorgen voor grotere detaillering met testen en verwachtingen.

within- Insluitingsclausule

De binnen clausule specificeert welke elementen van de pagina gecontroleerd moeten worden. Een geldige CSS selector moet worden verstrekt. De binnen clausule accepteert een enkele selector, een reeks van selectors of een hash die iframes met selectors beschrijft.

Voor meer informatie, zie de context parameter documentation.

Voorbeelden:

# 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- Uitsluitingsclausule

De uitsluiten clausule specificeert welke elementen van het document moeten worden genegeerd. Een geldige CSS selector moet worden verstrekt. De uitsluiten clausule accepteert een enkele selector, een reeks van selectors of een hash die iframes met selectors beschrijft.

Voor meer informatie, zie de context parameter documentation.

Voorbeelden:

# 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- Toegankelijkheidsnorm (Tag) clausule

De volgens clausule specificeert welke toegankelijkheidsnorm (of normen) gebruikt moet worden om de pagina te controleren. De toegankelijkheidsnormen worden bij naam gespecificeerd. De volgens clausule accepteert een enkele tag of een reeks van tags.

De acceptabele tag names are documented evenals een complete listing of rules die overeenkomen met elke 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- Controlerende Regels clausule

De controleren clausule specificeert welke extra regels moeten worden gecontroleerd naast de gespecificeerde tags (indien aanwezig) of de standaardregels. De controleren clausule accepteert een enkele regel of een reeks van regels.

Voor meer informatie, zie de rules documentation voor een lijst van geldige regel-ID's.

# 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- Exclusieve Regels clausule

De alleen_controleren clausule specificeert welke regels exclusief moeten worden gecontroleerd. Gebruik van deze matcher sluit alle regels uit buiten de lijst.

# 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- Regels Overslaan clausule

De overslaan clausule specificeert welke regels moeten worden overgeslagen. Dit maakt het mogelijk een toegankelijkheidsnorm te verstrekken (via de tag clausule) terwijl een specifieke regel wordt genegeerd. De regels worden gespecificeerd door kommagescheiden regel-ID's.

Voor meer informatie, zie de rules documentation voor een lijst van geldige regel-ID's.

# 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)
Clausules beschikbaar alleen voor matcher - Wordt Geauditeerd voor toegankelijkheid

De geauditeerd_voor_toegankelijkheid matcher biedt ondersteuning voor twee extra clausules.

according_to_ruleset- Regelsatzclausule

De regelsatzclausule volgens_regelsatz helpt bij het specificeren van een enkele regelsatz (bijvoorbeeld, 508, wcag2, wcag2.1) die gebruikt zal worden om de pagina te controleren.

 expect(page)
      .to be_audited_for_accessibility
      .according_to_ruleset('wcag2.1')
logging_results- Resultaten loggen clausule

Om resultaten van de basismatcher en clausules te loggen, roep de ketenbare methode resultaten_loggen aan zoals hieronder getoond.

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'
  })
Interoperabiliteit tussen clausules

Alle beschreven clausules kunnen worden gemengd en gekoppeld met methodechaining. Hieronder staan enkele voorbeelden.

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)

Geavanceerd API-gebruik

Raadpleeg advanced usage om te zien hoe de API kan worden geconfigureerd voor:

  • Aangepaste regels
  • Aangepast pad naar axe-bron
  • Gebruikregistratie
  • Rapportage