fix: vitest types not working (closes #610) (#636)

* fix: vitest types not working (closes #610)
(rely on user provided types)

* Update website/docs/getting-started/setup.md

Co-authored-by: Simen Bekkhus <[email protected]>

---------

Co-authored-by: Simen Bekkhus <[email protected]>

.changeset/three-buckets-rush.md

@@ -0,0 +1,5 @@
+---
+'jest-extended': patch
+---
+
+Remove problematic Vitest types

types/index.d.ts

@@ -880,18 +880,6 @@ declare namespace jest {
   interface InverseAsymmetricMatchers extends Expect {}
 }
 
-// removed since vitest 0.31.0. Useful for every vitest version before 0.31.0
-declare namespace Vi {
-  // eslint-disable-next-line @typescript-eslint/no-empty-interface
-  interface AsymmetricMatchersContaining extends CustomMatchers<any> {}
-}
-
-// Changed since vitest 0.31.0. Useful for every vitest version after 0.31.0
-declare module 'vitest' {
-  // eslint-disable-next-line @typescript-eslint/no-empty-interface
-  interface AsymmetricMatchersContaining extends CustomMatchers<any> {}
-}
-
 declare module 'jest-extended' {
   const matchers: CustomMatchers<any>;
   export = matchers;

website/docs/getting-started/setup.md

@@ -11,7 +11,6 @@ sidebar_position: 2
 Create a setup script with the following:
 
 ```javascript title="testSetup.js"
-
 // add all jest-extended matchers
 import * as matchers from 'jest-extended';
 expect.extend(matchers);
@@ -42,8 +41,8 @@ To automatically extend `expect` with all matchers, you can use
 `jest-extended` works with `vitest` because their `expect.extend` API is compatible. In your setup script:
 
 ```javascript title="testSetup.js"
-import {expect} from "vitest";
-import * as matchers from "jest-extended";
+import { expect } from 'vitest';
+import * as matchers from 'jest-extended';
 expect.extend(matchers);
 ```
 
@@ -52,7 +51,47 @@ Add this setup script to your `vitest.config.js`:
 ```javascript title="vitest.config.js"
 export default defineConfig({
   test: {
-    setupFiles: ["./testSetup.js"],
+    setupFiles: ['./testSetup.js'],
   },
 });
 ```
+
+### Vitest TypeScript types setup
+
+To use Vitest with TypeScript, create a file named `jest-extended.d.ts` with the content below in addition to the setup above.
+
+```typescript
+/// <reference types="vitest" />
+
+export interface CustomMatchers<R> extends Record<string, any> {
+  toHaveBeenCalledAfter(
+    mock: jest.MockInstance<any, any[]> | import('vitest').MockInstance<any, any[]>,
+    failIfNoFirstInvocation?: boolean,
+  ): R;
+
+  toHaveBeenCalledBefore(
+    mock: jest.MockInstance<any, any[]> | import('vitest').MockInstance<any, any[]>,
+    failIfNoSecondInvocation?: boolean,
+  ): R;
+
+  toHaveBeenCalledExactlyOnceWith(...args: unknown[]): R;
+}
+```
+
+For Vitest >= 0.31.0, append the content below to the new file.
+
+```typescript
+declare module 'vitest' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface Assertion<T = any> extends CustomMatchers<T> {}
+}
+```
+
+For Vitest < 0.31.0, append the content below to the new file.
+
+```typescript
+declare namespace Vi {
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+  interface AsymmetricMatchersContaining extends CustomMatchers<any> {}
+}
+```