Importeren en Initialiseren voor WebdriverIO

Zodra je Axe DevTools voor Web hebt geïnstalleerd, moet je het in je testopstelling importeren en het pakket initialiseren.

Vereisten

Om Axe DevTools voor Web te importeren en te initialiseren, moet het eerst geïnstalleerd zijn. Als je dat nog niet hebt gedaan, lees dan de handleiding over hoe je het kunt installeren van een bundel, vanuit je artefactrepository, of van Deque's Agora. Je moet ook WebdriverIO gedownload en geconfigureerd hebben.

Importeren en Initialiseren

Importeer zowel Axe DevTools voor Web als WebdriverIO. De syntax hangt af van de taal en het modulesysteem dat je project gebruikt. Kies degene die bij je project past:

JavaScript met CommonJS-modules

Dit is de standaard voor een Node.js-project zonder "type": "module" in zijn package.json.

const { AxeDevToolsWebdriverIO } = require('@axe-devtools/webdriverio');
const webdriverio = require('webdriverio');

JavaScript met ES-modules

Gebruik deze syntax in een project met "type": "module" in zijn package.json, of in .mjs bestanden.

import { AxeDevToolsWebdriverIO } from '@axe-devtools/webdriverio';
import { remote } from 'webdriverio';

TypeScript

TypeScript gebruikt dezelfde import syntax als ES-modules. @axe-devtools/webdriverio levert zijn eigen typedeclaraties, dus er is geen apart @types/ pakket om te installeren. Scanresultaten worden getypeerd als AxeResults, die door axe-core worden geëxporteerd:

import { AxeDevToolsWebdriverIO } from '@axe-devtools/webdriverio';
import { remote } from 'webdriverio';
import type { AxeResults } from 'axe-core';

De Client Initialiseren

Op dit punt kun je je webdriver initialiseren binnen je testfunctie. In JavaScript:

const client = await webdriverio.remote({
  capabilities: {
    browserName: 'chrome'
  }
});

In TypeScript is de client een WebdriverIO.Browser, wat het type is dat AxeDevToolsWebdriverIO verwacht:

const client: WebdriverIO.Browser = await remote({
  capabilities: {
    browserName: 'chrome'
  }
});

Vervolgens kun je Axe DevTools voor Web initialiseren met de webdriver-client. Deze instructie is hetzelfde in beide talen:

const axeDevTools = new AxeDevToolsWebdriverIO({ client });

Volgende Stappen

Zodra je Axe DevTools voor Web en zijn driver hebt geïnstalleerd, geïmporteerd en geïnitieerd, ben je klaar om door te gaan met het scannen op toegankelijkheid en het schrijven van toegankelijkheidstests. Elke scan met Axe DevTools voor Web vereist een nieuwe instantie, dus om je scans op te zetten en uit te voeren, zie de handleiding over testen schrijven.

Problemen Oplossen

Als je problemen hebt met het importeren of initialiseren van Axe DevTools voor Web, neem dan direct contact op met je Deque-vertegenwoordiger, bereik ons via onze ondersteuningsdesk, of stuur ons een e-mail. We helpen je graag.