Automated accessibility tests right inside the pipeline.
axe-core is the leading open-source engine for automated accessibility testing and plugs straight into our development pipeline. It analyses the rendered DOM against the WCAG rules and is deliberately built to produce no false positives. That way it catches a large share of typical problems early and automatically, from missing alternative texts to insufficient contrast. Our manual checks take care of the rest, because automation, in our experience, only reaches a portion of all criteria.
More in the documentationWe wire axe-core into CI and into our component tests so that every pull request is checked against the rules automatically. That way a broken label or a too weak contrast does not slip into production but shows up in the build right away. It keeps accessibility a stable steady state instead of something established once and slowly lost again.
import { render } from "@testing-library/react";
import { axe, toHaveNoViolations } from "jest-axe";
expect.extend(toHaveNoViolations);
test("button has no a11y violations", async () => {
const { container } = render(<button type="button">Senden</button>);
expect(await axe(container)).toHaveNoViolations();
});Good to know
axe only finds what can be proven by machine, roughly a third of the WCAG criteria. A green axe run therefore never means accessible, only no obvious machine-detectable errors. We still test keyboard and screen reader by hand.
More tools we work with in the same area.
You don't have to decide that, it's our job. Tell us about your plans.