feat: replace jest with vitest

products/statement-generator/package.json

@@ -25,12 +25,14 @@
     "react-router-dom": "^5.2.0",
     "react-scripts": "5.0.1",
     "typescript": "^4.0.3",
+    "vite": "^7.1.5",
+    "vite-tsconfig-paths": "^5.1.4",
     "web-vitals": "^0.2.4"
   },
   "scripts": {
     "start": "react-scripts start",
     "build": "react-scripts build",
-    "test": "react-scripts test",
+    "test": "vitest run",
     "eject": "react-scripts eject",
     "lint:fix": "prettier --write src/ && eslint --fix src/",
     "predeploy": "npm run build",
@@ -57,7 +59,6 @@
     "@testing-library/react": "^11.2.7",
     "@testing-library/user-event": "^12.8.3",
     "@types/file-saver": "^2.0.5",
-    "@types/jest": "^27.5.2",
     "@types/jspdf": "^1.3.3",
     "@types/node": "^20.4.1",
     "@types/react": "^16.14.61",
@@ -74,7 +75,7 @@
     "eslint-plugin-prettier": "^3.2.0",
     "eslint-plugin-react": "^7.21.5",
     "eslint-plugin-react-hooks": "^4.2.0",
-    "jest": "^27.5.1",
-    "prettier": "^2.2.1"
+    "prettier": "^2.2.1",
+    "vitest": "^3.2.4"
   }
 }

products/statement-generator/src/__tests__/buttons.test.tsx

@@ -1,6 +1,5 @@
 import React from 'react';
 import { render, fireEvent } from '@testing-library/react';
-import '@testing-library/jest-dom';
 import ButtonComponent from 'components/Button';
 import userEvent from '@testing-library/user-event';
 
@@ -16,7 +15,7 @@ describe('Button component', () => {
 
   // Test that clicking the button triggers the onClick function (if provided)
   test('Button click triggers onClick function', () => {
-    const mockOnClick = jest.fn();
+    const mockOnClick = vi.fn();
 
     const { getByText } = render(
       <ButtonComponent buttonText="Click Me" onClick={mockOnClick} />

products/statement-generator/src/__tests__/checkboxes.test.tsx

@@ -1,6 +1,5 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import '@testing-library/jest-dom';
 import userEvent from '@testing-library/user-event';
 
 import Checkbox from '../components/Checkbox';
@@ -11,7 +10,7 @@ interface CheckboxProps {
   label: string;
 }
 
-const checkboxMock = jest.fn();
+const checkboxMock = vi.fn();
 
 const TestCheckbox: React.FC<CheckboxProps> = ({ id, label }) => {
   const [checked, setChecked] = React.useState(false);

products/statement-generator/src/__tests__/inputs.test.tsx

@@ -1,6 +1,5 @@
 import React from 'react';
 import { render, fireEvent } from '@testing-library/react';
-import '@testing-library/jest-dom';
 import userEvent from '@testing-library/user-event';
 
 import { ThemeProvider } from '@material-ui/core/styles';

products/statement-generator/src/__tests__/progressbar.test.tsx

@@ -1,6 +1,5 @@
 import React from 'react';
 import { render, screen } from '@testing-library/react';
-import '@testing-library/jest-dom';
 import ProgressBar from 'components/ProgressBar';
 
 describe('Progress Bar', () => {

products/statement-generator/src/__tests__/radiobuttons.test.tsx

@@ -1,6 +1,5 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import '@testing-library/jest-dom';
 import userEvent from '@testing-library/user-event';
 
 import { ThemeProvider } from '@material-ui/core/styles';
@@ -16,7 +15,7 @@ export interface TestRadioGroupProps {
   label: string;
 }
 
-const radioButtonMock = jest.fn();
+const radioButtonMock = vi.fn();
 
 const TestRadioGroup: React.FC<TestRadioGroupProps> = ({ id, label }) => {
   const [selected, setSelected] = React.useState<Choice | null>(null);

products/statement-generator/src/__tests__/routing.test.tsx

@@ -1,6 +1,5 @@
 import React from 'react';
 import { render, screen, fireEvent } from '@testing-library/react';
-import '@testing-library/jest-dom';
 import { MemoryRouter as Router } from 'react-router-dom';
 import { act } from 'react-dom/test-utils';
 import App from '../App';
@@ -13,24 +12,24 @@ const MODAL_FADE_MS = 500;
 const confirmModalAndFFW = (text = 'continue', ms = MODAL_FADE_MS) => {
   fireEvent.click(screen.getByText(new RegExp(text, 'i')));
   act(() => {
-    jest.advanceTimersByTime(ms);
+    vi.advanceTimersByTime(ms);
   });
 };
 
 describe('Routing Tests', () => {
   beforeAll(() => {
     // Control time so we can fastforward MUI transition durations
-    jest.useFakeTimers();
-    console.warn = jest.fn();
+    vi.useFakeTimers();
+    console.warn = vi.fn();
   });
 
   afterAll(() => {
-    jest.useRealTimers();
+    vi.useRealTimers();
   });
 
   beforeEach(() => {
     // mock the scrollTo component
-    window.scrollTo = jest.fn();
+    window.scrollTo = vi.fn();
   });
 
   test('it can render a component that uses useLocation', () => {

products/statement-generator/src/__tests__/textareas.test.tsx

@@ -1,6 +1,5 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import '@testing-library/jest-dom';
 import userEvent from '@testing-library/user-event';
 
 import { ThemeProvider } from '@material-ui/core/styles';

products/statement-generator/src/setupTests.js

@@ -1,4 +1,4 @@
-import '@testing-library/jest-dom';
+import '@testing-library/jest-dom/vitest';
 
 // Override console.warn to suppress specific warnings
 const originalWarn = console.warn;
@@ -13,13 +13,13 @@ console.warn = (...args) => {
   }
 };
 
-jest.mock('react-i18next', () => {
-  const actual = jest.requireActual('react-i18next');
+vi.mock(import('react-i18next'), async (importOriginal) => {
+  const actual = await importOriginal();
   return {
     ...actual,
     useTranslation: () => ({
       t: (key) => key,
-      i18n: { changeLanguage: jest.fn(), language: 'en' },
+      i18n: { changeLanguage: vi.fn(), language: 'en' },
     }),
     Trans: ({ children, i18nKey }) => children || i18nKey || null,
   };

products/statement-generator/tsconfig.json

@@ -2,6 +2,7 @@
   "compilerOptions": {
     "baseUrl": "src",
     "target": "es5",
+    "types": ["vitest/globals"],
     "lib": ["dom", "dom.iterable", "esnext"],
     "allowJs": true,
     "skipLibCheck": true,

products/statement-generator/vitest.config.ts

@@ -0,0 +1,13 @@
+/* eslint-disable import/no-extraneous-dependencies */
+import { defineConfig } from 'vitest/config';
+import tsconfigPaths from 'vite-tsconfig-paths';
+
+export default defineConfig({
+  plugins: [tsconfigPaths()],
+  test: {
+    include: ['**/**.test.ts(x)?'],
+    globals: true,
+    environment: 'jsdom',
+    setupFiles: ['./src/setupTests.js'],
+  },
+});