diff --git a/.eslintrc.json b/.eslintrc.json index a75afd1..cb53f98 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -17,8 +17,8 @@ "overrides": [ { "files": ["**/?(*.)+(spec|test).[jt]s?(x)"], - "plugins": ["jest", "jest-dom", "testing-library"], - "extends": ["plugin:jest/recommended", "plugin:jest-dom/recommended", "plugin:testing-library/react"] + "plugins": ["vitest", "jest-dom", "testing-library"], + "extends": ["plugin:jest-dom/recommended", "plugin:testing-library/react"] }, { "files": ["**/?(*.)+(stories).[jt]s?(x)"], diff --git a/jest.config.ts b/jest.config.ts deleted file mode 100644 index a140540..0000000 --- a/jest.config.ts +++ /dev/null @@ -1,21 +0,0 @@ -import type { Config } from "jest"; - -const config: Config = { - setupFilesAfterEnv: ["/jest.setup.ts"], - testEnvironment: "jest-environment-jsdom", - moduleNameMapper: { - "^@atoms/(.*)$": "/src/components/atoms/$1", - "^@molecules/(.*)$": "/src/components/molecules/$1", - "^@charts/(.*)$": "/src/charts/$1", - "^@hooks/(.*)$": "/src/hooks/$1", - "^@contexts/(.*)$": "/src/contexts/$1", - "^@constants/(.*)$": "/src/constants/$1", - "^@utils/(.*)$": "/src/utils/$1", - // 필요한 경우 다른 모듈에 대한 alias 추가 - }, - transform: { - "^.+\\.(ts|tsx)$": "ts-jest", // 추가된 transform 설정 - }, -}; - -export default config; diff --git a/jest.setup.ts b/jest.setup.ts deleted file mode 100644 index aa0fdfe..0000000 --- a/jest.setup.ts +++ /dev/null @@ -1,5 +0,0 @@ -// Optional: configure or set up a testing framework before each test. -// If you delete this file, remove `setupFilesAfterEnv` from `jest.config.js` -// Used for __tests__/testing-library.js -// Learn more: https://github.com/testing-library/jest-dom -import "@testing-library/jest-dom"; diff --git a/package.json b/package.json index ff5c339..1752b5a 100644 --- a/package.json +++ b/package.json @@ -24,7 +24,7 @@ "dev": "vite", "build": "tsc --project tsconfig.build.json && vite build", "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0", - "test": "jest --passWithNoTests", + "test": "vitest", "preview": "vite preview", "storybook": "storybook dev -p 6006", "build-storybook": "storybook build", @@ -52,36 +52,35 @@ "@testing-library/react": "^15.0.7", "@trivago/prettier-plugin-sort-imports": "^4.3.0", "@types/d3": "^7.4.3", - "@types/jest": "^29.5.12", "@types/react": "^18.2.66", "@types/react-dom": "^18.2.22", "@typescript-eslint/eslint-plugin": "^7.2.0", "@typescript-eslint/parser": "^7.2.0", "@vitejs/plugin-react": "^4.2.1", + "@vitest/ui": "^1.6.0", "autoprefixer": "^10.4.19", "eslint": "^8.47.0", "eslint-config-prettier": "^9.1.0", - "eslint-plugin-jest": "^28.5.0", "eslint-plugin-jest-dom": "^5.4.0", "eslint-plugin-react": "^7.34.1", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.6", "eslint-plugin-storybook": "^0.8.0", "eslint-plugin-testing-library": "^6.2.2", - "jest": "^29.7.0", - "jest-environment-jsdom": "^29.7.0", + "eslint-plugin-vitest": "^0.5.4", + "jsdom": "^24.0.0", "plop": "^4.0.1", "postcss": "^8.4.38", "prettier": "^3.2.5", "storybook": "^8.1.1", "storybook-addon-pseudo-states": "^3.1.1", "tailwindcss": "^3.4.3", - "ts-jest": "^29.1.2", "ts-node": "^10.9.2", "tw-colors": "^3.3.1", "typescript": "^5.2.2", "vite": "^5.2.0", "vite-plugin-dts": "^3.9.1", - "vite-tsconfig-paths": "^4.3.2" + "vite-tsconfig-paths": "^4.3.2", + "vitest": "^1.6.0" } } diff --git a/setupTest.ts b/setupTest.ts new file mode 100644 index 0000000..d0de870 --- /dev/null +++ b/setupTest.ts @@ -0,0 +1 @@ +import "@testing-library/jest-dom"; diff --git a/src/components/atoms/Button/__test__/Button.test.tsx b/src/components/atoms/Button/__test__/Button.test.tsx index 7e8ba0b..a285155 100644 --- a/src/components/atoms/Button/__test__/Button.test.tsx +++ b/src/components/atoms/Button/__test__/Button.test.tsx @@ -1,5 +1,6 @@ import { render, screen } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; +import { describe, expect, it, vi } from "vitest"; import Button from ".."; describe("Button", () => { @@ -23,7 +24,7 @@ describe("Button", () => { }); it("space 키로 onClick 함수를 실행해야합니다.", async () => { - const onClick = jest.fn(); + const onClick = vi.fn(); render(); const button = screen.getByRole("button"); @@ -37,7 +38,7 @@ describe("Button", () => { }); it("enter 키로 onClick 함수를 실행해야합니다.", async () => { - const onClick = jest.fn(); + const onClick = vi.fn(); render(); const button = screen.getByRole("button"); @@ -51,7 +52,7 @@ describe("Button", () => { }); it("click 시 onClick 함수를 실행해야합니다.", async () => { - const onClick = jest.fn(); + const onClick = vi.fn(); render(); const button = screen.getByRole("button"); @@ -82,7 +83,7 @@ describe("Button", () => { }); it("disabled시 click이 불가능해야합니다.", async () => { - const onClick = jest.fn(); + const onClick = vi.fn(); render(