Migrate tests to vitest

gilbarbara · Oct 21, 2023 · b2dc6b7 · b2dc6b7
1 parent c5529c0
commit b2dc6b7
Show file tree

Hide file tree

Showing 15 changed files with 475 additions and 372 deletions.
diff --git a/package.json b/package.json
@@ -6,17 +6,16 @@
     "@gilbarbara/prettier-config": "^1.0.0",
     "@gilbarbara/tsconfig": "^0.2.3",
     "@size-limit/preset-small-lib": "^9.0.0",
-    "@types/jest": "^29.5.5",
     "@types/node": "^20.8.6",
+    "@vitest/coverage-v8": "^0.34.6",
     "del-cli": "^5.1.0",
     "fast-glob": "^3.3.1",
+    "happy-dom": "^12.9.1",
     "husky": "^8.0.3",
-    "jest": "^29.7.0",
-    "jest-environment-jsdom": "^29.7.0",
+    "is-ci-cli": "^2.2.0",
     "lerna": "^7.3.1",
     "repo-tools": "^0.2.2",
     "size-limit": "^9.0.0",
-    "ts-jest": "^29.1.1",
     "ts-node": "^10.9.1",
     "tsup": "^7.2.0",
     "typescript": "^5.2.2"

diff --git a/packages/tree-changes-hook/jest.config.ts b/packages/tree-changes-hook/jest.config.ts
diff --git a/packages/tree-changes-hook/package.json b/packages/tree-changes-hook/package.json
@@ -45,16 +45,17 @@
     "@types/react": "^18.2.28",
     "@types/react-dom": "^18.2.13",
     "react": "^18.2.0",
-    "react-dom": "^18.2.0"
+    "react-dom": "^18.2.0",
+    "vitest": "^0.34.6"
   },
   "scripts": {
     "build": "npm run clean && tsup && ts-node scripts/fix-cjs.ts",
     "watch": "tsup --watch",
     "clean": "del dist/*",
     "lint": "eslint src test",
-    "test": "jest",
-    "test:coverage": "jest --coverage --bail",
-    "test:watch": "jest --watchAll --verbose",
+    "test": "is-ci \"test:coverage\" \"test:watch\"",
+    "test:coverage": "vitest run --coverage",
+    "test:watch": "vitest watch",
     "typecheck": "tsc --noEmit",
     "format": "prettier \"**/*.{js,jsx,json,yml,yaml,css,less,scss,ts,tsx,md,graphql,mdx}\" --write",
     "validate": "npm run lint && npm run typecheck && npm run test:coverage && npm run build && npm run size",

diff --git a/packages/tree-changes-hook/test/__global.d.ts b/packages/tree-changes-hook/test/__global.d.ts
@@ -0,0 +1 @@
+import 'vitest/globals';
diff --git a/packages/tree-changes-hook/test/__snapshots__/index.spec.tsx.snap b/packages/tree-changes-hook/test/__snapshots__/index.spec.tsx.snap
@@ -1,6 +1,6 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`useTreeChanges with state 1`] = `
+exports[`useTreeChanges > with state 1`] = `
 <div
   data-testid="app"
 >
@@ -22,7 +22,7 @@ exports[`useTreeChanges with state 1`] = `
 </div>
 `;
 
-exports[`useTreeChanges with state 2`] = `
+exports[`useTreeChanges > with state 2`] = `
 <div
   data-testid="app"
 >

diff --git a/packages/tree-changes-hook/test/index.spec.tsx b/packages/tree-changes-hook/test/index.spec.tsx
@@ -1,14 +1,14 @@
-import * as React from 'react';
+import { useEffect, useState } from 'react';
 import { act } from 'react-dom/test-utils';
 import { fireEvent, render, screen } from '@testing-library/react';
 
 import useTreeChanges from '../src';
 
-jest.useFakeTimers();
+vi.useFakeTimers();
 
