Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
38 changes: 38 additions & 0 deletions docs/ecosystem-accesslint-jest.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
---
id: ecosystem-accesslint-jest
title: accesslint/jest
---

[`@accesslint/jest`][gh] is a companion library for Testing Library that adds a
synchronous `toBeAccessible()` matcher for Jest, covering WCAG 2.2 Level A and
AA accessibility rules. Works under `jsdom` and `happy-dom`.

```bash npm2yarn
npm install --save-dev @accesslint/jest
```

Register the matcher once via `setupFilesAfterEnv` in your Jest config, then
assert on any rendered element:

```jsx
import { render } from '@testing-library/react'
import { LoginForm } from './LoginForm'

test('LoginForm is accessible', () => {
const { container } = render(<LoginForm />)
expect(container).toBeAccessible()
})
```

Violations are scoped to the element you pass, so components can be tested in
isolation. Options include `disabledRules`, `failOn` impact thresholds, and
snapshot baselines that auto-ratchet as you fix violations.

Check out [@accesslint/jest's documentation][gh] for setup, options, and a
migration guide from `jest-axe`.

- [@accesslint/jest on GitHub][gh]
- [@accesslint/jest on npm][npm]

[gh]: https://github.com/AccessLint/accesslint/tree/main/jest
[npm]: https://www.npmjs.com/package/@accesslint/jest
35 changes: 35 additions & 0 deletions docs/ecosystem-accesslint-vitest.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
---
id: ecosystem-accesslint-vitest
title: accesslint/vitest
---

[`@accesslint/vitest`][gh] is a companion library for Testing Library that adds
a synchronous `toBeAccessible()` matcher for Vitest, covering WCAG 2.2 Level A
and AA accessibility rules. Works under `jsdom` and `happy-dom`.

```bash npm2yarn
npm install --save-dev @accesslint/vitest
```

Add it as a setup file in your Vitest config, then assert on any rendered
element:

```jsx
import { render } from '@testing-library/react'
import { LoginForm } from './LoginForm'

test('LoginForm is accessible', () => {
const { container } = render(<LoginForm />)
expect(container).toBeAccessible()
})
```

Options include `disabledRules`, `failOn` impact thresholds, an opt-in audit
memoization fixture for component tests that chain multiple assertions, and
snapshot baselines that auto-ratchet as you fix violations.

- [@accesslint/vitest on GitHub][gh]
- [@accesslint/vitest on npm][npm]

[gh]: https://github.com/AccessLint/accesslint/tree/main/vitest
[npm]: https://www.npmjs.com/package/@accesslint/vitest
2 changes: 2 additions & 0 deletions sidebars.js
Original file line number Diff line number Diff line change
Expand Up @@ -218,6 +218,8 @@ module.exports = {
'ecosystem-rtl-simple-queries',
'ecosystem-testing-library-selector',
'ecosystem-cli-testing-library',
'ecosystem-accesslint-jest',
'ecosystem-accesslint-vitest',
],
},
],
Expand Down