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

Das axe-devtools-rspec Gem bietet benutzerdefinierte Matcher, um zu bewerten, ob eine bestimmte Seite axe sauber ist.

Dieses Gem erweitert die oben bereitgestellten Schritte des Gems „axe-core-rspec“(https://github.com/dequelabs/axe-core-gems/tree/develop/packages/axe-core-rspec#axe-core-rspec).

Einrichtung und Nutzung

Stellen Sie sicher, dass Sie Zugriff auf [Deque's Register][Attest NPM-Register Setup] haben. Wenn nicht, lesen Sie die Setup-Dokumentation.

Um das RSpec-Gem einzurichten, folgen Sie diesen Schritten:

– Fügen Sie axe-devtools-rspec zu Ihrer Gemfile- oder Gemspec-Datei hinzu und führen Sie es aus bundle install aus.

gem "axe-devtools-rspec"
spec.add_dependency "axe-devtools-rspec"
  • Require axe-rspec, das RSpec mit benutzerdefinierten Matchern erweitert wird. Idealerweise wäre dies in der Datei angegeben spec/spec_helper.rb.
require 'axe-rspec'
  • Verwenden Sie das Gem mit dem WebDriver Ihrer Wahl.

API

Matcher – Be axe Clean (be_axe_clean)

Um eine axe accessibility RSpec-Prüfung zu erstellen, beginnen Sie mit expect(page).to be_axe_clean und hängen Sie alle erforderlichen Klauseln an. (Das page Objekt stammt von Ihrem ausgewählten WebDriver.)

Matcher – Auf Barrierefreiheit geprüft sein (be_audited_for_accessibility)

Um eine axe accessibility RSpec-Prüfung zu erstellen, beginnen Sie mit expect(page).to be_audited_for_accessibility und hängen Sie alle erforderlichen verkettbaren Klauseln an.

expect(page).to be_audited_for_accessibility

Klauseln

Klauseln sind verkettbare Methoden für den be_axe_clean benutzerdefinierten Matcher. Konfigurierbare Klauseln ermöglichen eine größere Granularität bei Tests und Erwartungen.

within- Einschlussklausel

Die within -Klausel gibt an, welche Elemente der Seite überprüft werden sollen. Es muss ein gültiger CSS-Selektor angegeben werden. Die within -Klausel akzeptiert einen einzelnen Selektor, ein Array von Selektoren oder einen Hash, der Iframes mit Selektoren beschreibt.

Weitere Informationen finden Sie in der Kontextparameterdokumentation.

Beispiele:

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

Die excluding -Klausel gibt an, welche Elemente des Dokuments ignoriert werden sollen. Es muss ein gültiger CSS-Selektor angegeben werden. Die ausschließende -Klausel akzeptiert einen einzelnen Selektor, ein Array von Selektoren oder einen Hash, der Iframes mit Selektoren beschreibt.

Weitere Informationen finden Sie in der Kontextparameterdokumentation.

Beispiele:

# 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- Accessibility Standard (Tag)-Klausel

Die gemäß -Klausel gibt an, welcher Barrierefreiheitsstandard (oder welche Barrierefreiheitsstandards) zur Überprüfung der Seite verwendet werden soll. Die Zugänglichkeitsstandards werden namentlich angegeben. Die Klausel gemäß akzeptiert ein einzelnes Tag oder ein Array von Tags.

Die zulässigen Tag-Namen sind dokumentiert sowie eine vollständige Auflistung der Regeln, die jedem Tag entsprechen.

# 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- Klausel zur Überprüfung der Regeln

Die Prüfklausel gibt an, welche zusätzlichen Regeln zusätzlich zu den angegebenen Tags (sofern vorhanden) oder dem Standardregelsatz geprüft werden sollen. Die Prüfklausel akzeptiert eine einzelne Regel oder ein Array von Regeln.

Weitere Informationen finden Sie in der Dokumentation der Regeln mit einer Liste gültiger Regel-IDs.

# 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- Ausschließlichkeitsklausel

Die nur_prüfen -Klausel gibt an, welche Regeln ausschließlich überprüft werden sollen. Durch die Verwendung dieses Matchers werden alle Regeln außerhalb der Liste ausgeschlossen.

# 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- Regelübersprungsklausel

Die überspringen-Klausel gibt an, welche Regeln übersprungen werden sollen. Dadurch kann ein Zugänglichkeitsstandard bereitgestellt werden (über die Tag-Klausel), während eine bestimmte Regel ignoriert wird. Die Regeln werden durch Komma-getrennte Regel-IDs angegeben.

Weitere Informationen finden Sie in der Dokumentation der Regeln mit einer Liste gültiger Regel-IDs.

# 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)
Klauseln, die nur für Matcher verfügbar sind – auf Zugänglichkeit geprüft werden

Der für_Zugänglichkeit_geprüft_werden Matcher bietet Unterstützung für zwei zusätzliche Klauseln.

according_to_ruleset- Regelsatzklausel

Mit der Klausel des Regelsatzes entsprechend_dem_Regelsatz lässt sich ein einzelner Regelsatz (z. B. 508, wcag2, wcag2.1) angeben, der zum Überprüfen der Seite verwendet werden soll.

 expect(page)
      .to be_audited_for_accessibility
      .according_to_ruleset('wcag2.1')
logging_results- Klausel zur Protokollierung von Ergebnissen

Um Ergebnisse aus dem Basis-Matcher und den Klauseln zu protokollieren, rufen Sie die verkettbare Methode logging_results auf, wie unten gezeigt.

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ät zwischen Klauseln

Alle beschriebenen Klauseln können mit Methodenverkettung kombiniert und abgestimmt werden. Nachfolgend finden Sie einige Beispiele.

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)

Erweiterte API-Nutzung

Unter Erweiterte Nutzung erfahren Sie, wie Sie die API für Folgendes konfigurieren:

  • Benutzerdefinierte Regeln
  • Benutzerdefinierter Pfad zur axe-Quelle
  • Nutzungsaufzeichnung
  • Berichterstattung

Is this page helpful?

Help us improve this page

Still need help?