Instructies voor WebDriverJS en TypeScript

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

Uw tests configureren met WebDriverJS en TypeScript

Not for use with personal data

important

Axe Watcher vereist een ondersteunde browser die al op uw systeem is geïnstalleerd: Chrome for Testing (een aparte browserinstallatie, anders dan Google Chrome), Chromium of Microsoft Edge. Google Chrome, versie 139 of later, wordt niet ondersteund. Zie Browsers instellen en configureren voor gebruik met Axe Watcher voor installatie- en configuratie-instructies.

Installeer in de hoofdmap van je testmap het @axe-core/watcher-pakket en al zijn afhankelijkheden met npm of je voorkeurspakketbeheerder (bijvoorbeeld yarn of pnpm).
```
npm install --save-dev @axe-core/watcher
```
Importeer in uw testbestand of -bestanden de webdriverConfig() functie, de wrapWebdriver() functie en de WebdriverController klasse van @axe-core/watcher/webdriver:
```
import {
  webdriverConfig,
  wrapWebdriver,
  WebdriverController
} from '@axe-core/watcher/webdriver'
```
Werk uw testconfiguratiecode bij (meestal in een before of beforeAll blok), en specificeer Chrome-opties bij het instantiëren van uw browser instantie, met vermelding van uw API-sleutel:
```
// Original code:
const browser = await new Builder()
  .forBrowser('chrome')
  .build()

// Becomes:
const ACCESSIBILITY_API_KEY = process.env.ACCESSIBILITY_API_KEY
const PROJECT_ID = process.env.PROJECT_ID
const SERVER_URL = process.env.SERVER_URL

const browser = await new Builder()
  .forBrowser('chrome')
  .setChromeOptions(
    webdriverConfig({
      axe: {
        apiKey: ACCESSIBILITY_API_KEY,
        projectId: PROJECT_ID,
        serverURL: SERVER_URL
      }
    }
  )
  .build()
```
Zorg ervoor dat je ACCESSIBILITY_API_KEY en PROJECT_ID in je omgeving instelt op je persoonlijke API-sleutel (te vinden in je Axe-account, tabblad **API-SLEUTELS**) en je project-ID (weergegeven bovenaan deze instructies toen je je project maakte of beschikbaar van de Projecten-pagina door **Project configureren** te kiezen onder **Instellingen**). Als je organisatie een regionale, private cloud of on-premises Axe Developer Hub-instantie gebruikt, stel dan ook SERVER_URL in op de basis-URL van die instantie (bijvoorbeeld, https://axe-eu.deque.com); zo niet, laat dan SERVER_URL weg en zal de standaard https://axe.deque.com gebruikt worden.
Maak een instantie van de WebdriverController:
```
const controller = new WebdriverController(browser)
```
note

Als u schermopname maken (takeScreenshots: true) inschakelt, let dan op dat WebdriverController geen schermopname maken implementeert in @axe-core/watcher 4.6.0. Om schermafbeeldingen te maken, subclass u WebdriverController, overschrijf captureScreenshot() om Selenium's eigen takeScreenshot()-methode aan te roepen, en instantieert u uw subclass in plaats daarvan:
```
class ScreenshotWebdriverController extends WebdriverController {
  async captureScreenshot() {
    return await this.driver.takeScreenshot()
  }
}

const controller = new ScreenshotWebdriverController(browser)
```
Omhul uw browser instantie met de wrapWebdriver() functie:
```
browser = wrapWebdriver(browser, controller)
```
Zorg er ten slotte voor dat alle testresultaten van Axe Watcher zijn verwijderd. Voeg hiervoor het volgende codeblok toe aan je testafbreekcode (doorgaans in een afterEach-blok):
```
afterEach(async () => {
  await controller.flush()
})
```

Instructies voor WebDriverJS en TypeScript

Is this page helpful?

Help us improve this page

Still need help?