Export Vitest extend-expect

[AndrewLeedham]

Describe the feature you'd like:

I would like to use jest-dom in Vitest.

Suggested implementation:

Since both Jest and Vitest use the same style of matchers, and have very similiar APIs, perhaps jest-dom can export a secondary entry point for Vitest, or make the matchers export a first-class API.

Describe alternatives you've considered:

I can manually add the matchers in a setup file using:

import { expect } from 'vitest';
import * as matchers from '@testing-library/jest-dom/dist/matchers';

expect.extend(matchers);

However, I am reaching into the dist folder which is not a public API, also I am using TypeScript and having to setup the types myself, rather than using @types/jest-dom.

Teachability, Documentation, Adoption, Migration Strategy:

This would just be an additional entry file just for Vitest, so should not change the functionality of jest-dom.

[gnapse]

I suspect that you can already do this (the same as above, but without the /dist part):

import { expect } from 'vitest';
import * as matchers from '@testing-library/jest-dom/matchers';

expect.extend(matchers);

Can you confirm? I tried it myself, and it worked, but it would not hurt to make sure.

However, the types part is not solved. But that requires a PR to https://github.com/DefinitelyTyped/DefinitelyTyped. It'd be great if you'd contribute that for us. Can you?

[AndrewLeedham]

@gnapse Ah yes I missed that file. Although because of the CJS default export, it only works as

import matchers from '@testing-library/jest-dom/matchers';

But that is fine. I'll put a PR into DefinitelyTyped

[gnapse]

We're introducing EMS exports soon (#438). Does that help?

[AndrewLeedham]

@gnapse ESM exports will be great. Will probably involve reworking the @types package again. But for now I have added the matchers declaration: DefinitelyTyped/DefinitelyTyped#59030

[IanVS]

Will probably involve reworking the @types package again

Just curious, why is that? I'm definitely open to suggestions on the ESM PR to avoid as much churn as possible.

[AndrewLeedham]

Was thinking it would need something like this: DefinitelyTyped/DefinitelyTyped#57195 but could be wrong.

[hornta]

@AndrewLeedham Did you solve your problem? This is blocking me from using Vitest with testing-library. The above solutions only work when vitest is configured for globals.

[AndrewLeedham]

Hi @hornta. My Definitely Typed PR landed so you should be able to do this:

// vitest-setup.ts
import { vi } from 'vitest';
import matchers, {
  TestingLibraryMatchers,
} from '@testing-library/jest-dom/matchers';

declare global {
  namespace Vi {
    interface JestAssertion<T = any>
      extends jest.Matchers<void, T>,
        TestingLibraryMatchers<T, void> {}
  }
}

expect.extend(matchers);

[kedar-s]

@AndrewLeedham Tried to use your exact same solution but I always end up with weird type errors

// vitest-setup.ts
import { vi } from 'vitest';
import matchers, {
  TestingLibraryMatchers,
} from '@testing-library/jest-dom/matchers';

declare global {
  namespace Vi {
    interface JestAssertion<T = any>
      extends jest.Matchers<void, T>,
        TestingLibraryMatchers<T, void> {}
  }
}

expect.extend(matchers);

Generic type 'Matchers<R, T, _R, _T>' requires between 3 and 4 type arguments.ts(2707)

I can see that the interface Matchers only takes 2 type arguments.

interface Matchers<R = void, T = {}>

I'd appreciate any ideas on how to approach this problem.
Thanks!

[paulcwatts]

For those coming here after updating to vitest >= 0.31.0, the above workaround no longer works because the assertions package location changed (https://github.com/vitest-dev/vitest/releases/tag/v0.31.0)

The following works for me:

// vitest-setup.ts
import type { TestingLibraryMatchers } from "@testing-library/jest-dom/matchers";
import matchers from "@testing-library/jest-dom/matchers";
import { expect } from "vitest";

declare module "vitest" {
  interface Assertion<T = any>
    extends jest.Matchers<void, T>,
      TestingLibraryMatchers<T, void> {}
}

expect.extend(matchers);