Add vitest and make some tests function #1379

package.json

@@ -68,7 +68,7 @@
     "serve:plugins": "node micro-frontend-tools/serve-plugins.js",
     "start": "cross-env concurrently \"yarn serve:plugins\" \"node server/auth-server.js\" \"react-scripts start\"",
     "build:e2e": "cross-env GENERATE_SOURCEMAP=false react-scripts build",
-    "test": "react-scripts test --env=jsdom --coverage --watchAll=false",
+    "test": "vitest --coverage",
     "test:watch": "react-scripts test --env=jsdom --watch",
     "e2e:serve": "yarn build:e2e && concurrently \"node server/auth-server.js e2e\" \"node ./server/e2e-test-server.js\"",
     "e2e:interactive": "start-server-and-test e2e:serve http://localhost:3000 cy:open",
@@ -121,18 +121,21 @@
     "@types/redux-mock-store": "1.0.2",
     "@typescript-eslint/eslint-plugin": "7.0.2",
     "@typescript-eslint/parser": "7.0.2",
+    "@vitest/coverage-v8": "^1.3.1",
     "axios-mock-adapter": "1.22.0",
     "concurrently": "8.2.0",
     "cors": "2.8.5",
     "cross-env": "7.0.3",
     "cypress": "13.6.4",
     "eslint": "8.56.0",
     "eslint-config-react-app": "7.0.0",
+    "jsdom": "^24.0.0",
     "lint-staged": "15.2.0",
     "redux-mock-store": "1.5.4",
     "serve": "14.2.0",
     "start-server-and-test": "2.0.0",
+    "vitest": "^1.3.1",
     "wait-on": "7.2.0"
   },
   "packageManager": "[email protected]"
-}
+}

src/setupTests.ts

@@ -10,26 +10,26 @@ if (typeof window.URL.createObjectURL === 'undefined') {
 
 Object.defineProperty(window, 'matchMedia', {
   writable: true,
-  value: jest.fn().mockImplementation((query) => ({
+  value: vi.fn().mockImplementation((query) => ({
     matches: false,
     media: query,
     onchange: null,
-    addListener: jest.fn(),
-    removeListener: jest.fn(),
-    addEventListener: jest.fn(),
-    removeEventListener: jest.fn(),
-    dispatchEvent: jest.fn(),
+    addListener: vi.fn(),
+    removeListener: vi.fn(),
+    addEventListener: vi.fn(),
+    removeEventListener: vi.fn(),
+    dispatchEvent: vi.fn(),
   })),
 });
 
 export const flushPromises = (): Promise<void> =>
   new Promise(jest.requireActual('timers').setImmediate);
 
 // globally mock as we never want to actually call single-spa funcs in unit tests
-jest.mock('single-spa', () => ({
-  unloadApplication: jest.fn(),
-  start: jest.fn(),
-  getAppStatus: jest.fn(),
-  triggerAppChange: jest.fn(),
+vi.mock('single-spa', () => ({
+  unloadApplication: vi.fn(),
+  start: vi.fn(),
+  getAppStatus: vi.fn(),
+  triggerAppChange: vi.fn(),
   NOT_LOADED: 'NOT_LOADED',
 }));

vite.config.ts

@@ -47,18 +47,18 @@ export default defineConfig(({ command, mode }) => {
     test: {
       globals: 'true',
       environment: 'jsdom',
-      globalSetup: './globalSetup.js',
-      setupFiles: ['src/setupTests.tsx'],
+      // globalSetup: './globalSetup.js',
+      setupFiles: ['src/setupTests.ts'],
       coverage: {
         exclude: [
           'public/*',
           'server/*',
           // Leave handlers to show up unused code
-          'src/mocks/browser.ts',
-          'src/mocks/server.ts',
-          'src/vite-env.d.ts',
-          'src/main.tsx',
-          'src/testUtils.tsx',
+          // 'src/mocks/browser.ts',
+          // 'src/mocks/server.ts',
+          // 'src/vite-env.d.ts',
+          // 'src/main.tsx',
+          // 'src/testUtils.tsx',
         ],
       },
     },