@itwin/reports-config-widget-react 0.8.2 → 0.9.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itwin/reports-config-widget-react",
-  "version": "0.8.2",
+  "version": "0.9.0",
   "description": "An iTwin.js 3D Viewer Widget that interfaces with the iTwin Reporting Platform.",
   "keywords": [
     "Bentley",
@@ -34,29 +34,12 @@
     "cover": "npm test -- --coverage",
     "dual-build": "npm run -s build:cjs && npm run -s build:esm",
     "extract-api": "betools extract-api --entry=reports-config-widget-react --apiReportFolder=./api --apiReportTempFolder=./api/temp --apiSummaryFolder=./api",
-    "lint": "eslint -f visualstudio \"./src/**/*.{ts,tsx}\" 1>&2",
+    "lint": "eslint \"./src/**/*.{ts,tsx}\" 1>&2",
     "lint:fix": "npm run lint -- --fix",
     "pseudolocalize": "betools pseudolocalize --englishDir ./public/locales/en --out ./public/locales/en-PSEUDO",
     "rebuild": "npm run clean && npm run build",
-    "test": "jest",
-    "test:watch": "jest --watch "
-  },
-  "eslintConfig": {
-    "plugins": [
-      "@itwin"
-    ],
-    "extends": [
-      "plugin:@itwin/ui",
-      "prettier"
-    ],
-    "rules": {
-      "no-duplicate-imports": "off",
-      "@typescript-eslint/consistent-type-imports": "error",
-      "deprecation/deprecation": "error",
-      "jsx-a11y/no-static-element-interactions": "off",
-      "jsx-a11y/click-events-have-key-events": "off",
-      "jsx-a11y/anchor-is-valid": "off"
-    }
+    "test": "vitest run",
+    "test:watch": "vitest"
   },
   "dependencies": {
     "@itwin/imodels-access-common": "^4.1.4",
@@ -71,65 +54,58 @@
   },
   "devDependencies": {
     "@faker-js/faker": "6.2.0",
-    "@itwin/appui-abstract": "^4.0.0",
-    "@itwin/appui-layout-react": "^4.0.0",
-    "@itwin/appui-react": "^4.0.0",
-    "@itwin/build-tools": "^4.0.0",
-    "@itwin/components-react": "^4.0.0",
-    "@itwin/core-bentley": "^4.0.0",
-    "@itwin/core-common": "^4.0.0",
-    "@itwin/core-frontend": "^4.0.0",
-    "@itwin/core-geometry": "^4.0.0",
-    "@itwin/core-markup": "^4.0.0",
-    "@itwin/core-orbitgt": "^4.0.0",
-    "@itwin/core-quantity": "^4.0.0",
-    "@itwin/core-react": "^4.0.0",
-    "@itwin/core-telemetry": "^4.0.0",
-    "@itwin/ecschema-metadata": "^4.0.0",
-    "@itwin/eslint-plugin": "^3.7.8",
-    "@itwin/imodel-components-react": "^4.0.0",
-    "@itwin/presentation-common": "^4.0.0",
-    "@itwin/presentation-frontend": "^4.0.0",
-    "@itwin/webgl-compatibility": "^4.0.0",
+    "@itwin/appui-abstract": "^5.6.0",
+    "@itwin/appui-react": "^5.6.0",
+    "@itwin/build-tools": "^5.6.0",
+    "@itwin/components-react": "^5.6.0",
+    "@itwin/core-bentley": "^5.6.0",
+    "@itwin/core-common": "^5.6.0",
+    "@itwin/core-frontend": "^5.6.0",
+    "@itwin/core-geometry": "^5.6.0",
+    "@itwin/core-markup": "^5.6.0",
+    "@itwin/core-orbitgt": "^5.6.0",
+    "@itwin/core-quantity": "^5.6.0",
+    "@itwin/core-react": "^5.6.0",
+    "@itwin/ecschema-metadata": "^5.6.0",
+    "@itwin/eslint-plugin": "^6.0.0",
+    "@itwin/imodel-components-react": "^5.6.0",
+    "@itwin/presentation-common": "^5.6.0",
+    "@itwin/presentation-frontend": "^5.6.0",
+    "@itwin/webgl-compatibility": "^5.6.0",
     "@testing-library/dom": "^8.12.0",
-    "@testing-library/jest-dom": "^5.16.3",
+    "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^12.1.4",
     "@testing-library/user-event": "^14.1.1",
     "@types/chai": "4.2.11",
     "@types/i18next": "^8.4.2",
-    "@types/jest": "^27.4.1",
     "@types/node": "^14.14.20",
     "@types/react": "^17.0.19",
     "@types/react-dom": "^17.0.9",
     "@types/react-table": "^7.7.0",
-    "@types/testing-library__jest-dom": "^5.14.3",
-    "@typescript-eslint/eslint-plugin": "^5.3.1",
-    "@typescript-eslint/parser": "^5.10.1",
     "chai": "^4.2.0",
     "cpx2": "^3.0.0",
-    "eslint": "^7.32.0",
-    "eslint-config-prettier": "^9.1.0",
-    "eslint-plugin-node": "^11.1.0",
-    "eslint-plugin-react": "^7.33.2",
-    "eslint-plugin-react-hooks": "^4.2.0",
-    "jest": "^27.5.1",
-    "jest-cli": "^27.5.1",
-    "jest-transform-stub": "^2.0.0",
+    "eslint": "^9.39.2",
+    "eslint-config-prettier": "^10.1.8",
+    "eslint-plugin-import": "^2.32.0",
+    "eslint-plugin-react": "^7.37.5",
+    "eslint-plugin-unused-imports": "^4.3.0",
+    "jsdom": "^25.0.0",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "react-redux": "^7.2.2",
     "redux": "^4.1.0",
     "rimraf": "^3.0.2",
-    "ts-jest": "^27.1.3",
+    "sass-embedded": "^1.86.0",
     "typemoq": "^2.1.0",
-    "typescript": "~4.6.0",
-    "xmlhttprequest": "^1.8.0"
+    "typescript": "~5.6.0",
+    "@vitest/coverage-v8": "^3.0.0",
+    "vitest": "^3.0.0"
   },
   "peerDependencies": {
-    "@itwin/appui-abstract": "^4.0.0",
-    "@itwin/appui-react": "^4.0.0",
-    "@itwin/core-bentley": "^4.0.0",
-    "@itwin/core-frontend": "^4.0.0",
+    "@itwin/appui-abstract": "^5.0.0",
+    "@itwin/appui-react": "^5.0.0",
+    "@itwin/core-bentley": "^5.0.0",
+    "@itwin/core-frontend": "^5.0.0",
     "react": "^17.0.2 || ^18.0.0",
     "react-dom": "^17.0.2 || ^18.0.0"
   }

