Error: Invalid Chai property: toBeAccessible

[tyteen4a03]

I'm getting this error when using @sa11y/vitest: Error: Invalid Chai property: toBeAccessible

Also, TypeScript server is reporting this error: Property toBeAccessible does not exist on type Assertion<HTMLElement>

I have this in my setup script:

import { setup } from "@sa11y/vitest";

setup();

What am I doing wrong?

[riccardo-galli-hs1]

Just got the same issue. In my case I was using vitest 4.x, while @sa11y/vitest is currently based on vitest 3.x

What happens is that @sa11y/vitest import its own vitest, not the one you're using, and set toBeAccessible to the wrong expect instance. A possible solution is to inject yourself the property

// vitest-setup.ts

import { expect } from 'vitest';
import { toBeAccessible } from '@sa11y/vitest';

// Register the sa11y matcher manually against vitest v4's expect.
// @sa11y/vitest@8 bundles vitest v3, so its setup() extends the wrong expect instance.
expect.extend({ toBeAccessible });

Of course ideally @sa11y/vitest would be updated to vitest 4.x, and/or set it as peerDependency