-const mockState = jest.fn();
-const mockRatio = jest.fn();
-const mockSize = jest.fn();
+const mockState = vi.fn();
+const mockRatio = vi.fn();
+const mockSize = vi.fn();
 
 interface State {
   count: number;
@@ -18,21 +18,21 @@ interface State {
 }
 
 function WithState() {
-  const [state, setState] = React.useState<State>({
+  const [state, setState] = useState<State>({
     count: 0,
     isActive: false,
     isReady: false,
     milestones: [],
   });
   const { added, changed, emptied, filled, removed } = useTreeChanges(state);
 
-  React.useEffect(() => {
+  useEffect(() => {
     setTimeout(() => {
       setState(s => ({ ...s, isActive: true }));
     }, 1500);
   }, []);
 
-  React.useEffect(() => {
+  useEffect(() => {
     if (changed('isActive', true)) {
       setState(s => ({ ...s, isReady: true }));
 
@@ -99,7 +99,7 @@ function WithState() {
 function WithProps(props: any) {
   const { changed } = useTreeChanges(props);
 
-  React.useEffect(() => {
+  useEffect(() => {
     if (changed('ratio')) {
       mockRatio();
     }
@@ -148,7 +148,7 @@ describe('useTreeChanges', () => {
     expect(screen.getByTestId('app')).toMatchSnapshot();
 
     act(() => {
-      jest.runOnlyPendingTimers();
+      vi.runAllTimers();
     });
 
     expect(mockState).toHaveBeenCalledWith('changes:isActive');

diff --git a/packages/tree-changes-hook/test/tsconfig.json b/packages/tree-changes-hook/test/tsconfig.json
@@ -0,0 +1,8 @@
+{
+  "extends": "../tsconfig",
+  "compilerOptions": {
+    "noUnusedLocals": false,
+    "module": "esnext"
+  },
+  "include": ["**/*"]
+}
diff --git a/packages/tree-changes-hook/vitest.config.ts b/packages/tree-changes-hook/vitest.config.ts
@@ -0,0 +1,18 @@
+import { defineConfig } from 'vitest/config';
+
+export default defineConfig({
+  test: {
+    coverage: {
+      all: true,
+      include: ['src/**/*.ts?(x)'],
+      provider: 'v8',
+      statements: 90,
+      branches: 90,
+      functions: 90,
+      lines: 90,
+      reporter: ['text', 'lcov'],
+    },
+    environment: 'happy-dom',
+    globals: true,
+  },
+});
diff --git a/packages/tree-changes/jest.config.ts b/packages/tree-changes/jest.config.ts
diff --git a/packages/tree-changes/package.json b/packages/tree-changes/package.json
@@ -15,7 +15,7 @@
   "bugs": {
     "url": "https://github.com/gilbarbara/tree-changes/issues"
   },
-  "homepage": "https://github.com/gilbarbara/tree-changes#readme",
+  "homepage": "https://github.com/gilbarbara/tree-changes/tree/main/packages/tree-changes#readme",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
   "exports": {
@@ -34,14 +34,17 @@
     "@gilbarbara/deep-equal": "^0.3.1",
     "is-lite": "^1.2.0"
   },
+  "devDependencies": {
+    "vitest": "^0.34.6"
+  },
   "scripts": {
     "build": "npm run clean && tsup && ts-node scripts/fix-cjs.ts",
     "watch": "tsup --watch",
     "clean": "del dist/*",
     "lint": "eslint src test",
-    "test": "jest",
-    "test:coverage": "jest --coverage --bail",
-    "test:watch": "jest --watchAll --verbose",
+    "test": "is-ci \"test:coverage\" \"test:watch\"",
+    "test:coverage": "vitest run --coverage",
+    "test:watch": "vitest watch",
     "typecheck": "tsc --noEmit",
     "format": "prettier \"**/*.{js,jsx,json,yml,yaml,css,less,scss,ts,tsx,md,graphql,mdx}\" --write",
     "validate": "npm run lint && npm run typecheck && npm run test:coverage && npm run build && npm run size",

diff --git a/packages/tree-changes/test/__global.d.ts b/packages/tree-changes/test/__global.d.ts
@@ -0,0 +1 @@
+import 'vitest/globals';
diff --git a/packages/tree-changes/test/__snapshots__/helpers.spec.ts.snap b/packages/tree-changes/test/__snapshots__/helpers.spec.ts.snap
@@ -1,6 +1,6 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`getIterables should get iterables 1`] = `
+exports[`getIterables > should get iterables 1`] = `
 [
   [],
   [
@@ -11,7 +11,7 @@ exports[`getIterables should get iterables 1`] = `
 ]
 `;
 
-exports[`getIterables should get iterables 2`] = `
+exports[`getIterables > should get iterables 2`] = `
 [
   [],
   [
@@ -21,7 +21,7 @@ exports[`getIterables should get iterables 2`] = `
 ]
 `;
 
-exports[`getIterables should get iterables 3`] = `
+exports[`getIterables > should get iterables 3`] = `
 [
   "idle",
   "done",

diff --git a/packages/tree-changes/test/tsconfig.json b/packages/tree-changes/test/tsconfig.json
@@ -0,0 +1,8 @@
+{
+  "extends": "../tsconfig",
+  "compilerOptions": {
+    "noUnusedLocals": false,
+    "module": "esnext"
+  },
+  "include": ["**/*"]
+}
diff --git a/packages/tree-changes/vitest.config.ts b/packages/tree-changes/vitest.config.ts
@@ -0,0 +1,19 @@
+import { defineConfig } from 'vitest/config';
+
+export default defineConfig({
+  test: {
+    coverage: {
+      all: true,
+      include: ['src/**/*.ts?(x)'],
+      exclude: ['src/**/types.ts'],
+      provider: 'v8',
+      statements: 90,
+      branches: 90,
+      functions: 90,
+      lines: 90,
+      reporter: ['text', 'lcov'],
+    },
+    environment: 'happy-dom',
+    globals: true,
+  },
+});