package/src/test/AddMappingModal.test.tsx

@@ -3,8 +3,8 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import React from "react";
+import { vi } from "vitest";
 import faker from "@faker-js/faker";
-import "@testing-library/jest-dom";
 import { ReportsConfigWidget } from "../ReportsConfigWidget";
 import { mockIModelId1, mockIModelId2, mockIModelsResponse, mockITwinId, mockReportId, render, screen, waitFor, within } from "./test-utils";
 import * as moq from "typemoq";
@@ -134,15 +134,15 @@ const mockReportMappingsAndMappingsFactory = (mockMappings: MappingContainer[],
   return reportMappingsAndMapping;
 };
 
-jest.mock("@itwin/imodels-client-management", () => ({
-  ...jest.requireActual("@itwin/imodels-client-management"),
-  toArray: jest.fn().mockImplementation(async () => {
+vi.mock("@itwin/imodels-client-management", async () => ({
+  ...(await vi.importActual("@itwin/imodels-client-management")),
+  toArray: vi.fn().mockImplementation(async () => {
     return mockProjectIModels.iModels;
   }),
 }));
 
-const mockGetMappings = jest.fn();
-const mockCreateReportMapping = jest.fn();
+const mockGetMappings = vi.fn();
+const mockCreateReportMapping = vi.fn();
 
 const mockIModelsClient = moq.Mock.ofType<IModelsClient>();
 const mockIModelsClientOperations = moq.Mock.ofType<IModelOperations<OperationOptions>>();
@@ -181,7 +181,7 @@ describe("Add Mapping Modal", () => {
         show={true}
         reportId={mockReportId}
         existingMappings={mockReportMappingsAndMappings}
-        onClose={jest.fn()}
+        onClose={vi.fn()}
         defaultIModelId={mockIModelId1}
       />,
       { iTwinId: mockITwinId, reportsClient: mockReportsClient.object, mappingsClient: mockMappingsClient.object, iModelsClient: mockIModelsClient.object },

package/src/test/BulkExtractor.test.ts

@@ -2,6 +2,7 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
+import { vi } from "vitest";
 import { BulkExtractor } from "../widget/components/BulkExtractor";
 import { ExtractionStates } from "../widget/components/ExtractionStatus";
 import { assert } from "chai";
@@ -10,25 +11,25 @@ import { ExtractionClient, ExtractionState, ReportsClient } from "@itwin/insight
 import type { AccessToken } from "@itwin/core-bentley";
 import type { ExtractionRequestDetails } from "@itwin/insights-client";
 
-jest.mock("../widget/components/Constants.ts", () => ({
+vi.mock("../widget/components/Constants.ts", () => ({
   STATUS_CHECK_INTERVAL: -1,
 }));
 
-jest.mock("../widget/components/ExtractionToast.tsx", () => ({
-  FailedExtractionToast: jest.fn(),
-  SuccessfulExtractionToast: jest.fn(),
+vi.mock("../widget/components/ExtractionToast.tsx", () => ({
+  FailedExtractionToast: vi.fn(),
+  SuccessfulExtractionToast: vi.fn(),
 }));
 
 const mockRunExtraction = moq.Mock.ofType<(accessToken: AccessToken, extractionRequest: ExtractionRequestDetails) => Promise<{ id: string }>>();
 const mockGetStatus = moq.Mock.ofType<(accessToken: AccessToken, jobId: string) => Promise<{ state: ExtractionState }>>();
 const mockGetReportMappings = moq.Mock.ofType<(accessToken: AccessToken, reportId: string) => Promise<{ imodelId: string; mappingId: string }[]>>();
 
-jest.mock("@itwin/insights-client", () => ({
-  ...jest.requireActual("@itwin/insights-client"),
-  ReportsClient: jest.fn().mockImplementation(() => ({
+vi.mock("@itwin/insights-client", async () => ({
+  ...(await vi.importActual("@itwin/insights-client")),
+  ReportsClient: vi.fn().mockImplementation(() => ({
     getReportMappings: mockGetReportMappings.object,
   })),
-  ExtractionClient: jest.fn().mockImplementation(() => ({
+  ExtractionClient: vi.fn().mockImplementation(() => ({
     runExtraction: mockRunExtraction.object,
     getExtractionStatus: mockGetStatus.object,
   })),
@@ -39,7 +40,7 @@ afterEach(() => {
   mockGetStatus.reset();
 });
 
-const mockToastCallback = jest.fn();
+const mockToastCallback = vi.fn();
 
 const mockGetAccessToken = async () => "mockAccessToken";
 

package/src/test/DeleteModal.test.tsx

@@ -3,7 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import React from "react";
-import "@testing-library/jest-dom";
+import { vi } from "vitest";
 import { render, screen } from "./test-utils";
 import DeleteModal from "../widget/components/DeleteModal";
 import { ReportsConfigWidget } from "../ReportsConfigWidget";
@@ -16,13 +16,13 @@ beforeAll(async () => {
 
 describe("Delete modal", () => {
   it("should render", () => {
-    const { container } = render(<DeleteModal entityName="test" onDelete={jest.fn()} refresh={jest.fn()} onClose={jest.fn()} />);
+    const { container } = render(<DeleteModal entityName="test" onDelete={vi.fn()} refresh={vi.fn()} onClose={vi.fn()} />);
     expect(container).toBeTruthy();
   });
 
   it("should call onDelete when delete button is clicked", async () => {
-    const onDelete = jest.fn();
-    const { user } = render(<DeleteModal entityName="test" onDelete={onDelete} refresh={jest.fn()} onClose={jest.fn()} />);
+    const onDelete = vi.fn();
+    const { user } = render(<DeleteModal entityName="test" onDelete={onDelete} refresh={vi.fn()} onClose={vi.fn()} />);
     const deleteButton = screen.getByRole("button", {
       name: /delete/i,
     });

package/src/test/ReportAction.test.tsx

@@ -3,8 +3,8 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import React from "react";
+import { vi } from "vitest";
 import faker from "@faker-js/faker";
-import "@testing-library/jest-dom";
 import { ReportsConfigWidget } from "../ReportsConfigWidget";
 import { render, screen, waitForElementToBeRemoved } from "./test-utils";
 import { ReportAction } from "../widget/components/ReportAction";
@@ -20,9 +20,9 @@ beforeAll(async () => {
 
 describe("Reports Action", () => {
   it("required fields should be filled out", async () => {
-    const mockReturnFn = jest.fn();
+    const mockReturnFn = vi.fn();
 
-    render(<ReportAction onClickCancel={jest.fn()} onSaveSuccess={mockReturnFn} />);
+    render(<ReportAction onClickCancel={vi.fn()} onSaveSuccess={mockReturnFn} />);
 
     const addButton = screen.getByRole("button", {
       name: /add/i,
@@ -36,7 +36,7 @@ describe("Reports Action", () => {
   });
 
   it("should be able to add report", async () => {
-    const mockReturnFn = jest.fn();
+    const mockReturnFn = vi.fn();
     const mockReport: Report = {
       id: faker.datatype.uuid(),
       displayName: "mOcKRePoRt1",
@@ -54,7 +54,7 @@ describe("Reports Action", () => {
 
     const reportsClient = new ReportsClient();
 
-    jest.spyOn(reportsClient, "createReport").mockImplementation(
+    vi.spyOn(reportsClient, "createReport").mockImplementation(
       async () =>
         new Promise((resolve) =>
           setTimeout(() => {
@@ -63,7 +63,7 @@ describe("Reports Action", () => {
         ),
     );
 
-    const { user } = render(<ReportAction onClickCancel={jest.fn()} onSaveSuccess={mockReturnFn} />, { reportsClient });
+    const { user } = render(<ReportAction onClickCancel={vi.fn()} onSaveSuccess={mockReturnFn} />, { reportsClient });
 
     const addButton = screen.getByRole("button", {
       name: /add/i,
@@ -95,9 +95,9 @@ describe("Reports Action", () => {
   });
 
   it("No duplicate underscores in the beginning of name", async () => {
-    const mockReturnFn = jest.fn();
+    const mockReturnFn = vi.fn();
 
-    const { user } = render(<ReportAction onClickCancel={jest.fn()} onSaveSuccess={mockReturnFn} />);
+    const { user } = render(<ReportAction onClickCancel={vi.fn()} onSaveSuccess={mockReturnFn} />);
 
     const addButton = screen.getByRole("button", {
       name: /add/i,
@@ -113,9 +113,9 @@ describe("Reports Action", () => {
   });
 
   it("Only begin with letters or underscores of name", async () => {
-    const mockReturnFn = jest.fn();
+    const mockReturnFn = vi.fn();
 
-    const { user } = render(<ReportAction onClickCancel={jest.fn()} onSaveSuccess={mockReturnFn} />);
+    const { user } = render(<ReportAction onClickCancel={vi.fn()} onSaveSuccess={mockReturnFn} />);
 
     const addButton = screen.getByRole("button", {
       name: /add/i,
@@ -131,9 +131,9 @@ describe("Reports Action", () => {
   });
 
   it("Only letters underscores and digits of name", async () => {
-    const mockReturnFn = jest.fn();
+    const mockReturnFn = vi.fn();
 
-    const { user } = render(<ReportAction onClickCancel={jest.fn()} onSaveSuccess={mockReturnFn} />);
+    const { user } = render(<ReportAction onClickCancel={vi.fn()} onSaveSuccess={mockReturnFn} />);
 
     const addButton = screen.getByRole("button", {
       name: /add/i,
@@ -149,9 +149,9 @@ describe("Reports Action", () => {
   });
 
   it("check for character limits of name", async () => {
-    const mockReturnFn = jest.fn();
+    const mockReturnFn = vi.fn();
 
-    const { user } = render(<ReportAction onClickCancel={jest.fn()} onSaveSuccess={mockReturnFn} />);
+    const { user } = render(<ReportAction onClickCancel={vi.fn()} onSaveSuccess={mockReturnFn} />);
 
     const addButton = screen.getByRole("button", {
       name: /add/i,

package/src/test/ReportMappingHorizontalTile.test.tsx

@@ -3,8 +3,8 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import React from "react";
+import { vi } from "vitest";
 import faker from "@faker-js/faker";
-import "@testing-library/jest-dom";
 import { ReportsConfigWidget } from "../ReportsConfigWidget";
 import { fireEvent, mockIModelId1, mockIModelsResponse, mockReportId, render, screen, waitFor, within } from "./test-utils";
 import * as moq from "typemoq";
@@ -120,8 +120,8 @@ const mockReportMappingsAndMappingsFactory = (): ReportMappingAndMapping[] => {
 const mockBulkExtractor = moq.Mock.ofType<BulkExtractor>();
 const mockIModelsClient = moq.Mock.ofType<IModelOperations<OperationOptions>>();
 
-jest.mock("../widget/components/Constants.ts", () => ({
-  ...jest.requireActual("../widget/components/Constants.ts"),
+vi.mock("../widget/components/Constants.ts", async () => ({
+  ...(await vi.importActual("../widget/components/Constants.ts")),
   STATUS_CHECK_INTERVAL: 10,
 }));
 
@@ -220,7 +220,7 @@ describe("Report Mapping Horizontal Tile", () => {
       .setup(async (x) => x.getIModelState(firstMockMapping.imodelId, firstMockMapping.iModelName, mockOdataFeedUrl))
       .returns(async () => ExtractionStates.None);
 
-    const mockOnClickDelete = jest.fn();
+    const mockOnClickDelete = vi.fn();
 
     const jobStartEvent = new BeEvent<(iModelId: string) => void>();
 
@@ -263,7 +263,7 @@ describe("Report Mapping Horizontal Tile", () => {
       .setup(async (x) => x.getIModelState(firstMockMapping.imodelId, firstMockMapping.iModelName, mockOdataFeedUrl))
       .returns(async () => ExtractionStates.None);
 
-    const mockOnClickDelete = jest.fn();
+    const mockOnClickDelete = vi.fn();
 
     const jobStartEvent = new BeEvent<(iModelId: string) => void>();
 

package/src/test/ReportMappings.test.tsx

@@ -3,7 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import React from "react";
-import "@testing-library/jest-dom";
+import { vi } from "vitest";
 import { ReportsConfigWidget } from "../ReportsConfigWidget";
 import {
   act,
@@ -127,12 +127,12 @@ const mockMappingsFactory = (mockReportMappings: ReportMappingCollection): Mappi
   return mockMappings;
 };
 
-jest.mock("../widget/components/Constants.ts", () => ({
-  ...jest.requireActual("../widget/components/Constants.ts"),
+vi.mock("../widget/components/Constants.ts", async () => ({
+  ...(await vi.importActual("../widget/components/Constants.ts")),
   STATUS_CHECK_INTERVAL: 10,
 }));
 
-jest.mock("../widget/components/ReportMappingHorizontalTile", () => ({
+vi.mock("../widget/components/ReportMappingHorizontalTile", () => ({
   ReportMappingHorizontalTile: (props: ReportMappingHorizontalTileProps) => {
     return (
       <div data-testid="horizontal-tile">
@@ -144,25 +144,25 @@ jest.mock("../widget/components/ReportMappingHorizontalTile", () => ({
 }));
 
 let onClose: () => Promise<void>;
-jest.mock("../widget/components/AddMappingsModal", () => ({
-  ...jest.requireActual("../widget/components/AddMappingsModal"),
+vi.mock("../widget/components/AddMappingsModal", async () => ({
+  ...(await vi.importActual("../widget/components/AddMappingsModal")),
   AddMappingsModal: (props: AddMappingsModalProps) => {
     onClose = props.onClose;
     return <div data-testid="add-mappings-modal" />;
   },
 }));
 
-jest.mock("@itwin/imodels-client-management", () => ({
-  ...jest.requireActual("@itwin/imodels-client-management"),
+vi.mock("@itwin/imodels-client-management", async () => ({
+  ...(await vi.importActual("@itwin/imodels-client-management")),
 
-  toArray: jest.fn().mockImplementation(async () => {
+  toArray: vi.fn().mockImplementation(async () => {
     return mockProjectIModels.iModels;
   }),
 }));
 
-const mockGetMapping = jest.fn();
-const mockGetMappings = jest.fn();
-const mockGetReportMappings = jest.fn();
+const mockGetMapping = vi.fn();
+const mockGetMappings = vi.fn();
+const mockGetReportMappings = vi.fn();
 
 const mockIModelsClient = moq.Mock.ofType<IModelsClient>();
 const mockIModelsClientOperations = moq.Mock.ofType<IModelOperations<OperationOptions>>();
@@ -198,7 +198,7 @@ describe("Report Mappings View", () => {
     mockGetMapping.mockReturnValueOnce(mockMappings[0].mapping).mockReturnValueOnce(mockMappings[1].mapping);
     mockGetReportMappings.mockReturnValueOnce(mockReportMappings.mappings);
 
-    render(<ReportMappings report={mockReport} onClickClose={jest.fn()} />, {
+    render(<ReportMappings report={mockReport} onClickClose={vi.fn()} />, {
       reportsClient: mockReportsClient.object,
       mappingsClient: mockMappingsClient.object,
       iModelsClient: mockIModelsClient.object,
@@ -217,7 +217,7 @@ describe("Report Mappings View", () => {
     mockGetMapping.mockReturnValueOnce(mockMappings[0].mapping).mockReturnValueOnce(mockMappings[1].mapping);
     mockGetReportMappings.mockReturnValueOnce(mockReportMappings.mappings);
 
-    const { user } = render(<ReportMappings report={mockReport} onClickClose={jest.fn()} />, {
+    const { user } = render(<ReportMappings report={mockReport} onClickClose={vi.fn()} />, {
       reportsClient: mockReportsClient.object,
       mappingsClient: mockMappingsClient.object,
       iModelsClient: mockIModelsClient.object,
@@ -258,7 +258,7 @@ describe("Report Mappings View", () => {
     mockGetMapping.mockReturnValueOnce(mockMappings[0].mapping).mockReturnValueOnce(mockMappings[1].mapping);
     mockGetReportMappings.mockReturnValueOnce(mockReportMappings.mappings);
 
-    const { user } = render(<ReportMappings report={mockReport} onClickClose={jest.fn()} />, {
+    const { user } = render(<ReportMappings report={mockReport} onClickClose={vi.fn()} />, {
       reportsClient: mockReportsClient.object,
       mappingsClient: mockMappingsClient.object,
       iModelsClient: mockIModelsClient.object,
@@ -288,7 +288,7 @@ describe("Report Mappings View", () => {
   });
 
   it("odata feed url", async () => {
-    const { user } = render(<ReportMappings report={mockReport} onClickClose={jest.fn()} />, {
+    const { user } = render(<ReportMappings report={mockReport} onClickClose={vi.fn()} />, {
       reportsClient: mockReportsClient.object,
       mappingsClient: mockMappingsClient.object,
       iModelsClient: mockIModelsClient.object,
@@ -317,11 +317,11 @@ describe("Report Mappings View", () => {
     mockGetMapping.mockReturnValueOnce(mockMappings[0].mapping).mockReturnValueOnce(mockMappings[1].mapping);
     mockGetReportMappings.mockReturnValueOnce(mockReportMappings.mappings);
 
-    const bulkExtractor = new BulkExtractor(new ReportsClient(), new ExtractionClient(), jest.fn().mockResolvedValue("mockAccessToken"), jest.fn, jest.fn);
+    const bulkExtractor = new BulkExtractor(new ReportsClient(), new ExtractionClient(), vi.fn().mockResolvedValue("mockAccessToken"), vi.fn, vi.fn);
 
-    const runIModelExtractionsMock = jest.spyOn(bulkExtractor, "runIModelExtractions").mockImplementation(async () => Promise.resolve());
+    const runIModelExtractionsMock = vi.spyOn(bulkExtractor, "runIModelExtractions").mockImplementation(async () => Promise.resolve());
 
-    const { user } = render(<ReportMappings report={mockReport} onClickClose={jest.fn()} />, {
+    const { user } = render(<ReportMappings report={mockReport} onClickClose={vi.fn()} />, {
       reportsClient: mockReportsClient.object,
       mappingsClient: mockMappingsClient.object,
       iModelsClient: mockIModelsClient.object,

package/src/test/Reports.test.tsx

@@ -3,7 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import React from "react";
-import "@testing-library/jest-dom";
+import { vi } from "vitest";
 import { render, screen, waitForElementToBeRemoved, within } from "../test/test-utils";
 import { Reports } from "../widget/components/Reports";
 import { ReportsConfigWidget } from "../ReportsConfigWidget";
@@ -36,8 +36,8 @@ const reportsFactory = (): ReportCollection => ({
   },
 });
 
-const mockGetReports = jest.fn();
-const mockDeleteReport = jest.fn();
+const mockGetReports = vi.fn();
+const mockDeleteReport = vi.fn();
 
 const mockReportsClient = moq.Mock.ofType<ReportsClient>();
 
@@ -57,7 +57,7 @@ afterEach(() => {
 describe("Reports View", () => {
   it("call to action button should be clickable with no reports", async () => {
     mockGetReports.mockReturnValueOnce([]);
-    const onClickAddMock = jest.fn();
+    const onClickAddMock = vi.fn();
 
     const { user } = render(<Reports onClickAddReport={onClickAddMock} />, { reportsClient: mockReportsClient.object });
 
@@ -72,7 +72,7 @@ describe("Reports View", () => {
   it("be able to add new report", async () => {
     mockGetReports.mockReturnValueOnce([]);
 
-    const onClickAddMock = jest.fn();
+    const onClickAddMock = vi.fn();
     const { user } = render(<Reports onClickAddReport={onClickAddMock} />, { reportsClient: mockReportsClient.object });
 
     await waitForElementToBeRemoved(() => screen.getByText(/loading/i));
@@ -104,7 +104,7 @@ describe("Reports View", () => {
   it("able to modify a report", async () => {
     const mockedReports: ReportCollection = reportsFactory();
     mockGetReports.mockReturnValueOnce(mockedReports.reports);
-    const onClickModifyMock = jest.fn();
+    const onClickModifyMock = vi.fn();
     const { user } = render(<Reports onClickReportModify={onClickModifyMock} />, { reportsClient: mockReportsClient.object });
 
     await waitForElementToBeRemoved(() => screen.getByText(/loading/i));
@@ -175,7 +175,7 @@ describe("Reports View", () => {
   it("modify a report", async () => {
     const mockedReports: ReportCollection = reportsFactory();
     mockGetReports.mockReturnValueOnce(mockedReports.reports);
-    const onClickModifyMock = jest.fn();
+    const onClickModifyMock = vi.fn();
     const { user } = render(<Reports onClickReportModify={onClickModifyMock} />, { reportsClient: mockReportsClient.object });
 
     await waitForElementToBeRemoved(() => screen.getByText(/loading/i));
@@ -190,7 +190,7 @@ describe("Reports View", () => {
   it("click a report", async () => {
     const mockedReports: ReportCollection = reportsFactory();
     mockGetReports.mockReturnValueOnce(mockedReports.reports);
-    const onClickTitleMock = jest.fn();
+    const onClickTitleMock = vi.fn();
     const { user } = render(<Reports onClickReportTitle={onClickTitleMock} />, { reportsClient: mockReportsClient.object });
 
     await waitForElementToBeRemoved(() => screen.getByText(/loading/i));

package/src/test/WidgetHeader.test.tsx

@@ -3,7 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import React from "react";
-import "@testing-library/jest-dom";
+import { vi } from "vitest";
 import { render, screen } from "../test/test-utils";
 import { WidgetHeader } from "../widget/components/utils";
 import { faker } from "@faker-js/faker";
@@ -26,7 +26,7 @@ describe("Widget Header Component", () => {
   });
 
   it("header allows return callback", async () => {
-    const mockReturnFn = jest.fn();
+    const mockReturnFn = vi.fn();
     const { user, container } = render(<WidgetHeader title="" returnFn={mockReturnFn} />);
 
     const returnBtn = container.getElementsByClassName("rcw-chevron")[0];

package/{__mocks__/fileMock.js → src/test/setup.ts}

@@ -2,4 +2,4 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-module.exports = {};
+import "@testing-library/jest-dom/vitest";

package/src/test/test-utils.tsx

@@ -103,6 +103,6 @@ function render(ui: React.ReactElement, contextProps?: Partial<ReportsConfigCont
   };
 }
 
-export * from "@testing-library/react";
-// override React Testing Library's render with our own
+// Re-export everything from @testing-library/react except render
+export { act, cleanup, fireEvent, screen, waitFor, waitForElementToBeRemoved, within } from "@testing-library/react";
 export { render };

package/tsconfig.json

@@ -4,7 +4,8 @@
     "skipLibCheck": true,
     "jsx": "react",
     "preserveSymlinks": true,
-    "esModuleInterop": true
+    "esModuleInterop": true,
+    "types": ["vitest/globals"]
   },
   "include": ["./src/**/*.ts*"],
   "exclude": ["lib", "node_modules"]

package/vitest.config.ts

@@ -0,0 +1,29 @@
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+import { defineConfig } from "vitest/config";
+
+export default defineConfig({
+  resolve: {
+    alias: {
+      "react-dom/client": "react-dom",
+    },
+  },
+  test: {
+    globals: true,
+    environment: "jsdom",
+    setupFiles: ["src/test/setup.ts"],
+    dir: "src",
+    server: {
+      deps: {
+        inline: [
+          "@itwin/appui-react",
+          "@itwin/components-react",
+          "@itwin/core-react",
+          "@itwin/imodel-components-react",
+        ],
+      },
+    },
+  },
+});