Getting started

Prerequisites

Before you start using the Accessibility Code Checker, ensure that you have a working browser automation testing setup. The Accessibility Code Checker has been tested on several common frameworks, but it should be possible to use it in any tool that renders a page in a browser. We currently provide guides for the following frameworks:

Playwright
Puppeteer
Selenium
Cypress

Module system

Alfa, the rules engine of the Accessibility Code Checker, is distributed as ESM (ECMAScript Modules). Therefore, projects using the old CJS (CommonJS) format (using require) for modules won't be able to use it directly. There are essentially four ways to handle this:

Switch the entire project to ESM. This is likely the most future-proof solution, but it requires most upfront work. Therefore it might not be the best solution for all projects, but it is probably a good solution for new projects. Check this quick overview of the required steps to get an idea of the necessary work.
Use dynamic import(), by replacing all instances of
```
import { Foo } from "@siteimprove/alfa-foo";
```
with
```
const { Foo } = await import("@siteimprove/alfa-foo");
```
and moving them inside the async function that also calls Alfa. This is a quick solution but might be cumbersome to maintain.
Use ESM files for the part of the project that uses Alfa. This can be done easily by using the .mts or .mjs extension on the files. It is a relatively quick solution but implies that the part of the project using Alfa will be isolated from the rest.
Use an ESM-for-CJS loader such as the esm package. This solution has not been tested, but it should work.

Previous: Introduction Next: Installation