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 register. Zo niet, raadpleeg dan de installatiedocumentatie.

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-toegankelijkheid RSpec-controle te construeren, begin met expect(page).to be_axe_clean en voeg alle nodige clausules toe. (Het page object komt van de door jou gekozen WebDriver.)

Matcher - Wees Gecontroleerd op Toegankelijkheid (be_audited_for_accessibility)

Om een Axe-toegankelijkheid RSpec-controle te construeren, begin met expect(page).to be_audited_for_accessibility en voeg alle nodige koppelbare 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 within clausule specificeert welke elementen van de pagina gecontroleerd moeten worden. Een geldige CSS-selector moet worden verstrekt. De within clausule accepteert een enkele selector, een reeks van selectors of een hash die iframes met selectors beschrijft.

Voor meer informatie, zie de contextparameterdocumentatie.

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 excluding clausule specificeert welke elementen van het document moeten worden genegeerd. Een geldige CSS-selector moet worden verstrekt. De excluding clausule accepteert een enkele selector, een reeks van selectors of een hash die iframes met selectors beschrijft.

Voor meer informatie, zie de contextparameterdocumentatie.

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

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

De acceptabele tagnamen zijn gedocumenteerd evenals een volledige lijst van regels 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- Controleregels clausule

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

Voor meer informatie, zie de regelsdocumentatie 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 checking_only 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 skipping 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 regelsdocumentatie 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 alleen beschikbaar voor matcher - Wees Gecontroleerd op toegankelijkheid

De be_audited_for_accessibility matcher biedt ondersteuning voor twee extra clausules.

according_to_ruleset- Regelset clausule

De regelsatzclausule according_to_ruleset 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 logging_results 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 geavanceerd gebruik om te zien hoe de API kan worden geconfigureerd voor:

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

Is this page helpful?

Help us improve this page

Still need help?