@griddo/ax 12.3.0 → 12.4.0

package/src/__tests__/components/ConfigPanel/GlobalPageForm/GlobalPageForm.test.tsx

@@ -1,8 +1,8 @@
-import { mock } from "jest-mock-extended";
+import { mock } from "vitest-mock-extended";
 import configureStore from "redux-mock-store";
 import { ThemeProvider } from "styled-components";
 
-import { cleanup, fireEvent, render, screen, waitFor } from "../../../../../config/jest/test-utils";
+import { cleanup, fireEvent, render, screen, waitFor } from "../../../../../config/tests/test-utils";
 import "@testing-library/jest-dom";
 
 import GlobalPageForm, { type IGlobalPageFormProps } from "@ax/components/ConfigPanel/GlobalPageForm";
@@ -11,9 +11,9 @@ import globalTheme from "@ax/themes/theme.json";
 
 import thunk from "redux-thunk";
 
-jest.mock("@ax/hooks", () => ({
-	...jest.requireActual("@ax/hooks"),
-	useGlobalPermission: jest.fn(() => true),
+vi.mock("@ax/hooks", async () => ({
+	...(await vi.importActual("@ax/hooks")),
+	useGlobalPermission: vi.fn(() => true),
 }));
 
 beforeEach(() => {
@@ -22,7 +22,7 @@ beforeEach(() => {
 
 const middlewares: any = [thunk];
 const mockStore = configureStore(middlewares);
-const updateEditorContentMock = jest.fn();
+const updateEditorContentMock = vi.fn();
 const initialStore = {
 	pageEditor: {
 		selectedContent: {
@@ -105,7 +105,7 @@ const initialStore = {
 const store = mockStore(initialStore);
 
 const defaultProps = mock<IGlobalPageFormProps>();
-const setNotificationActionMock = jest.fn();
+const setNotificationActionMock = vi.fn();
 defaultProps.actions.setNotificationAction = setNotificationActionMock;
 
 describe("GlobalPageForm component rendering", () => {
@@ -173,8 +173,8 @@ describe("GlobalPageForm component rendering", () => {
 describe("GlobalPageForm component rendering", () => {
 	it("should trigger handleClick", async () => {
 		defaultProps.selectedTab = "content";
-		const getGlobalFromLocalPageActionMock = jest.fn(() => Promise.resolve());
-		const saveCurrentSiteInfoActionMock = jest.fn();
+		const getGlobalFromLocalPageActionMock = vi.fn(() => Promise.resolve());
+		const saveCurrentSiteInfoActionMock = vi.fn();
 		defaultProps.actions.saveCurrentSiteInfoAction = saveCurrentSiteInfoActionMock;
 		defaultProps.actions.getGlobalFromLocalPageAction = getGlobalFromLocalPageActionMock;
 
@@ -199,7 +199,7 @@ describe("GlobalPageForm component rendering", () => {
 	it("should trigger handleRestoreHeader", () => {
 		defaultProps.selectedTab = "content";
 		defaultProps.header = 0;
-		const restorePageNavigationActionMock = jest.fn();
+		const restorePageNavigationActionMock = vi.fn();
 		defaultProps.actions.restorePageNavigationAction = restorePageNavigationActionMock;
 
 		render(
@@ -219,7 +219,7 @@ describe("GlobalPageForm component rendering", () => {
 	it("should trigger handleRestoreFooter", () => {
 		defaultProps.selectedTab = "content";
 		defaultProps.footer = 0;
-		const restorePageNavigationActionMock = jest.fn();
+		const restorePageNavigationActionMock = vi.fn();
 		defaultProps.actions.restorePageNavigationAction = restorePageNavigationActionMock;
 
 		render(

package/src/__tests__/components/ConfigPanel/Header/Header.test.tsx

@@ -1,8 +1,9 @@
+import type { MockedFunction } from "vitest";
 import * as React from "react";
 
 import { ThemeProvider } from "styled-components";
-import { render, cleanup, screen, fireEvent } from "../../../../../config/jest/test-utils";
-import { mock } from "jest-mock-extended";
+import { render, cleanup, screen, fireEvent } from "../../../../../config/tests/test-utils";
+import { mock } from "vitest-mock-extended";
 import configureStore from "redux-mock-store";
 import "@testing-library/jest-dom";
 
@@ -10,19 +11,19 @@ import { parseTheme } from "@ax/helpers";
 import Header, { IHeaderProps } from "@ax/components/ConfigPanel/Header";
 import globalTheme from "@ax/themes/theme.json";
 
-window.scrollTo = jest.fn();
+window.scrollTo = vi.fn();
 
 beforeEach(() => {
 	cleanup();
 });
 
 afterAll(() => {
-	jest.clearAllMocks();
+	vi.clearAllMocks();
 });
 
 const middlewares: any = [];
 const mockStore = configureStore(middlewares);
-const updateEditorContentMock = jest.fn();
+const updateEditorContentMock = vi.fn();
 const initialStore = {
 	pageEditor: {
 		selectedContent: {
@@ -74,11 +75,11 @@ const store = mockStore(initialStore);
 
 const defaultProps = mock<IHeaderProps>();
 defaultProps.actions = {
-	duplicateModuleAction: jest.fn(),
-	deleteModuleAction: jest.fn(),
-	copyModuleAction: jest.fn(),
+	duplicateModuleAction: vi.fn(),
+	deleteModuleAction: vi.fn(),
+	copyModuleAction: vi.fn(),
 };
-const setSelectedContentMock = defaultProps.setSelectedContent as jest.MockedFunction<(editorID: number) => void>;
+const setSelectedContentMock = defaultProps.setSelectedContent as MockedFunction<(editorID: number) => void>;
 
 defaultProps.schema = {
 	title: "Header",
@@ -111,7 +112,7 @@ defaultProps.breadcrumb = [
 defaultProps.activatedModules = ["TextField"];
 
 defaultProps.headerRef = { current: { offsetHeight: 63, offsetTop: 24 } } as React.RefObject<HTMLDivElement>;
-const setHeaderHeightMock = defaultProps.setHeaderHeight as jest.MockedFunction<(height: number) => void>;
+const setHeaderHeightMock = defaultProps.setHeaderHeight as MockedFunction<(height: number) => void>;
 
 describe("Header component rendering", () => {
 	it("should render component", () => {

package/src/__tests__/components/ConfigPanel/NavigationForm/Field/Field.test.tsx

@@ -1,8 +1,8 @@
 import * as React from "react";
 
 import { ThemeProvider } from "styled-components";
-import { render, cleanup, screen, fireEvent } from "../../../../../../config/jest/test-utils";
-import { mock } from "jest-mock-extended";
+import { render, cleanup, screen, fireEvent } from "../../../../../../config/tests/test-utils";
+import { mock } from "vitest-mock-extended";
 import configureStore from "redux-mock-store";
 import "@testing-library/jest-dom";
 import thunk from "redux-thunk";

package/src/__tests__/components/ConfigPanel/NavigationForm/NavigationForm.test.tsx

@@ -1,8 +1,8 @@
 import * as React from "react";
 
 import { ThemeProvider } from "styled-components";
-import { render, cleanup, screen } from "../../../../../config/jest/test-utils";
-import { mock } from "jest-mock-extended";
+import { render, cleanup, screen } from "../../../../../config/tests/test-utils";
+import { mock } from "vitest-mock-extended";
 import configureStore from "redux-mock-store";
 import "@testing-library/jest-dom";
 import thunk from "redux-thunk";

package/src/__tests__/components/ConfigPanel/PreviewForm/PreviewForm.test.tsx

@@ -1,8 +1,9 @@
+import type { MockedFunction } from "vitest";
 import * as React from "react";
 
 import { ThemeProvider } from "styled-components";
-import { render, cleanup, screen, fireEvent } from "../../../../../config/jest/test-utils";
-import { mock } from "jest-mock-extended";
+import { render, cleanup, screen, fireEvent } from "../../../../../config/tests/test-utils";
+import { mock } from "vitest-mock-extended";
 import configureStore from "redux-mock-store";
 import "@testing-library/jest-dom";
 import thunk from "redux-thunk";
@@ -50,7 +51,7 @@ const store = mockStore(initialStore);
 const defaultProps = mock<IPreviewFormProps>();
 
 defaultProps.selectedTab = "content";
-const setSelectedTabMock = defaultProps.setSelectedTab as jest.MockedFunction<(tab: string) => void>;
+const setSelectedTabMock = defaultProps.setSelectedTab as MockedFunction<(tab: string) => void>;
 
 describe("PreviewForm component rendering", () => {
 	it("should render component", () => {

package/src/__tests__/components/ContextMenu/ContextMenu.test.tsx

@@ -27,7 +27,7 @@ describe("ContextMenu component rendering", () => {
 	});
 
 	it("should render menu container when position is provided", () => {
-		const options: IActionMenuOption[] = [{ label: "Edit", action: jest.fn(), icon: "edit" }];
+		const options: IActionMenuOption[] = [{ label: "Edit", action: vi.fn(), icon: "edit" }];
 
 		const props = {
 			position: { x: 100, y: 200 },
@@ -46,9 +46,9 @@ describe("ContextMenu component rendering", () => {
 
 	it("should render all provided options", () => {
 		const options: IActionMenuOption[] = [
-			{ label: "Edit", action: jest.fn(), icon: "edit" },
-			{ label: "Delete", action: jest.fn(), icon: "delete" },
-			{ label: "Duplicate", action: jest.fn(), icon: "duplicate" },
+			{ label: "Edit", action: vi.fn(), icon: "edit" },
+			{ label: "Delete", action: vi.fn(), icon: "delete" },
+			{ label: "Duplicate", action: vi.fn(), icon: "duplicate" },
 		];
 
 		const props = {
@@ -69,10 +69,10 @@ describe("ContextMenu component rendering", () => {
 
 	it("should handle null and undefined options in array", () => {
 		const options: (IActionMenuOption | undefined | null)[] = [
-			{ label: "Edit", action: jest.fn(), icon: "edit" },
+			{ label: "Edit", action: vi.fn(), icon: "edit" },
 			null,
 			undefined,
-			{ label: "Delete", action: jest.fn(), icon: "delete" },
+			{ label: "Delete", action: vi.fn(), icon: "delete" },
 		];
 
 		const props = {
@@ -93,7 +93,7 @@ describe("ContextMenu component rendering", () => {
 
 describe("ContextMenu component positioning", () => {
 	it("should apply correct position coordinates", () => {
-		const options: IActionMenuOption[] = [{ label: "Edit", action: jest.fn(), icon: "edit" }];
+		const options: IActionMenuOption[] = [{ label: "Edit", action: vi.fn(), icon: "edit" }];
 
 		const props = {
 			position: { x: 150, y: 250 },
@@ -112,7 +112,7 @@ describe("ContextMenu component positioning", () => {
 	});
 
 	it("should adjust position when menu would overflow viewport right edge", () => {
-		const options: IActionMenuOption[] = [{ label: "Edit", action: jest.fn(), icon: "edit" }];
+		const options: IActionMenuOption[] = [{ label: "Edit", action: vi.fn(), icon: "edit" }];
 
 		// Position near right edge with large X coordinate
 		const props = {
@@ -131,7 +131,7 @@ describe("ContextMenu component positioning", () => {
 	});
 
 	it("should adjust position when menu would overflow viewport bottom edge", () => {
-		const options: IActionMenuOption[] = [{ label: "Edit", action: jest.fn(), icon: "edit" }];
+		const options: IActionMenuOption[] = [{ label: "Edit", action: vi.fn(), icon: "edit" }];
 
 		// Position near bottom edge with large Y coordinate
 		const props = {
@@ -152,7 +152,7 @@ describe("ContextMenu component positioning", () => {
 
 describe("ContextMenu component events", () => {
 	it("should call action when option is clicked", () => {
-		const actionSpy = jest.fn();
+		const actionSpy = vi.fn();
 		const options: IActionMenuOption[] = [{ label: "Edit", action: actionSpy, icon: "edit" }];
 
 		const props = {
@@ -173,8 +173,8 @@ describe("ContextMenu component events", () => {
 	});
 
 	it("should close menu and call onClose when option is clicked", () => {
-		const actionSpy = jest.fn();
-		const onCloseSpy = jest.fn();
+		const actionSpy = vi.fn();
+		const onCloseSpy = vi.fn();
 		const options: IActionMenuOption[] = [{ label: "Edit", action: actionSpy, icon: "edit" }];
 
 		const props = {
@@ -197,8 +197,8 @@ describe("ContextMenu component events", () => {
 	});
 
 	it("should call onClose when clicking outside the menu", () => {
-		const onCloseSpy = jest.fn();
-		const options: IActionMenuOption[] = [{ label: "Edit", action: jest.fn(), icon: "edit" }];
+		const onCloseSpy = vi.fn();
+		const options: IActionMenuOption[] = [{ label: "Edit", action: vi.fn(), icon: "edit" }];
 
 		const props = {
 			position: { x: 100, y: 200 },
@@ -220,8 +220,8 @@ describe("ContextMenu component events", () => {
 	});
 
 	it("should not call onClose when clicking inside the menu", () => {
-		const onCloseSpy = jest.fn();
-		const options: IActionMenuOption[] = [{ label: "Edit", action: jest.fn(), icon: "edit" }];
+		const onCloseSpy = vi.fn();
+		const options: IActionMenuOption[] = [{ label: "Edit", action: vi.fn(), icon: "edit" }];
 
 		const props = {
 			position: { x: 100, y: 200 },
@@ -244,9 +244,9 @@ describe("ContextMenu component events", () => {
 	});
 
 	it("should handle multiple actions independently", () => {
-		const editSpy = jest.fn();
-		const deleteSpy = jest.fn();
-		const onCloseSpy = jest.fn();
+		const editSpy = vi.fn();
+		const deleteSpy = vi.fn();
+		const onCloseSpy = vi.fn();
 		const options: IActionMenuOption[] = [
 			{ label: "Edit", action: editSpy, icon: "edit" },
 			{ label: "Delete", action: deleteSpy, icon: "delete" },
@@ -289,7 +289,7 @@ describe("ContextMenu component events", () => {
 
 describe("ContextMenu component state transitions", () => {
 	it("should hide menu when position changes to null", () => {
-		const options: IActionMenuOption[] = [{ label: "Edit", action: jest.fn(), icon: "edit" }];
+		const options: IActionMenuOption[] = [{ label: "Edit", action: vi.fn(), icon: "edit" }];
 
 		const { rerender, container } = render(
 			<ThemeProvider theme={parseTheme(globalTheme)}>
@@ -309,7 +309,7 @@ describe("ContextMenu component state transitions", () => {
 	});
 
 	it("should reopen menu at new position", () => {
-		const options: IActionMenuOption[] = [{ label: "Edit", action: jest.fn(), icon: "edit" }];
+		const options: IActionMenuOption[] = [{ label: "Edit", action: vi.fn(), icon: "edit" }];
 
 		const { rerender } = render(
 			<ThemeProvider theme={parseTheme(globalTheme)}>
@@ -339,7 +339,7 @@ describe("ContextMenu component state transitions", () => {
 	it("should update options without closing menu", () => {
 		const { rerender } = render(
 			<ThemeProvider theme={parseTheme(globalTheme)}>
-				<ContextMenu position={{ x: 100, y: 200 }} options={[{ label: "Edit", action: jest.fn(), icon: "edit" }]} />
+				<ContextMenu position={{ x: 100, y: 200 }} options={[{ label: "Edit", action: vi.fn(), icon: "edit" }]} />
 			</ThemeProvider>,
 		);
 
@@ -350,8 +350,8 @@ describe("ContextMenu component state transitions", () => {
 				<ContextMenu
 					position={{ x: 100, y: 200 }}
 					options={[
-						{ label: "Edit", action: jest.fn(), icon: "edit" },
-						{ label: "Delete", action: jest.fn(), icon: "delete" },
+						{ label: "Edit", action: vi.fn(), icon: "edit" },
+						{ label: "Delete", action: vi.fn(), icon: "delete" },
 					]}
 				/>
 			</ThemeProvider>,

package/src/__tests__/components/DragAndDrop/DragAndDrop.test.tsx

@@ -1,8 +1,9 @@
+import type { MockedFunction } from "vitest";
 import * as React from "react";
 
 import { ThemeProvider } from "styled-components";
 import { render, cleanup, screen, fireEvent } from "@testing-library/react";
-import { mock } from "jest-mock-extended";
+import { mock } from "vitest-mock-extended";
 import "@testing-library/jest-dom";
 
 import { parseTheme } from "@ax/helpers";
@@ -12,10 +13,10 @@ import globalTheme from "@ax/themes/theme.json";
 afterEach(cleanup);
 
 const defaultProps = mock<IDragAndDropProps>();
-const onDropMock = defaultProps.onDrop as jest.MockedFunction<(e: React.DragEvent<HTMLDivElement>) => void>;
-const onDragOverMock = defaultProps.onDragOver as jest.MockedFunction<(e: React.DragEvent<HTMLDivElement>) => void>;
-const onDragEnterMock = defaultProps.onDragEnter as jest.MockedFunction<(e: React.DragEvent<HTMLDivElement>) => void>;
-const onDragLeaveMock = defaultProps.onDragLeave as jest.MockedFunction<(e: React.DragEvent<HTMLDivElement>) => void>;
+const onDropMock = defaultProps.onDrop as MockedFunction<(e: React.DragEvent<HTMLDivElement>) => void>;
+const onDragOverMock = defaultProps.onDragOver as MockedFunction<(e: React.DragEvent<HTMLDivElement>) => void>;
+const onDragEnterMock = defaultProps.onDragEnter as MockedFunction<(e: React.DragEvent<HTMLDivElement>) => void>;
+const onDragLeaveMock = defaultProps.onDragLeave as MockedFunction<(e: React.DragEvent<HTMLDivElement>) => void>;
 defaultProps.children = React.createElement("button", null, "back button");
 
 describe("ErrorCenter component rendering", () => {

package/src/__tests__/components/ElementsTooltip/ElementsTooltip.test.tsx

@@ -2,7 +2,7 @@ import { ThemeProvider } from "styled-components";
 import { render, screen, cleanup } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import "@testing-library/jest-dom";
-import { mock } from "jest-mock-extended";
+import { mock } from "vitest-mock-extended";
 
 import { parseTheme } from "@ax/helpers";
 

package/src/__tests__/components/EmptyState/EmptyState.test.tsx

@@ -1,7 +1,7 @@
 import * as React from "react";
 
 import { ThemeProvider } from "styled-components";
-import { mock } from "jest-mock-extended";
+import { mock } from "vitest-mock-extended";
 import { render, screen, cleanup, fireEvent } from "@testing-library/react";
 import { parseTheme } from "@ax/helpers";
 import "@testing-library/jest-dom";
@@ -56,7 +56,7 @@ describe("EmptyState component rendering", () => {
 
 describe("EmptyState component events", () => {
 	it("should trigger the onClick", () => {
-		const actionFunc = jest.fn();
+		const actionFunc = vi.fn();
 		defaultProps.button = "A button";
 		defaultProps.action = actionFunc;
 

package/src/__tests__/components/ErrorCenter/ErrorCenter.test.tsx

@@ -2,7 +2,7 @@ import * as React from "react";
 
 import { ThemeProvider } from "styled-components";
 import { render, cleanup, screen, fireEvent } from "@testing-library/react";
-import { mock } from "jest-mock-extended";
+import { mock } from "vitest-mock-extended";
 import "@testing-library/jest-dom";
 
 import { parseTheme } from "@ax/helpers";
@@ -43,8 +43,8 @@ describe("ErrorCenter component rendering", () => {
 		errorItemProps.template = false;
 
 		const actionsMock = {
-			goToError: jest.fn(),
-			goToPackage: jest.fn(),
+			goToError: vi.fn(),
+			goToPackage: vi.fn(),
 		};
 
 		defaultProps.errors = [errorItemProps];
@@ -74,8 +74,8 @@ describe("ErrorCenter component rendering", () => {
 		errorItemProps.template = false;
 
 		const actionsMock = {
-			goToError: jest.fn(),
-			goToPackage: jest.fn(),
+			goToError: vi.fn(),
+			goToPackage: vi.fn(),
 		};
 
 		defaultProps.errors = [errorItemProps];
@@ -103,8 +103,8 @@ describe("ErrorCenter component rendering", () => {
 		errorItemProps.template = false;
 
 		const actionsMock = {
-			goToError: jest.fn(),
-			goToPackage: jest.fn(),
+			goToError: vi.fn(),
+			goToPackage: vi.fn(),
 		};
 
 		defaultProps.errors = [errorItemProps];
@@ -134,8 +134,8 @@ describe("ErrorCenter component trigger actions", () => {
 		errorItemProps.template = false;
 
 		const actionsMock = {
-			goToError: jest.fn(),
-			goToPackage: jest.fn(),
+			goToError: vi.fn(),
+			goToPackage: vi.fn(),
 		};
 
 		defaultProps.errors = [errorItemProps];
@@ -165,8 +165,8 @@ describe("ErrorCenter component trigger actions", () => {
 		errorItemProps.template = false;
 
 		const actionsMock = {
-			goToError: jest.fn(),
-			goToPackage: jest.fn(),
+			goToError: vi.fn(),
+			goToPackage: vi.fn(),
 		};
 
 		defaultProps.errors = [errorItemProps];

package/src/__tests__/components/FieldContainer/FieldContainer.test.tsx

@@ -1,7 +1,7 @@
 import * as React from "react";
 
 import { ThemeProvider } from "styled-components";
-import { mock } from "jest-mock-extended";
+import { mock } from "vitest-mock-extended";
 import { render, screen, cleanup } from "@testing-library/react";
 import { parseTheme } from "@ax/helpers";
 import "@testing-library/jest-dom";
@@ -22,7 +22,7 @@ describe("FieldContainer component rendering", () => {
 			hideable: true,
 			slugTo: "/",
 		};
-		defaultProps.updateValue = jest.fn();
+		defaultProps.updateValue = vi.fn();
 		defaultProps.selectedContent = { id: 1, component: "BasicCard" };
 		defaultProps.objKey = "id";
 
@@ -45,7 +45,7 @@ describe("FieldContainer component rendering", () => {
 			slugTo: "/",
 			whiteList: ["BasicCard", "CollectionCard"],
 		};
-		defaultProps.updateValue = jest.fn();
+		defaultProps.updateValue = vi.fn();
 		defaultProps.selectedContent = { id: 1 };
 
 		render(
@@ -66,7 +66,7 @@ describe("FieldContainer component rendering", () => {
 			hideable: true,
 			slugTo: "/",
 		};
-		defaultProps.updateValue = jest.fn();
+		defaultProps.updateValue = vi.fn();
 		defaultProps.selectedContent = { id: 1, value: null };
 		defaultProps.objKey = "value";
 

package/src/__tests__/components/Fields/AnalyticsField/AnalyticsField.test.tsx

@@ -3,7 +3,7 @@ import "@testing-library/jest-dom";
 import configureStore from "redux-mock-store";
 import { ThemeProvider } from "styled-components";
 
-import { render, cleanup } from "../../../../../config/jest/test-utils";
+import { render, cleanup } from "../../../../../config/tests/test-utils";
 
 import AnalyticsField from "@ax/components/Fields/AnalyticsField";
 import { parseTheme } from "@ax/helpers";
@@ -33,7 +33,7 @@ describe("AnalyticsField component rendering", () => {
 		const initialState = {
 			value: valuesMock,
 			template: "BasicTemplate",
-			onChange: jest.fn(),
+			onChange: vi.fn(),
 			analytics: analyticsMock,
 		};
 		const initialStore = {
@@ -69,7 +69,7 @@ describe("AnalyticsField component rendering", () => {
 		const initialState = {
 			value: valuesMock,
 			template: "BasicTemplate",
-			onChange: jest.fn(),
+			onChange: vi.fn(),
 			analytics: analyticsMock,
 		};
 		const initialStore = {

package/src/__tests__/components/Fields/AnalyticsField/PageAnalytics/PageAnalytics.test.tsx

@@ -28,7 +28,7 @@ describe("PageAnalytics component rendering", () => {
 		const props = {
 			value: valuesMock,
 			template: "BasicTemplate",
-			onChange: jest.fn(),
+			onChange: vi.fn(),
 			analytics: analyticsMock,
 		};
 
@@ -79,7 +79,7 @@ describe("PageAnalytics component rendering", () => {
 		const props = {
 			value: valuesMock,
 			template: "BasicTemplate",
-			onChange: jest.fn(),
+			onChange: vi.fn(),
 			analytics: analyticsMockFilled,
 		};
 
@@ -126,7 +126,7 @@ describe("PageAnalytics component rendering", () => {
 		const props = {
 			value: valuesMock,
 			template: "BasicTemplate",
-			onChange: jest.fn(),
+			onChange: vi.fn(),
 			analytics: analyticsMockFilled,
 		};
 
@@ -176,7 +176,7 @@ describe("PageAnalytics component rendering", () => {
 		const props = {
 			value: valuesMock,
 			template: "BasicTemplate",
-			onChange: jest.fn(),
+			onChange: vi.fn(),
 			analytics: analyticsMockFilled,
 		};
 

package/src/__tests__/components/Fields/AnalyticsField/StructuredDataAnalytics/StructuredDataAnalytics.test.tsx

@@ -27,7 +27,7 @@ describe("StructuredDataAnalytics component rendering", () => {
 		const props = {
 			value: valuesMock,
 			template: "BasicTemplate",
-			onChange: jest.fn(),
+			onChange: vi.fn(),
 			analytics: analyticsMock,
 		};
 
@@ -70,7 +70,7 @@ describe("StructuredDataAnalytics component rendering", () => {
 		const props = {
 			value: valuesMock,
 			template: "BasicTemplate",
-			onChange: jest.fn(),
+			onChange: vi.fn(),
 			analytics: analyticsMockFilled,
 		};
 
@@ -117,7 +117,7 @@ describe("StructuredDataAnalytics component rendering", () => {
 		const props = {
 			value: valuesMock,
 			template: "BasicTemplate",
-			onChange: jest.fn(),
+			onChange: vi.fn(),
 			analytics: analyticsMockFilled,
 		};
 

package/src/__tests__/components/Fields/ArrayFieldGroup/ArrayFieldGroup.test.tsx

@@ -1,13 +1,14 @@
+import type { MockedFunction } from "vitest";
 import ArrayFieldGroup, { type IProps } from "@ax/components/Fields/ArrayFieldGroup";
 import FieldsBehavior from "@ax/components/FieldsBehavior";
 import { parseTheme } from "@ax/helpers";
 import globalTheme from "@ax/themes/theme.json";
 
-import { mock } from "jest-mock-extended";
+import { mock } from "vitest-mock-extended";
 import configureStore from "redux-mock-store";
 import { ThemeProvider } from "styled-components";
 
-import { act, cleanup, fireEvent, render, screen } from "../../../../../config/jest/test-utils";
+import { act, cleanup, fireEvent, render, screen } from "../../../../../config/tests/test-utils";
 
 afterEach(cleanup);
 
@@ -107,7 +108,7 @@ describe("ArrayFieldGroup component rendering", () => {
 describe("ArrayFieldGroup component events", () => {
 	it("should call onChange when clicking the add button", async () => {
 		const props = makeProps();
-		const onChangeMock = props.onChange as jest.MockedFunction<IProps["onChange"]>;
+		const onChangeMock = props.onChange as MockedFunction<IProps["onChange"]>;
 
 		await renderGroup(props);
 
@@ -117,7 +118,7 @@ describe("ArrayFieldGroup component events", () => {
 
 	it("should call onChange when deleting an inline item", async () => {
 		const props = makeProps({ arrayType: "inline", innerFields: [makeField()] });
-		const onChangeMock = props.onChange as jest.MockedFunction<IProps["onChange"]>;
+		const onChangeMock = props.onChange as MockedFunction<IProps["onChange"]>;
 
 		await renderGroup(props);
 
@@ -154,7 +155,7 @@ describe("ArrayFieldGroup maxItems constraint", () => {
 
 	it("should not call onChange when the add button is clicked at maxItems", async () => {
 		const props = makeProps({ value: sampleValue, maxItems: 1 });
-		const onChangeMock = props.onChange as jest.MockedFunction<IProps["onChange"]>;
+		const onChangeMock = props.onChange as MockedFunction<IProps["onChange"]>;
 
 		await renderGroup(props);