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
Not for use with personal data

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

Questa gemma si basa su passaggi forniti dalla gemma axe-core-rspec.

Configurazione e utilizzo

Assicurati di avere accesso al [registro di Deque][configurazione del registro npm di attest]. In caso contrario, fare riferimento alla documentazione di installazione.

Per impostare la gemma RSpec, seguire questi passaggi:

  • Aggiungi [informazione mancante] axe-devtools-rspec al tuo file Gemfile o gemspec ed eseguilo [informazione mancante] bundle install.
gem "axe-devtools-rspec"
spec.add_dependency "axe-devtools-rspec"
  • Require [informazione mancante] axe-rspec, che si estende [informazione mancante] RSpec con matcher personalizzati. L'ideale sarebbe specificarlo nel file spec/spec_helper.rb.
require 'axe-rspec'
  • Utilizza la gemma con il [WebDriver][axe DevTools] che preferisci.

API

Matcher - Essere axe Clean (be_axe_clean)

Per costruire un controllo RSpec di accessibilità axe, iniziare con expect(page).to be_axe_clean e aggiungere tutte le clausole necessarie. (L'oggetto page proviene dal WebDriver scelto.)

Matcher - Essere verificato per l'accessibilità (be_audited_for_accessibility)

Per costruire un controllo RSpec di accessibilità axe, iniziare con expect(page).to be_audited_for_accessibility e aggiungere tutte le clausole concatenabili necessarie.

expect(page).to be_audited_for_accessibility

Clausole

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

within- Clausola di inclusione

La clausola within specifica quali elementi della pagina devono essere controllati. È necessario fornire un selettore CSS valido. La clausola within accetta un singolo selettore, un array di selettori o un hash che descrive gli iframe con selettori.

Per ulteriori informazioni, vedere la [documentazione del parametro context][context-param].

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 escludendo specifica quali elementi del documento devono essere ignorati. È necessario fornire un selettore CSS valido. La clausola che esclude accetta un singolo selettore, un array di selettori o un hash che descrive gli iframe con selettori.

Per ulteriori informazioni, vedere la [documentazione del parametro context][context-param].

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 secondo specifica quale standard (o standard) di accessibilità devono essere utilizzati per controllare la pagina. Gli standard di accessibilità sono specificati per nome. La clausola secondo accetta un singolo tag o un array di tag.

Sono documentati [i nomi dei tag accettabili][options-param] nonché un [elenco completo delle regole][rules] che corrispondono 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 di controllo delle regole

La clausola checking specifica quali _regole aggiuntive _ 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, consultare la documentazione delle regole per un elenco di ID delle regole validi.

# 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_verifica specifica quali regole controllare in modo esclusivo. Utilizzando questo strumento si escludono tutte le regole esterne all'elenco.

# 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 salto specifica quali regole saltare. Ciò consente di fornire uno standard di accessibilità (tramite la clausola tag) ignorando una regola particolare. Le regole sono specificate da ID regola separati da virgole.

Per ulteriori informazioni, consultare la documentazione delle regole per un elenco di ID delle regole validi.

# 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 - Essere verificato per l'accessibilità

Il matcher essere_verificato_per_accessibilità fornisce supporto per due clausole aggiuntive.

according_to_ruleset- Clausola del regolamento

La ruleset clause ** according_to_ruleset** consente di specificare un singolo ruleset ( ad esempio, 508, wcag2, wcag2.1 ) da utilizzare per controllare 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 del base matcher e delle clauses, richiamare 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 le clausole

Tutte le clausole descritte possono essere combinate e abbinate tramite concatenamento dei metodi. Di seguito 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)

Utilizzo avanzato dell'API

Fare riferimento a [utilizzo avanzato][] per vedere come configurare l'API per:

  • Regole personalizzate
  • Percorso personalizzato per la sorgente di axe
  • Registrazione dell'utilizzo
  • Rapporti

Is this page helpful?

Help us improve this page

Still need help?