chore(tests): migrate to vitest (#1839)

* chore: initial vitest setup * test(vanilla): migrate vanilla tests * test(babel): migrate babel tests * chore: react-testing library vitest setup * test(react): migrate tests * test: deprecate legacy tests + update scripts * test: remove unnecessary changes * ci: remove references to jest update scripts * chore: remove extra test setup * ci(test-old-typescript): update command * test: try removing pretty-format override * test: use named imports for vitest * test: revert stylistic changes * test: fix react transition test * chore(package.json): revert react experimental version * chore: bump react experimental versions * chore: add types for babel-core * test(atomWithObservable): use shouldAdvanceTime to bring mock time in parity with real time * chore: update old typescript file * chore: update old typescript file * test: add type + keep parse5 in old tests * chore: remove extra test scripts Co-authored-by: Daishi Kato <dai-shi@users.noreply.github.com> * test(types.test.tsx): import it from vitest --------- Co-authored-by: Daishi Kato <dai-shi@users.noreply.github.com>
pmndrs · May 5, 2023 · cc35d1d · cc35d1d · vercel · May 5, 2023
1 parent 1c08b20
commit cc35d1d
Show file tree

Hide file tree

Showing 44 changed files with 971 additions and 1,605 deletions.
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -20,7 +20,7 @@
     "prettier",
     "react-hooks",
     "import",
-    "jest"
+    "vitest"
   ],
   "parser": "@typescript-eslint/parser",
   "parserOptions": {
@@ -48,10 +48,12 @@
     "@typescript-eslint/no-use-before-define": "off",
     "@typescript-eslint/no-empty-function": "off",
     "@typescript-eslint/no-explicit-any": "off",
-    "jest/consistent-test-it": [
+    "vitest/consistent-test-it": [
       "error",
       { "fn": "it", "withinDescribe": "it" }
     ],
+    "import/namespace": "off",
+    "import/named": "off",
     "import/order": [
       "error",
       {

diff --git a/.github/workflows/test-multiple-builds.yml b/.github/workflows/test-multiple-builds.yml
@@ -52,7 +52,6 @@ jobs:
         if: ${{ matrix.build == 'umd' }}
         run: |
           sed -i~ "s/<rootDir>\/src\(.*\)\.ts/<rootDir>\/dist\/umd\1.${NODE_ENV}.js/" package.json
-          sed -i~ 's/"test:ci":.*,$/"test:ci": "jest",/' package.json
         env:
           NODE_ENV: ${{ matrix.env }}
       - name: Patch for SystemJS

diff --git a/.github/workflows/test-multiple-versions.yml b/.github/workflows/test-multiple-versions.yml
@@ -52,7 +52,6 @@ jobs:
           sed -i~ '1s/^/import React from "react";/' tests/*/*.tsx tests/*/*/*.tsx
           sed -i~ 's/"jsx": "react-jsx"/"jsx": "react"/' tsconfig.json
           sed -i~ 's/import\.meta\.env[?]\.MODE/"DEVELOPMENT".toLowerCase()/' src/*.ts src/*/*.ts src/*/*/*.ts
-          sed -i~ 's/"test:ci":.*,$/"test:ci": "jest",/' package.json
       - name: Test Build # we need to build for babel tests
         run: yarn build
       - name: Test ${{ matrix.react }}

diff --git a/.github/workflows/test-old-typescript.yml b/.github/workflows/test-old-typescript.yml
@@ -61,12 +61,19 @@ jobs:
           sed -i~ 's/"jsx": "react-jsx",/"jsx": "react",/' tsconfig.json
           sed -i~ 's/"noUncheckedIndexedAccess": true,//' tsconfig.json
           sed -i~ 's/^import type /import /' tests/*/*.tsx tests/*/*/*.tsx
-          yarn json -I -f package.json -e "this.resolutions={}; this.resolutions['@jest/globals']='25.5.2'; this.resolutions['pretty-format']='25.5.0'; this.resolutions['@types/prettier']='2.4.2'; this.resolutions['@types/node']='18.11.18';"
-          yarn add -D @jest/globals@25.5.2 pretty-format@25.5.0 @types/prettier@2.4.2 @types/node@18.11.18 @types/yargs@17.0.13 @types/babel__traverse@7.18.2
+          yarn json -I -f package.json -e "this.resolutions={};  this.resolutions['@types/prettier']='2.4.2'; this.resolutions['@types/node']='18.11.18';"
+          yarn add -D @types/prettier@2.4.2 @types/node@18.11.18 @types/yargs@17.0.13 @types/babel__traverse@7.18.2
           rm -r tests/react/vanilla-utils/atomWithObservable.*
+      - name: Install old TypeScript
+        run: yarn add -D typescript@${{ matrix.typescript }}
+      - name: Patch testing setup for older TS
+        if: ${{ matrix.typescript == '3.9.7' ||  matrix.typescript == '3.8.3' }}
+        run: |
+          yarn add -D @testing-library/user-event@12.1.7 @testing-library/react@11.0.4
+          rm node_modules/vitest/dist/*.d.ts
+          echo "declare module 'vitest'" >> ./src/types.d.ts
       - name: Test ${{ matrix.typescript }}
         run: |
-          yarn add -D typescript@${{ matrix.typescript }}
-          rm -r node_modules/@types/jsdom node_modules/parse5 node_modules/@types/babel__core/node_modules
+          rm -r node_modules/@types/babel__core/node_modules
           sed -i~ 's/">=4.2": {/">=4.1": {/' node_modules/rxjs/package.json
           yarn tsc --noEmit
diff --git a/package.json b/package.json
@@ -73,10 +73,8 @@
     "eslint": "eslint --fix --no-eslintrc --c .eslintrc.json '*.{js,json}' '{src,tests,benchmarks}/**/*.{ts,tsx}'",
     "eslint:ci": "eslint --no-eslintrc --c .eslintrc.json '*.{js,json}' '{src,tests,benchmarks}/**/*.{ts,tsx}'",
     "pretest": "tsc --noEmit",
-    "test": "yarn node --experimental-vm-modules $(yarn bin jest)",
-    "test:ci": "yarn node --experimental-vm-modules $(yarn bin jest)",
-    "test:dev": "yarn node --experimental-vm-modules $(yarn bin jest) --watch --no-coverage",
-    "test:coverage:watch": "yarn node --experimental-vm-modules $(yarn bin jest) --watch",
+    "test": "vitest --ui --coverage",
+    "test:ci": "vitest",
     "patch-d-ts": "node -e \"var {entries}=require('./rollup.config.js');require('shelljs').find('dist/**/*.d.ts').forEach(f=>{entries.forEach(({find,replacement})=>require('shelljs').sed('-i',new RegExp(' from \\''+find.source.slice(0,-1)+'\\';$'),' from \\''+replacement+'\\';',f));require('shelljs').sed('-i',/ from '(\\.[^']+)\\.ts';$/,' from \\'\\$1\\';',f)})\"",
     "copy": "shx cp -r dist/src/* dist/esm && shx cp -r dist/src/* dist && shx rm -rf dist/src && shx rm -rf dist/{src,tests} && downlevel-dts dist dist/ts3.8 --to=3.8 && shx cp package.json readme.md LICENSE dist && json -I -f dist/package.json -e \"this.private=false; this.devDependencies=undefined; this.optionalDependencies=undefined; this.scripts=undefined; this.prettier=undefined; this.jest=undefined;\"",
     "patch-ts3.8": "node -e \"require('shelljs').find('dist/ts3.8/**/*.d.ts').forEach(f=>require('fs').appendFileSync(f,'declare type Awaited<T> = T extends Promise<infer V> ? V : T;'))\"",
@@ -114,44 +112,6 @@
     "url": "https://github.com/pmndrs/jotai/issues"
   },
   "homepage": "https://github.com/pmndrs/jotai",
-  "jest": {
-    "rootDir": ".",
-    "testEnvironment": "jsdom",
-    "preset": "ts-jest/presets/default-esm",
-    "transform": {
-      "^.+\\.(t|j)sx?$": [
-        "ts-jest",
-        {
-          "useESM": true
-        }
-      ]
-    },
-    "extensionsToTreatAsEsm": [
-      ".ts",
-      ".tsx"
-    ],
-    "moduleNameMapper": {
-      "^jotai$": "<rootDir>/src/index.ts",
-      "^jotai/(.*)$": "<rootDir>/src/$1.ts",
-      "^rxjs$": "<rootDir>/node_modules/rxjs/dist/cjs/index.js"
-    },
-    "modulePathIgnorePatterns": [
-      "dist"
-    ],
-    "testRegex": "test.(js|ts|tsx)$",
-    "coverageDirectory": "./coverage/",
-    "collectCoverage": true,
-    "coverageReporters": [
-      "json",
-      "html",
-      "text",
-      "text-summary"
-    ],
-    "collectCoverageFrom": [
-      "src/**/*.{js,ts,tsx}",
-      "tests/**/*.{js,ts,tsx}"
-    ]
-  },
   "devDependencies": {
     "@babel/core": "^7.21.4",
     "@babel/plugin-transform-react-jsx": "^7.21.0",
@@ -166,12 +126,16 @@
     "@rollup/plugin-replace": "^5.0.2",
     "@rollup/plugin-terser": "^0.4.0",
     "@rollup/plugin-typescript": "^11.1.0",
+    "@testing-library/dom": "^9.2.0",
     "@testing-library/react": "^14.0.0",
     "@testing-library/user-event": "^14.4.3",
+    "@types/babel__core": "^7.20.0",
     "@types/react": "^18.0.33",
     "@types/react-dom": "^18.0.11",
     "@typescript-eslint/eslint-plugin": "^5.57.1",
     "@typescript-eslint/parser": "^5.57.1",
+    "@vitest/coverage-c8": "^0.29.2",
+    "@vitest/ui": "^0.29.2",
     "benny": "^3.7.1",
     "concurrently": "^8.0.1",
     "downlevel-dts": "^0.11.0",
@@ -180,12 +144,11 @@
     "eslint-config-prettier": "^8.8.0",
     "eslint-import-resolver-alias": "^1.1.2",
     "eslint-plugin-import": "^2.27.5",
-    "eslint-plugin-jest": "^27.2.1",
     "eslint-plugin-prettier": "^4.2.1",
     "eslint-plugin-react": "^7.32.2",
     "eslint-plugin-react-hooks": "^4.6.0",
-    "jest": "^29.5.0",
-    "jest-environment-jsdom": "^29.5.0",
+    "eslint-plugin-vitest": "^0.0.57",
+    "jsdom": "^21.1.1",
     "json": "^11.0.0",
     "prettier": "^2.8.7",
     "react": "^18.2.0",
@@ -196,10 +159,10 @@
     "rxjs": "^7.8.0",
     "shx": "^0.3.4",
     "ts-expect": "^1.3.0",
-    "ts-jest": "^29.1.0",
     "ts-node": "^10.9.1",
     "tslib": "^2.5.0",
     "typescript": "^5.0.3",
+    "vitest": "^0.29.8",
     "wonka": "^6.3.1"
   },
   "peerDependencies": {

diff --git a/tests/babel/plugin-debug-label.test.ts b/tests/babel/plugin-debug-label.test.ts
@@ -1,9 +1,6 @@
-import path from 'path'
 import { transformSync } from '@babel/core'
-import { expect, it } from '@jest/globals'
-
-// const plugin = path.resolve('./src/babel/plugin-debug-label.ts')
-const plugin = path.resolve('./dist/babel/plugin-debug-label.js')
+import { expect, it } from 'vitest'
+import plugin from 'jotai/babel/plugin-debug-label'
 
 const transform = (
   code: string,
@@ -20,40 +17,40 @@ const transform = (
 it('Should add a debugLabel to an atom', () => {
   expect(transform(`const countAtom = atom(0);`)).toMatchInlineSnapshot(`
     "const countAtom = atom(0);
-    countAtom.debugLabel = "countAtom";"
+    countAtom.debugLabel = \\"countAtom\\";"
   `)
 })
 
 it('Should handle a atom from a default export', () => {
   expect(transform(`const countAtom = jotai.atom(0);`)).toMatchInlineSnapshot(`
     "const countAtom = jotai.atom(0);
-    countAtom.debugLabel = "countAtom";"
+    countAtom.debugLabel = \\"countAtom\\";"
   `)
 })
 
 it('Should handle a atom being exported', () => {
   expect(transform(`export const countAtom = atom(0);`)).toMatchInlineSnapshot(`
     "export const countAtom = atom(0);
-    countAtom.debugLabel = "countAtom";"
+    countAtom.debugLabel = \\"countAtom\\";"
   `)
 })
 
 it('Should handle a default exported atom', () => {
   expect(transform(`export default atom(0);`, 'countAtom.ts'))
     .toMatchInlineSnapshot(`
-    "const countAtom = atom(0);
-    countAtom.debugLabel = "countAtom";
-    export default countAtom;"
-  `)
+      "const countAtom = atom(0);
+      countAtom.debugLabel = \\"countAtom\\";
+      export default countAtom;"
+    `)
 })
 
 it('Should handle a default exported atom in a barrel file', () => {
   expect(transform(`export default atom(0);`, 'atoms/index.ts'))
     .toMatchInlineSnapshot(`
-    "const atoms = atom(0);
-    atoms.debugLabel = "atoms";
-    export default atoms;"
-  `)
+      "const atoms = atom(0);
+      atoms.debugLabel = \\"atoms\\";
+      export default atoms;"
+    `)
 })
 
 it('Should handle all types of exports', () => {
@@ -67,9 +64,9 @@ it('Should handle all types of exports', () => {
     )
   ).toMatchInlineSnapshot(`
     "export const countAtom = atom(0);
-    countAtom.debugLabel = "countAtom";
+    countAtom.debugLabel = \\"countAtom\\";
     const atoms = atom(0);
-    atoms.debugLabel = "atoms";
+    atoms.debugLabel = \\"atoms\\";
     export default atoms;"
   `)
 })
@@ -79,25 +76,15 @@ it('Should handle all atom types', () => {
     transform(
       `
       export const countAtom = atom(0);
-
       const myFamily = atomFamily((param) => atom(param));
-
       const countAtomWithDefault = atomWithDefault((get) => get(countAtom) * 2);
-
       const observableAtom = atomWithObservable(() => {});
-
       const reducerAtom = atomWithReducer(0, () => {});
-
       const resetAtom = atomWithReset(0);
-
       const storageAtom = atomWithStorage('count', 1);
-
       const freezedAtom = freezeAtom(atom({ count: 0 }));
-
       const loadedAtom = loadable(countAtom);
-
       const selectedValueAtom = selectAtom(atom({ a: 0, b: 'othervalue' }), (v) => v.a);
-
       const splittedAtom = splitAtom(atom([]));
 
       const unwrappedAtom = unstable_unwrap(asyncArrayAtom, () => []);
@@ -125,52 +112,52 @@ it('Should handle all atom types', () => {
     )
   ).toMatchInlineSnapshot(`
     "export const countAtom = atom(0);
-    countAtom.debugLabel = "countAtom";
+    countAtom.debugLabel = \\"countAtom\\";
     const myFamily = atomFamily(param => atom(param));
-    myFamily.debugLabel = "myFamily";
+    myFamily.debugLabel = \\"myFamily\\";
     const countAtomWithDefault = atomWithDefault(get => get(countAtom) * 2);
-    countAtomWithDefault.debugLabel = "countAtomWithDefault";
+    countAtomWithDefault.debugLabel = \\"countAtomWithDefault\\";
     const observableAtom = atomWithObservable(() => {});
-    observableAtom.debugLabel = "observableAtom";
+    observableAtom.debugLabel = \\"observableAtom\\";
     const reducerAtom = atomWithReducer(0, () => {});
-    reducerAtom.debugLabel = "reducerAtom";
+    reducerAtom.debugLabel = \\"reducerAtom\\";
     const resetAtom = atomWithReset(0);
-    resetAtom.debugLabel = "resetAtom";
+    resetAtom.debugLabel = \\"resetAtom\\";
     const storageAtom = atomWithStorage('count', 1);
-    storageAtom.debugLabel = "storageAtom";
+    storageAtom.debugLabel = \\"storageAtom\\";
     const freezedAtom = freezeAtom(atom({
       count: 0
     }));
-    freezedAtom.debugLabel = "freezedAtom";
+    freezedAtom.debugLabel = \\"freezedAtom\\";
     const loadedAtom = loadable(countAtom);
-    loadedAtom.debugLabel = "loadedAtom";
+    loadedAtom.debugLabel = \\"loadedAtom\\";
     const selectedValueAtom = selectAtom(atom({
       a: 0,
       b: 'othervalue'
     }), v => v.a);
-    selectedValueAtom.debugLabel = "selectedValueAtom";
+    selectedValueAtom.debugLabel = \\"selectedValueAtom\\";
     const splittedAtom = splitAtom(atom([]));
-    splittedAtom.debugLabel = "splittedAtom";
+    splittedAtom.debugLabel = \\"splittedAtom\\";
     const unwrappedAtom = unstable_unwrap(asyncArrayAtom, () => []);
-    unwrappedAtom.debugLabel = "unwrappedAtom";
+    unwrappedAtom.debugLabel = \\"unwrappedAtom\\";
     const someatomWithSubscription = atomWithSubscription(() => {});
-    someatomWithSubscription.debugLabel = "someatomWithSubscription";
+    someatomWithSubscription.debugLabel = \\"someatomWithSubscription\\";
     const someAtomWithStore = atomWithStore(() => {});
-    someAtomWithStore.debugLabel = "someAtomWithStore";
+    someAtomWithStore.debugLabel = \\"someAtomWithStore\\";
     const someAtomWithHash = atomWithHash('', '');
-    someAtomWithHash.debugLabel = "someAtomWithHash";
+    someAtomWithHash.debugLabel = \\"someAtomWithHash\\";
     const someAtomWithLocation = atomWithLocation();
-    someAtomWithLocation.debugLabel = "someAtomWithLocation";
+    someAtomWithLocation.debugLabel = \\"someAtomWithLocation\\";
     const someFocusAtom = focusAtom(someAtom, () => {});
-    someFocusAtom.debugLabel = "someFocusAtom";
+    someFocusAtom.debugLabel = \\"someFocusAtom\\";
     const someAtomWithValidate = atomWithValidate('', {});
-    someAtomWithValidate.debugLabel = "someAtomWithValidate";
+    someAtomWithValidate.debugLabel = \\"someAtomWithValidate\\";
     const someValidateAtoms = validateAtoms({}, () => {});
-    someValidateAtoms.debugLabel = "someValidateAtoms";
+    someValidateAtoms.debugLabel = \\"someValidateAtoms\\";
     const someAtomWithCache = atomWithCache(async () => {});
-    someAtomWithCache.debugLabel = "someAtomWithCache";
+    someAtomWithCache.debugLabel = \\"someAtomWithCache\\";
     const someAtomWithRecoilValue = atomWithRecoilValue({});
-    someAtomWithRecoilValue.debugLabel = "someAtomWithRecoilValue";"
+    someAtomWithRecoilValue.debugLabel = \\"someAtomWithRecoilValue\\";"
   `)
 })
 
@@ -181,6 +168,6 @@ it('Handles custom atom names a debugLabel to an atom', () => {
     ])
   ).toMatchInlineSnapshot(`
     "const mySpecialThing = myCustomAtom(0);
-    mySpecialThing.debugLabel = "mySpecialThing";"
+    mySpecialThing.debugLabel = \\"mySpecialThing\\";"
   `)
 })