Axe DevTools Linter gebruiken met Jenkins

Je kunt je code indienen bij Axe DevTools Linter om te laten controleren op toegankelijkheidsproblemen als onderdeel van een Jenkins-build. Deze gids laat zien hoe je een buildstap in Jenkins instelt om Axe DevTools Linter Connector aan te roepen en Jenkins te rapporteren over eventuele gevonden toegankelijkheidsfouten.

Vereisten

Om Axe DevTools Linter toe te voegen aan Jenkins-builds, moet je de volgende software geïnstalleerd hebben:

• Jenkins. Zie Jenkins installeren voor instructies over het instellen van Jenkins.
• Axe DevTools Linter en Connector. Zie De lokale server instellen of Installeren met Docker, en Axe DevTools Linter Connector gebruiken voor installatie-instructies.
• Het axe-linter-jenkins-sonarqube.sh buildscript. Instructies voor het installeren van dit script staan in de volgende sectie.

Het Jenkins-bouwscript installeren

De broncode voor het Jenkins-buildscript is te vinden in de sectie Het Build Script hieronder. Maak een bestand genaamd axe-linter-jenkins-sonarqube.sh door de broncode uit die sectie te kopiëren.

Bewerk het script om de correcte URL en poort van je Axe DevTools Linter-instance (zowel SaaS als on-premises) aan te geven. Er zijn twee omgevingsvariabelen in het script op regels 12 en 13 die je mogelijk moet aanpassen, zoals hieronder weergegeven:

export AXE_LINTER_SERVER_URL=http://localhost
export AXE_LINTER_SERVER_PORT=3000

Maak nu een directory aan in /opt met het beheerdersaccount door de volgende opdracht te gebruiken:

sudo mkdir /opt/axeScripts

Kopieer het script naar /opt/axeScripts:

sudo cp axe-linter-jenkins-sonarqube.sh /opt/axeScripts

Stel de uitvoeringsvlag van het script in:

sudo chmod +x /opt/axeScripts/axe-linter-jenkins-sonarqube.sh

Een bouwstap toevoegen

Voor dit voorbeeld gebruik je een bestaand project en voeg je eenvoudig een nieuwe bouwstap toe.

Kies de taak die je wilt aanpassen en kies Configureren in het linker paneel. Selecteer vervolgens het Bouwen tabblad om naar de Bouwsectie te scrollen, waar je het Bouwstap toevoegen dropdownmenu kiest en Shell uitvoeren selecteert.

Voer in de nieuwe Shell uitvoeren-buildstap het volgende in het Opdracht tekstvak in:

/opt/axeScripts/axe-linter-jenkins-sonarqube.sh

Selecteer de Geavanceerd... knop bij deze buildstap om de exitcode in te stellen die een fout aangeeft voor Jenkins. Voer 1 in het Exitcode om build instabiel te maken tekstvak in. Het script geeft 1 terug als er toegankelijkheidsfouten zijn.

Kies Opslaan of Toepassen om je wijzigingen te accepteren.

Het Build Script

Het axe-linter-jenkins-sonarqube.sh script voert Axe DevTools Linter Connector uit over de bestanden in de hoofdmap van de Jenkins-build en genereert een rapport, axe-linter-report.json. Het script zoekt vervolgens in het rapport naar fouten en rapporteert de fout door 1 terug te geven, wat ervoor zorgt dat de build gemarkeerd wordt als onstabiel in Jenkins.

De broncode voor het buildscript wordt hieronder weergegeven:

#!/bin/bash
# axe-linter-jenkins-sonarqube.sh
# This script will setup the environment variables needed for axe-linter-connector
# and execute axe-linter-connector. The output file will be reviewed and call back with exit codes:
## 0 - No Accessibility Defects
## 1 - Axe DevTools Linter Detected Accessibility Defects
## 2 - Execution problem, or Axe DevTools Linter unavailable.

echo "Axe DevTools Linter Jenkins SonarQube Starting $(date)"

# Setup variables for Axe DevTools Linter
export AXE_LINTER_SERVER_URL=http://localhost
export AXE_LINTER_SERVER_PORT=3000

# Configure outfile: output in Generic Issue Import Format for SonarQube in execution directory.

OutFile="axe-linter-report.json"

# Remove previous results
rm $OutFile

# execute axe-linter-connector
axe-linter-connector -s . -d .

echo "Checking for Results $(date)"

if [ ! -f "$OutFile" ];
   then
     echo "$OutFile Does Not Exit"
     exit 2

   elif cat "$OutFile" | grep -q "BUG"; then
      echo "Axe DevTools Linter Accessibility Defect Detected"
      exit 1
   else
     echo "No Axe DevTools Linter Bugs Detected"
fi
exit 0

Het resultaat van dit script is een eenvoudige pass/fail, afhankelijk van of er toegankelijkheidsfouten worden gevonden door Axe DevTools Linter. Er wordt geen andere informatie naar Jenkins verzonden. Het gegenereerde rapport, axe-linter-report.json bevat echter wel specifiekere informatie over toegankelijkheidsfouten: bestandsnaam, regelnummer en informatie over de fout. Een manier om deze informatie vast te leggen is door het rapport te importeren in SonarQube. Zie Axe DevTools Linter gebruiken met SonarQube voor meer informatie.