refactor: rename files that have jsx in them, refactor from jest to v…

…itest

.eslintrc

@@ -2,7 +2,6 @@
   "extends": ["eslint-config-airbnb", "plugin:prettier/recommended", "prettier"],
   "env": {
     "browser": true,
-    "jest": true,
     "node": true
   },
   "parser": "@babel/eslint-parser",

package.json

@@ -23,7 +23,8 @@
     "build-es6": "rimraf es6 && babel ./src -d es6",
     "build-umd": "cross-env NODE_ENV=development BABEL_ENV=commonjs webpack --entry ./src/index.js -o umd",
     "build-min": "cross-env NODE_ENV=production BABEL_ENV=commonjs webpack --entry ./src/index.js -o umd",
-    "test": "cross-env BABEL_ENV=test jest",
+    "test": "vitest run --config vitest.config.mts",
+    "test-coverage": "vitest run --config vitest.config.mts --coverage",
     "demo": "webpack serve --config demo/webpack.config.js --progress --profile",
     "autofix": "eslint src --fix",
     "lint": "eslint src"
@@ -63,9 +64,10 @@
     "@babel/preset-env": "^7.23.2",
     "@babel/preset-react": "^7.22.15",
     "@babel/runtime": "^7.23.2",
-    "@testing-library/dom": "^9.3.3",
-    "@testing-library/jest-dom": "^5.17.0",
-    "@testing-library/react": "^14.0.0",
+    "@testing-library/jest-dom": "^6.5.0",
+    "@testing-library/react": "^16.0.1",
+    "@vitejs/plugin-react": "^4.3.1",
+    "@vitest/coverage-v8": "^2.0.5",
     "babel-loader": "^9.1.3",
     "core-js": "^3.33.0",
     "cross-env": "^7.0.3",
@@ -76,14 +78,13 @@
     "eslint-plugin-jsx-a11y": "^6.7.1",
     "eslint-plugin-prettier": "^3.4.1",
     "eslint-plugin-react": "^7.33.2",
-    "jest": "^29.7.0",
-    "jest-environment-jsdom": "^29.7.0",
     "json-loader": "^0.5.7",
     "pre-commit": "^1.2.2",
     "prettier": "^2.8.8",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "typescript": "^5.5.4",
+    "vitest": "^2.0.5",
     "webpack": "^5.89.0",
     "webpack-bundle-analyzer": "^4.9.1",
     "webpack-cli": "^5.1.4",

test/index.spec.js → test/index.spec.jsx

@@ -1,10 +1,9 @@
-import '@testing-library/jest-dom';
 import React from 'react';
 import { render } from '@testing-library/react';
 import Animate from '../src';
 
 describe('Animate', () => {
-  it('Should change the style of children', (done) => {
+  it('Should change the style of children', done => {
     const { container } = render(
       <Animate from="1" to="0" attributeName="opacity" duration={500}>
         <div className="test-wrapper" />
@@ -23,20 +22,14 @@ describe('Animate', () => {
     }, 700);
   });
 
-  it('Should called onAnimationEnd', (done) => {
+  it('Should called onAnimationEnd', done => {
     let num = 0;
     const handleAnimationEnd = () => {
       num += 1;
     };
 
     render(
-      <Animate
-        from="1"
-        to="0"
-        attributeName="opacity"
-        duration={500}
-        onAnimationEnd={handleAnimationEnd}
-      >
+      <Animate from="1" to="0" attributeName="opacity" duration={500} onAnimationEnd={handleAnimationEnd}>
         <div />
       </Animate>,
     );
@@ -48,7 +41,7 @@ describe('Animate', () => {
     }, 700);
   });
 
-  it('Should change style as steps', (done) => {
+  it('Should change style as steps', done => {
     let firstStatus = 'no';
     let secondStatus = 'no';
 

test/vitest.setup.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom/vitest';

vitest.config.mts

@@ -0,0 +1,20 @@
+// eslint-disable-next-line import/no-unresolved
+import { defineConfig } from 'vitest/config';
+import react from '@vitejs/plugin-react';
+
+// https://vitejs.dev/config/
+// eslint-disable-next-line import/no-default-export
+export default defineConfig({
+  plugins: [react()],
+  test: {
+    environment: 'jsdom',
+    globals: true,
+    setupFiles: ['test/vitest.setup.ts'],
+    exclude: ['react-smooth', 'node_modules', 'dist', '.idea', '.git', '.cache', 'build', 'scripts', '.stryker-tmp'],
+    coverage: {
+      provider: 'v8',
+      include: ['src', 'test'],
+    },
+    restoreMocks: true,
+  },
+});