Intro

The @userway/a11y-playwright is an NPM package designed to help you perform accessibility testing on your web pages. With it you can easily run static page analysis on a webpage and get a detailed report of accessibility violations based on WCAG guidelines and ACT rules.

// playwright/e2e/my-test.spec.js
 
test('example test', async ({ page }) => {
  await page.goto('http://localhost:5000')
  await userwayAnalysis(page)
})

Prerequisites

Playwright version 1.16.0 or higher

Distribution

UserWay App Playwright is distributed as a zip-packaged NPM module and should be installed as an NPM dependency.

Installation

First, extract the provided userway-playwright-app.zip inside of a separate directory, like src/packages:

src
└── packages
   ├── userway-app-playwright.zip
   └── userway-app-playwright

Install userway-app-playwright with npm install:

npm install src/packages/userway-playwright-app

This adds @userway/a11y-playwright to the dependencies in package.json.

Setup

UserWay App Playwright external package and needs to be imported in playwright test.

Import @userway/a11y-playwright to your Playwright’s test file and call userwayAnalysis function:

const { userwayAnalysis } = require('@userway/a11y-playwright')
 
test('example test', async ({ page }) => {
  await page.goto('http://localhost:5000')
  await userwayAnalysis(page)
})

Types

If you are using TypeScript, add @userway/a11y-playwright to types section in your tsconfig.json:

{
  "compilerOptions": {
    "types": ["playwright", "@userway/a11y-playwright"]
  }
}

If you are not using TypeScript, you can still have autocompletion available by adding type references to your tests:

/// <reference types="playwright" />
/// <reference types="@userway/a11y-playwright" />
 
// ↑ Add this at the top of your test