De Axe Developer Hub GitHub Action gebruiken

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

Controleer automatisch PR's en commits op toegankelijkheidsgebreken

Not for use with personal data

Vereist:

Een webproject met Axe Watcher integratie

Axe Developer Hub Project ID

Axe Developer Hub API-sleutel

Een testsuite die je hebt aangepast volgens de setup-instructies in Axe Developer Hub

Een GitHub-workflow die je testsuite uitvoert wanneer iemand commit naar je repository

note

Voor andere CI/CD-pijplijnen (zoals die op GitLab, Bitbucket of CircleCI) of bij gebruik van Axe DevTools voor Web API's/CLI, kun je de Axe Developer Hub REST-service gebruiken als basis voor je eigen integratie.

Overzicht

De Axe Developer Hub GitHub Action stelt je in staat om GitHub-workflows op te zetten voor webprojecten die Axe Watcher integreren, om commits en pull requests te blokkeren als ze toegankelijkheidsfouten bevatten.

Wanneer je aangepaste testsuite draait, worden toegankelijkheidsresultaten geassocieerd met een Git commit SHA en die informatie wordt naar de servers van Deque gestuurd. De GitHub-acties worden uitgevoerd na het draaien van je testsuite, en ze vragen de servers van Deque op de toegankelijkheidsresultaten geassocieerd met de laatste commit SHA van de huidige branch.

Setup

Creeër een Omgevingsvariabele voor je Project ID - We raden aan om je project-ID op te slaan in een omgevingsvariabele of andere GitHub-variabele. Voor dit voorbeeld slaan we het project-ID op als een omgevingsvariabele genaamd PROJECT_ID.
Creeër een Geheim voor je API-sleutel - Voor dit voorbeeld is het gecreëerde geheim genaamd AXE_DEV_HUB_API_KEY, met je persoonlijke API-sleutel als waarde, maar je kunt het geheim noemen zoals je wilt. Het moet met dezelfde naam worden genoemd in de workflow-taak.
Voeg Toegankelijkheidscontroles toe aan je Testsuite - Zorg ervoor dat je de stappen in projectsetup hebt voltooid om toegankelijkheidscontroles te integreren in de testsuite die wordt gebruikt in je (Axe Watcher) CI/CD-pijplijn.
Wijzig je Huidige Workflow - Je moet je huidige test runner workflow wijzigen in .github/workflows en de GitHub-acties toevoegen na de taak die je testsuite uitvoert.

Voorbeeld Taak

De taak na je testsuite-actie zou de Axe Developer Hub GitHub-actie moeten uitvoeren. Raadpleeg het volgende voorbeeld:

jobs:

# ...
# your-CI-test
# ...

# Add the following new job:
# Be sure to replace <choose_latest_tag> with the appropriate version tag
  axe-dev-hub:
    runs-on: ubuntu-latest
    needs: your-CI-test
    steps:
      - uses: actions/checkout@v5
      - uses: dequelabs/axe-devhub-action@<choose_latest_tag>
        with:
          api_key: ${{ secrets.axe_DEV_HUB_API_KEY }}
          project_id: ${{ env.PROJECT_ID }}

De axe-dev-hub taak in het voorbeeld hangt af van de taak die je testsuite uitvoert, gespecificeerd met de needs: your-CI-test regel. Zorg ervoor dat je deze regel bijwerkt om overeen te komen met de naam van de taak die je testsuite uitvoert.

Je kunt meerdere invoerparameters gebruiken voor de GitHub-actie. Bijvoorbeeld, je kunt de a11y-drempel inschakelen door enable_a11y_threshold: true. Een volledige lijst van invoerparameters is te vinden in de Axe Developer Hub GitHub-actie README.

note

U hoeft de server_url parameter niet in te stellen als u uw project hebt aangemaakt op axe.deque.com. Als uw organisatie een regionale instantie, private cloud of een on-premises implementatie van Axe Developer Hub gebruikt, moet u server_url instellen op de basis-URL van die instantie (bijvoorbeeld, https://axe-eu.deque.com).

Resultaten

De GitHub-actie stelt verschillende uitvoerparameters in, waaronder een telling van gedetecteerde toegankelijkheidsproblemen, opgeloste problemen, en problemen die de a11y-drempel overschrijden.

Als u de a11y-drempel niet heeft ingeschakeld, zal de GitHub-actie falen zodra er meer dan nul toegankelijkheidsfouten aanwezig zijn. Als deze is ingeschakeld, zullen alleen schendingen die de a11y-drempel overschrijden de GitHub-actie laten falen. Leer meer over het gebruik van de a11y-drempel om Axe Developer Hub aan te passen aan hetgeen uw organisatie wil prioriteren.

Bij een mislukking van de GitHub-actie wordt een bericht vergelijkbaar met het onderstaande aan uw pull-aanvraag toegevoegd en kan dit het samenvoegen blokkeren.

Klik op de link in het pull-aanvraagcommentaar om toegangsdefectinformatie voor die commit in Axe Developer Hub te bekijken.

Probleemoplossing

U kunt een foutmelding ontvangen zoals de volgende:

Error: Resource not accessible by integration

Controleer of u de nodige permissies heeft op de instellingenpagina voor acties. U heeft lees- en schrijfpermissies nodig om de actie toe te staan opmerkingen toe te voegen aan pull-aanvragen. Voor meer granulariteit kunt u ervoor kiezen om een andere GITHUB_TOKEN te gebruiken voor de GitHub-actie. Voeg deze waarde toe aan de github_token invoerparameter.

Voorbeeldworkflow

Als u nog geen workflow heeft die uw testsuite uitvoert, kunt u de voorbeeldworkflow gebruiken als uitgangspunt om uw eigen testrunner te maken.

De voorbeeldworkflow heet Tests (tests.yml) en wordt uitgevoerd bij elke commit of pull-aanvraag. De taak die de gewijzigde testsuite uitvoert, cypress, laat zien hoe een Cypress-testsuite wordt uitgevoerd. De volgende taak in het voorbeeld, axe-dev-hub, is een aanroep van de Axe Developer Hub GitHub-actie.

Uw testsuitetaak moet altijd worden uitgevoerd voordat de Axe Developer Hub GitHub-actie.

tip

De voorbeeldmap bevat een compleet testproject waarmee u kunt experimenteren.

Referenties

Hoofdrepository voor de Axe Developer Hub GitHub-actie
- De README bevat informatie over de invoer- en uitvoerparameters
- Zoek metadata voor de GitHub-actie in action.yml
- Controleer de voorbeeld aanroep in de GitHub-actierepo periodiek voor de nieuwste taakconfiguratie
Vind meer informatie over onderwerpen op deze pagina in de documentatie van GitHub