Skip to content

Commit 76e573d

Browse files
committed
chore: migrate from Jest to Vitest
1 parent 0ee5039 commit 76e573d

File tree

19 files changed

+1408
-1275
lines changed

19 files changed

+1408
-1275
lines changed

.claude/settings.local.json

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
{
2+
"permissions": {
3+
"allow": [
4+
"Bash(cat:*)",
5+
"Bash(pnpm test:*)",
6+
"Bash(pnpm lint:*)"
7+
],
8+
"deny": [],
9+
"ask": []
10+
}
11+
}

.tool-versions

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,2 @@
1-
nodejs 18.16.1
1+
nodejs 24.11.0
2+
pnpm 10.21

configs/jestEnv.ts

Lines changed: 0 additions & 11 deletions
This file was deleted.

configs/jestSetup.ts

Whitespace-only changes.

configs/mockInlineStyleModule.ts

Lines changed: 0 additions & 1 deletion
This file was deleted.

configs/vitestSetup.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import '@testing-library/jest-dom'
2+
import { expect } from 'vitest'
3+
import * as matchers from '@testing-library/jest-dom/matchers'
4+
5+
expect.extend(matchers)

package.json

Lines changed: 10 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -14,38 +14,16 @@
1414
"postinstall": "patch-package",
1515
"lint": "eslint \"packages/**/src/**/*.{js,jsx,ts,tsx}\"",
1616
"compile": "lerna run compile",
17-
"test": "pnpm lint && pnpm compile && NODE_ENV=test jest --no-cache 'packages/.*/src'",
17+
"test": "pnpm lint && pnpm compile && vitest run",
18+
"test:watch": "vitest watch",
19+
"test:ui": "vitest --ui",
20+
"test:coverage": "vitest run --coverage",
1821
"release": "lerna version --sign-git-tag --conventional-commits",
1922
"storybook": "storybook dev -p 6006",
2023
"storybook:build": "pnpm compile && storybook build",
2124
"storybook:publish": "./scripts/publish_storybook.sh"
2225
},
2326
"prettier": "@c4605/toolconfs/prettierrc",
24-
"jest": {
25-
"testEnvironment": "./configs/jestEnv.ts",
26-
"setupFiles": [
27-
"./configs/jestSetup.ts"
28-
],
29-
"transform": {
30-
"^.+\\.jsx?$": "babel-jest",
31-
"^.+\\.tsx?$": "ts-jest"
32-
},
33-
"moduleNameMapper": {
34-
"\\.(css|less|scss)$": "<rootDir>/configs/mockInlineStyleModule.ts"
35-
},
36-
"testMatch": [
37-
"**/?(*.)+(spec|test).ts?(x)"
38-
],
39-
"moduleFileExtensions": [
40-
"ts",
41-
"tsx",
42-
"js",
43-
"jsx",
44-
"json",
45-
"node",
46-
"html"
47-
]
48-
},
4927
"dependencies": {
5028
"@babel/core": "^7.8.3",
5129
"@babel/plugin-proposal-class-properties": "^7.8.3",
@@ -54,12 +32,8 @@
5432
"@c4605/toolconfs": "^5.1.0",
5533
"@commitlint/cli": "^17.0.0",
5634
"@commitlint/config-conventional": "^17.0.0",
57-
"@jest/environment": "^29.6.1",
58-
"@testing-library/react": "^14.0.0",
59-
"@testing-library/react-hooks": "^8.0.0",
6035
"@testing-library/user-event": "^14.4.3",
6136
"@types/enzyme": "^3.10.4",
62-
"@types/jest": "^29.0.0",
6337
"@types/node": "^18.0.0",
6438
"@types/react": "^18.0.0",
6539
"@types/react-dom": "^18.0.0",
@@ -68,9 +42,6 @@
6842
"css-loader": "^6.0.0",
6943
"git-hook-pure": "^3.0.0",
7044
"identity-obj-proxy": "^3.0.0",
71-
"jest": "^29.0.0",
72-
"jest-cli": "^29.0.0",
73-
"jest-environment-jsdom": "^29.6.1",
7445
"lint-staged": "^13.0.0",
7546
"marked": "^5.0.0",
7647
"patch-package": "^8.0.0",
@@ -82,7 +53,6 @@
8253
"sass": "^1.25.0",
8354
"sass-loader": "^13.0.0",
8455
"style-loader": "^3.0.0",
85-
"ts-jest": "^29.0.0",
8656
"ts-loader": "^9.0.0",
8757
"tslint": "^5.20.1",
8858
"typescript": "^5.1.6"
@@ -102,21 +72,26 @@
10272
"@storybook/react": "^7.0.26",
10373
"@storybook/react-vite": "^7.0.26",
10474
"@storybook/testing-library": "^0.2.0",
75+
"@testing-library/jest-dom": "^6.9.1",
76+
"@testing-library/react": "^16.3.0",
10577
"@typescript-eslint/eslint-plugin": "^6.0.0",
10678
"@typescript-eslint/experimental-utils": "^5.61.0",
10779
"@typescript-eslint/parser": "^6.0.0",
80+
"@vitest/ui": "^4.0.8",
10881
"eslint": "^8.44.0",
10982
"eslint-config-prettier": "^8.8.0",
11083
"eslint-plugin-prettier": "^5.0.0-alpha.2",
11184
"eslint-plugin-react": "^7.32.2",
11285
"eslint-plugin-react-hooks": "^4.6.0",
11386
"eslint-plugin-storybook": "^0.6.12",
87+
"happy-dom": "^20.0.10",
11488
"lerna": "^7.0.0",
11589
"prop-types": "^15.8.1",
11690
"storybook": "^7.0.26",
11791
"trim-right": "^1.0.1",
11892
"tsup": "^7.1.0",
119-
"vite": "^4.4.2"
93+
"vite": "^4.4.2",
94+
"vitest": "^4.0.8"
12095
},
12196
"pnpm": {
12297
"patchedDependencies": {

packages/Modal/src/Modal.test.tsx

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,14 +3,15 @@ import { createRef } from 'react'
33
import { act, Simulate } from 'react-dom/test-utils'
44
import { render } from '@testing-library/react'
55
import user from '@testing-library/user-event'
6-
import { renderHook } from '@testing-library/react-hooks'
6+
import { renderHook } from '@testing-library/react'
7+
import { vi } from 'vitest'
78
import { Modal, useModal, ModalProps } from './Modal'
89

910
const defaultProps = Modal.defaultProps!
1011

1112
describe('Modal', () => {
1213
it('basicly works', () => {
13-
const onVisibleChange = jest.fn()
14+
const onVisibleChange = vi.fn()
1415
const portalContainerRef = createRef<HTMLElement>()
1516

1617
const html = document.documentElement
@@ -47,7 +48,7 @@ describe('Modal', () => {
4748
describe('props.backdrop', () => {
4849
it('support `"clickHide"`', () => {
4950
const portalContainerRef = createRef<HTMLElement>()
50-
const onVisibleChange = jest.fn()
51+
const onVisibleChange = vi.fn()
5152

5253
const modalWrapper = render(
5354
<Modal
@@ -79,7 +80,7 @@ describe('Modal', () => {
7980

8081
it('support `"static"`', async () => {
8182
const portalContainerRef = createRef<HTMLElement>()
82-
const onVisibleChange = jest.fn()
83+
const onVisibleChange = vi.fn()
8384

8485
const modalWrapper = render(
8586
<Modal
@@ -108,7 +109,7 @@ describe('Modal', () => {
108109
render(
109110
<Modal
110111
visible={false}
111-
onVisibleChange={jest.fn()}
112+
onVisibleChange={vi.fn()}
112113
backdrop={false}
113114
portalContainerRef={portalContainerRef}
114115
/>,
@@ -121,7 +122,7 @@ describe('Modal', () => {
121122

122123
describe('useModal', () => {
123124
it('basicly works', () => {
124-
const onVisibleChange = jest.fn()
125+
const onVisibleChange = vi.fn()
125126
const { result } = renderHook(() =>
126127
useModal({
127128
visible: true,

packages/Modal/src/__snapshots__/Modal.test.tsx.snap

Lines changed: 133 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,82 @@
1-
// Jest Snapshot v1, https://goo.gl/fbAQLP
1+
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
2+
3+
exports[`Modal > basicly works 1`] = `
4+
<div
5+
class="Modal"
6+
style="display: none;"
7+
>
8+
<div
9+
class="Modal__backdrop"
10+
/>
11+
<div
12+
class="Modal__body"
13+
>
14+
<div
15+
class="test-modal-classname"
16+
>
17+
test modal content
18+
</div>
19+
</div>
20+
</div>
21+
`;
22+
23+
exports[`Modal > basicly works 2`] = `
24+
<div
25+
class="Modal"
26+
>
27+
<div
28+
class="Modal__backdrop"
29+
/>
30+
<div
31+
class="Modal__body"
32+
>
33+
<div
34+
class="test-modal-classname"
35+
>
36+
test modal content
37+
</div>
38+
</div>
39+
</div>
40+
`;
41+
42+
exports[`Modal > props.backdrop > support \`"clickHide"\` 1`] = `
43+
<div
44+
class="Modal"
45+
style="display: none;"
46+
>
47+
<div
48+
class="Modal__backdrop"
49+
/>
50+
<div
51+
class="Modal__body"
52+
/>
53+
</div>
54+
`;
55+
56+
exports[`Modal > props.backdrop > support \`"static"\` 1`] = `
57+
<div
58+
class="Modal"
59+
style="display: none;"
60+
>
61+
<div
62+
class="Modal__backdrop"
63+
/>
64+
<div
65+
class="Modal__body"
66+
/>
67+
</div>
68+
`;
69+
70+
exports[`Modal > props.backdrop > support \`false\` 1`] = `
71+
<div
72+
class="Modal"
73+
style="display: none;"
74+
>
75+
<div
76+
class="Modal__body"
77+
/>
78+
</div>
79+
`;
280

381
exports[`Modal basicly works 1`] = `
482
<div
@@ -79,6 +157,60 @@ exports[`Modal props.backdrop support \`false\` 1`] = `
79157
</div>
80158
`;
81159

160+
exports[`useModal > basicly works 1`] = `
161+
<Modal2
162+
backdrop="clickHide"
163+
backdropClassName="Modal__backdrop"
164+
bodyClassName="Modal__body"
165+
documentElementClassName="Modal__html"
166+
documentElementClassNameWhenInvisible={null}
167+
documentElementClassNameWhenVisible="Modal__html--visible"
168+
onVisibleChange={[Function]}
169+
portalClassName="Modal"
170+
visible={true}
171+
>
172+
<div>
173+
hello
174+
</div>
175+
</Modal2>
176+
`;
177+
178+
exports[`useModal > basicly works 2`] = `
179+
<Modal2
180+
backdrop="clickHide"
181+
backdropClassName="Modal__backdrop"
182+
bodyClassName="Modal__body"
183+
documentElementClassName="Modal__html"
184+
documentElementClassNameWhenInvisible={null}
185+
documentElementClassNameWhenVisible="Modal__html--visible"
186+
onVisibleChange={[Function]}
187+
portalClassName="Modal"
188+
visible={false}
189+
>
190+
<div>
191+
hello
192+
</div>
193+
</Modal2>
194+
`;
195+
196+
exports[`useModal > basicly works 3`] = `
197+
<Modal2
198+
backdrop="clickHide"
199+
backdropClassName="Modal__backdrop"
200+
bodyClassName="Modal__body"
201+
documentElementClassName="Modal__html"
202+
documentElementClassNameWhenInvisible={null}
203+
documentElementClassNameWhenVisible="Modal__html--visible"
204+
onVisibleChange={[Function]}
205+
portalClassName="Modal"
206+
visible={true}
207+
>
208+
<div>
209+
hello
210+
</div>
211+
</Modal2>
212+
`;
213+
82214
exports[`useModal basicly works 1`] = `
83215
<Modal
84216
backdrop="clickHide"

0 commit comments

Comments
 (0)