test: migrate unit test to vitest

.eslintrc.json

@@ -5,7 +5,8 @@
   "extends": [
     "@code-pushup/eslint-config/typescript",
     "@code-pushup/eslint-config/node",
-    "@code-pushup/eslint-config/jest"
+    "@code-pushup/eslint-config/jest",
+    "@code-pushup/eslint-config/vitest"
   ],
   "settings": {
     "import/resolver": {

nx.json

@@ -43,6 +43,10 @@
           "codeCoverage": true
         }
       }
+    },
+    "@nx/vite:test": {
+      "cache": true,
+      "inputs": ["default", "^production"]
     }
   },
   "generators": {

package.json

@@ -48,20 +48,26 @@
     "@nx/eslint": "17.1.1",
     "@nx/eslint-plugin": "17.1.1",
     "@nx/jest": "17.1.1",
-    "@nx/js": "17.1.1",
+    "@nx/js": "17.3.2",
     "@nx/plugin": "17.1.1",
-    "@nx/web": "17.1.1",
+    "@nx/vite": "^17.3.2",
+    "@nx/web": "17.3.2",
     "@nx/webpack": "17.1.1",
     "@nx/workspace": "17.1.1",
     "@push-based/node-cli-testing": "^0.2.3",
     "@push-based/user-flow": "^0.19.0",
     "@rx-angular/import-graph-visualizer": "^0.2.0",
+    "@swc-node/register": "~1.6.7",
+    "@swc/core": "~1.3.85",
+    "@swc/helpers": "~0.5.2",
     "@types/compression": "^1.7.2",
     "@types/express": "^4.17.14",
     "@types/jest": "29.4.4",
     "@types/node": "^18.11.9",
     "@typescript-eslint/eslint-plugin": "^6.10.0",
     "@typescript-eslint/parser": "^6.10.0",
+    "@vitest/coverage-v8": "^1.0.4",
+    "@vitest/ui": "^1.0.4",
     "babel-jest": "^29.4.1",
     "cli-prompts-test": "^0.3.0",
     "commitlint": "^16.3.0",
@@ -76,6 +82,7 @@
     "eslint-plugin-promise": "^6.1.1",
     "eslint-plugin-sonarjs": "^0.24.0",
     "eslint-plugin-unicorn": "^51.0.1",
+    "eslint-plugin-vitest": "^0.3.26",
     "graphql": "^16.8.1",
     "http-server": "^14.1.1",
     "husky": "^7.0.0",
@@ -87,6 +94,8 @@
     "rimraf": "^3.0.2",
     "ts-jest": "29.1.0",
     "typescript": "^4.9.3",
+    "vite": "^5.0.0",
+    "vitest": "^1.0.4",
     "zod": "^3.22.4"
   }
 }

packages/cli/project.json

@@ -8,9 +8,7 @@
       "executor": "@nx/eslint:lint",
       "outputs": ["{options.outputFile}"],
       "options": {
-        "lintFilePatterns": [
-          "packages/cli/**/*"
-        ]
+        "lintFilePatterns": ["packages/cli/**/*"]
       }
     },
     "build": {
@@ -29,18 +27,11 @@
         ]
       }
     },
-    "sandbox": {
-      "executor": "@nx/jest:jest",
-      "outputs": ["{workspaceRoot}/coverage/packages/cli"],
-      "options": {
-        "jestConfig": "packages/cli/jest.config.ts"
-      }
-    },
     "test": {
-      "executor": "@nx/jest:jest",
+      "executor": "@nx/vite:test",
       "outputs": ["{workspaceRoot}/coverage/packages/cli"],
       "options": {
-        "jestConfig": "packages/cli/jest.config.ts"
+        "config": "{workspaceRoot}/packages/cli/vite.config.ts"
       }
     },
     "version": {

packages/cli/src/lib/commands/assert/utils/__snapshots__/md-report.unit.test.ts.snap

@@ -1,14 +1,14 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`md-table should print MD table if getStepsTable is called with a reduced result 1`] = `
+exports[`md-table > should print MD table if getStepsTable is called with a reduced result 1`] = `
 "| Step Name                      | Gather Mode | Performance | Accessibility | Best Practices | Seo | Pwa |
 | :----------------------------- | :---------: | :---------: | :-----------: | :------------: | :-: | :-: |
 | Navigation report (127.0.0.1/) | navigation  |      -      |      100      |       92       | 100 | 30  |
 | Timespan report (127.0.0.1/)   |  timespan   |    10/11    |       -       |      5/7       |  -  |  -  |
 | Snapshot report (127.0.0.1/)   |  snapshot   |    Ø 3/4    |     10/10     |      4/5       | 9/9 |  -  |"
 `;
 
-exports[`md-table should return a Md table comparing to reports if getStepsTable is passed a baseline report 1`] = `
+exports[`md-table > should return a Md table comparing to reports if getStepsTable is passed a baseline report 1`] = `
 "| Step Name                      | Gather Mode | Performance | Accessibility | Best Practices |   Seo    |   Pwa    |
 | :----------------------------- | :---------: | :---------: | :-----------: | :------------: | :------: | :------: |
 | Navigation report (127.0.0.1/) | navigation  |      -      |      100      |    92 (-7)     |   100    | 30 (+32) |

packages/cli/src/lib/commands/assert/utils/md-report.ts

@@ -1,11 +1,11 @@
-import { FractionResults, GatherMode, ReducedFlowStep, ReducedReport } from '../../collect/utils/report/types';
-import { enrichReducedReportWithBaseline } from '../../collect/utils/report/utils';
-import { Alignment, table } from '../../../core/md/table';
-import { style } from '../../../core/md/font-style';
-import { headline, Hierarchy } from '../../../core/md/headline';
-import { NEW_LINE } from '../../../core/md/constants';
-import { details } from '../../../core/md/details';
-import Details from 'lighthouse/types/lhr/audit-details';
+import {FractionResults, GatherMode, ReducedFlowStep, ReducedReport} from '../../collect/utils/report/types';
+import {enrichReducedReportWithBaseline} from '../../collect/utils/report/utils';
+import {Alignment, table} from '../../../core/md/table';
+import {style} from '../../../core/md/font-style';
+import {headline, Hierarchy} from '../../../core/md/headline';
+import {NEW_LINE} from '../../../core/md/constants';
+import {details} from '../../../core/md/details';
+import Details from "lighthouse/types/lhr/audit-details.d";
 import Table = Details.Table;
 
 const budgetsSymbol = '🔒'

packages/cli/src/lib/commands/assert/utils/md-report.unit.test.ts

@@ -1,5 +1,6 @@
+import { describe, expect, it } from 'vitest';
 import { getBudgetTable, getStepsTable } from './md-report';
-import FlowResult from 'lighthouse/types/lhr/flow';
+import FlowResult from 'lighthouse/types/lhr/flow.d';
 import { getReportContent } from 'test-data';
 import { ReducedReport } from '../../collect/utils/report/types';
 import { createReducedReport, enrichReducedReportWithBaseline } from '../../collect/utils/report/utils';

packages/cli/src/lib/commands/collect/utils/persist/open-report.ts

@@ -1,4 +1,4 @@
-import * as openReport from 'open';
+import openReport from 'open';
 import { logVerbose } from '../../../../core/loggin';
 import { CollectCommandOptions } from '../../options';
 

packages/cli/src/lib/commands/collect/utils/persist/open-report.unit.test.ts

@@ -1,15 +1,16 @@
-import * as openReport from 'open';
+import {vi, describe, expect, beforeEach, it } from 'vitest';
+import openReport from 'open';
 import { handleOpenFlowReports, openFlowReports } from './open-report';
 import { logVerbose } from '../../../../core/loggin';
 import { CollectCommandOptions } from '../../options';
 
-jest.mock('open');
-jest.mock('../../../../core/loggin');
+vi.mock('open');
+vi.mock('../../../../core/loggin');
 
 describe('handleOpenFlowReport', () => {
 
   beforeEach(() => {
-    jest.clearAllMocks();
+    vi.clearAllMocks();
   })
 
   it('should return the openFlowReport function if openReport, interactive and not dryRun', async () => {
@@ -52,7 +53,7 @@ describe('handleOpenFlowReport', () => {
 describe('openReports', () => {
 
   beforeEach(() => {
-    jest.clearAllMocks();
+    vi.clearAllMocks();
   });
 
   it('should not open the report if no file name is passed', async () => {

packages/cli/src/lib/commands/collect/utils/persist/persist-flow.unit.test.ts

@@ -1,3 +1,4 @@
+import { describe, expect, it, beforeEach, vi } from 'vitest';
 import { generateStdoutReport } from './utils';
 import { createReducedReport } from '../report/utils';
 import { generateMdReport } from '../../../assert/utils/md-report';
@@ -8,31 +9,31 @@ import { log } from '../../../../core/loggin';
 import type { ReducedReport } from '../report/types';
 import type { UserFlow } from '../../../../hacky-things/lighthouse';
 
-jest.mock('node:fs', () => ({
-  existsSync: jest.fn().mockReturnValue(true)
+vi.mock('node:fs', () => ({
+  existsSync: vi.fn().mockReturnValue(true)
 }));
-jest.mock('../../../../hacky-things/lighthouse')
-jest.mock('../../../../core/file');
-jest.mock('../../../../core/loggin');
-jest.mock('./utils');
-jest.mock('../../../assert/utils/md-report', () => ({
-  generateMdReport: jest.fn().mockReturnValue('Mock Md Report')
+vi.mock('../../../../hacky-things/lighthouse')
+vi.mock('../../../../core/file');
+vi.mock('../../../../core/loggin');
+vi.mock('./utils');
+vi.mock('../../../assert/utils/md-report', () => ({
+  generateMdReport: vi.fn().mockReturnValue('Mock Md Report')
 }));
-jest.mock('../report/utils', () => ({
-  createReducedReport: jest.fn(),
-  toReportName: jest.fn().mockReturnValue('report'),
+vi.mock('../report/utils', () => ({
+  createReducedReport: vi.fn(),
+  toReportName: vi.fn().mockReturnValue('report'),
 }));
 
 const flow = {
   name: 'flow-name',
-  createFlowResult: jest.fn(),
-  generateReport: jest.fn()
+  createFlowResult: vi.fn(),
+  generateReport: vi.fn()
 } satisfies UserFlow;
 
 describe('persist flow reports in specified format', () => {
 
   beforeEach(() => {
-    jest.clearAllMocks();
+    vi.clearAllMocks();
   });
 
   it('should not save any reports if no format is given', async () => {
@@ -51,20 +52,20 @@ describe('persist flow reports in specified format', () => {
   });
 
   it('should log a report if stdout is passed as format', async () => {
-    const generateStdoutReportSpy = jest.mocked(generateStdoutReport).mockReturnValue('Mock stdout report')
+    const generateStdoutReportSpy = vi.mocked(generateStdoutReport).mockReturnValue('Mock stdout report')
     await persistFlow(flow, { outPath: '', format: ['stdout'], url: 'mock.com' });
     expect(generateStdoutReportSpy).toHaveBeenCalled();
     expect(log).toHaveBeenCalledWith('Mock stdout report');
   });
 
   it('should extract a json report from UserFlow if json is given as format', async () => {
-    const createFlowResultSpy = jest.spyOn(flow, 'createFlowResult');
+    const createFlowResultSpy = vi.spyOn(flow, 'createFlowResult');
     await persistFlow(flow, { outPath: '', format: ['json'], url: 'mock.com' });
     expect(createFlowResultSpy).toHaveBeenCalled();
   });
 
   it('should save the report in json if json is given as format', async () => {
-    jest.spyOn(flow, 'createFlowResult').mockResolvedValue({mock: 'jsonResult'});
+    vi.spyOn(flow, 'createFlowResult').mockResolvedValue({mock: 'jsonResult'});
     await persistFlow(flow, { outPath: '', format: ['json'], url: 'mock.com' });
     expect(writeFile).toHaveBeenCalledWith('report.json', JSON.stringify({mock: 'jsonResult'}));
   });
@@ -75,13 +76,13 @@ describe('persist flow reports in specified format', () => {
   });
 
   it('should extract an html report from UserFlow if html is given as format', async () => {
-    const generateReportSpy = jest.spyOn(flow, 'generateReport');
+    const generateReportSpy = vi.spyOn(flow, 'generateReport');
     await persistFlow(flow, { outPath: '', format: ['html'], url: 'mock.com' });
     expect(generateReportSpy).toHaveBeenCalled();
   });
 
   it('should save the report in html if html is given as format', async () => {
-    jest.spyOn(flow, 'generateReport').mockResolvedValue('Mock HTML Report');
+    vi.spyOn(flow, 'generateReport').mockResolvedValue('Mock HTML Report');
     await persistFlow(flow, { outPath: '', format: ['html'], url: 'mock.com' });
     expect(writeFile).toHaveBeenCalledWith('report.html', 'Mock HTML Report');
   });
@@ -92,9 +93,9 @@ describe('persist flow reports in specified format', () => {
   });
 
   it('should extract an md report from the json report if md is given as format', async () => {
-    jest.spyOn(flow, 'createFlowResult').mockResolvedValue({mock: 'base for md report'});
-    const createReducedReportSpy = jest.mocked(createReducedReport).mockReturnValue({mock: 'reduced report'} as any as ReducedReport);
-    const generateMdReportMock = jest.mocked(generateMdReport);
+    vi.spyOn(flow, 'createFlowResult').mockResolvedValue({mock: 'base for md report'});
+    const createReducedReportSpy = vi.mocked(createReducedReport).mockReturnValue({mock: 'reduced report'} as any as ReducedReport);
+    const generateMdReportMock = vi.mocked(generateMdReport);
     await persistFlow(flow, { outPath: '', format: ['md'], url: 'mock.com' });
     expect(createReducedReportSpy).toHaveBeenCalledWith({mock: 'base for md report'})
     expect(generateMdReportMock).toHaveBeenCalledWith({mock: 'reduced report'});

packages/cli/src/lib/commands/collect/utils/replay/parse.test.ts

@@ -1,3 +1,4 @@
+import { describe, expect, it } from 'vitest';
 import { parse } from './parse';
 import { getReportContent } from 'test-data';
 
@@ -17,5 +18,4 @@ describe('replay', () => {
 
     expect(parse(userFlowReplay)).toEqual(userFlowReplay);
   });
-
 });