@trackunit/react-test-setup 1.0.17-alpha-b79b85624a2.0 → 1.0.17

package/index.cjs.js

@@ -1,6 +1,9 @@
 'use strict';
 
 var failOnConsole = require('jest-fail-on-console');
+var jsxRuntime = require('react/jsx-runtime');
+var reactGoogleMaps = require('@vis.gl/react-google-maps');
+var jestMocks = require('@googlemaps/jest-mocks');
 require('@testing-library/jest-dom');
 var react = require('@testing-library/react');
 var polyfill = require('@js-temporal/polyfill');
@@ -9,10 +12,8 @@ var web = require('@react-spring/web');
 /**
  * Sets up a mock implementation for HTML Canvas API in testing environments.
  *
- * This function delegates to the implementation in setupCanvasMockImpl.ts to provide
- * a mock implementation of the HTML Canvas API using jest-canvas-mock, allowing tests
- * to run without requiring a real DOM canvas.
- *
+ * This function uses jest-canvas-mock to provide a mock implementation of the
+ * HTML Canvas API, allowing tests to run without requiring a real DOM canvas.
  * Useful for testing components that use canvas rendering.
  *
  * @example
@@ -22,8 +23,8 @@ var web = require('@react-spring/web');
  * setupCanvasMock();
  */
 const setupCanvasMock = () => {
-    // eslint-disable-next-line @typescript-eslint/no-var-requires, @typescript-eslint/no-require-imports
-    require("./setupCanvasMockImpl").setupCanvasMock();
+    // eslint-disable-next-line @typescript-eslint/no-require-imports
+    require("jest-canvas-mock");
 };
 
 /**
@@ -45,11 +46,12 @@ const setupFailOnConsole = (overrides = {}) => {
     });
 };
 
+const getPlacePredictionsMock = jest.fn();
 /**
  * Sets up mocks for Google Maps API and @vis.gl/react-google-maps components in testing environments.
  *
- * This function delegates to the implementation in setupGoogleMapsImpl.tsx to configure
- * mock implementations of Maps, Markers, Geocoder, geometry functions, and places services,
+ * This function mocks both the Google Maps JavaScript API and React components from @vis.gl/react-google-maps.
+ * It provides mock implementations of Maps, Markers, Geocoder, geometry functions, and places services,
  * allowing tests of map-dependent components to run without requiring the actual Google Maps API.
  *
  * Key features:
@@ -65,27 +67,70 @@ const setupFailOnConsole = (overrides = {}) => {
  * setupGoogleMaps();
  */
 const setupGoogleMaps = () => {
-    // eslint-disable-next-line @typescript-eslint/no-var-requires, @typescript-eslint/no-require-imports
-    require("./setupGoogleMapsImpl").setupGoogleMaps();
+    //To create @vis.gl/react-google-maps mock, the initialization needs to be called
+    jestMocks.initialize();
+    jest.mock("@vis.gl/react-google-maps", () => {
+        const originalModule = jest.requireActual("@vis.gl/react-google-maps");
+        const mapOptions = { mapId: "Map 1" };
+        const map = new google.maps.Map(document.createElement("div"), mapOptions);
+        const AdvancedMarkerMock = jest.fn(props => {
+            return (jsxRuntime.jsx("div", { "data-position": JSON.stringify(props.position), "data-testid": "marker", children: props.children }));
+        });
+        const MapMock = jest.fn(props => {
+            return jsxRuntime.jsx("div", { "data-testid": "map", children: props.children });
+        });
+        const MapMarkerMock = jest.fn(props => {
+            return jsxRuntime.jsx("div", { "data-testid": "map", children: props.children });
+        });
+        return {
+            ...originalModule,
+            useApiLoadingStatus: () => reactGoogleMaps.APILoadingStatus.LOADED,
+            useApiIsLoaded: () => true,
+            useMap: () => map,
+            AdvancedMarker: AdvancedMarkerMock,
+            Map: MapMock,
+            Marker: MapMarkerMock,
+        };
+    });
+    beforeEach(() => {
+        jestMocks.initialize();
+        //Adding extras
+        global.window.google.maps = {
+            ...global.window.google.maps,
+            Geocoder: jest.fn(),
+            geometry: {
+                ...global.window.google.maps.geometry,
+                spherical: {
+                    computeDistanceBetween: jest.fn(),
+                    computeArea: jest.fn(),
+                    computeHeading: jest.fn(),
+                    computeLength: jest.fn(),
+                    computeOffset: jest.fn(),
+                    computeOffsetOrigin: jest.fn(),
+                    computeSignedArea: jest.fn(),
+                    interpolate: jest.fn(),
+                },
+            },
+            places: {
+                ...global.window.google.maps.places,
+                AutocompleteService: jest.fn().mockImplementation(() => ({
+                    ...global.window.google.maps.places,
+                    getPlacePredictions: getPlacePredictionsMock,
+                })),
+            },
+        };
+    });
 };
 
 /**
- * Sets up mocks for react-helmet-async in testing environments.
- *
- * This function delegates to the implementation in setupHelmetMockImpl.ts to create
- * simple mock implementations for the Helmet and HelmetProvider components from
- * react-helmet-async, allowing tests to run without requiring the actual library's
- * functionality.
- *
- * @example
- * // In your jest setup file
- * import { setupHelmetMock } from '@trackunit/react-test-setup';
- *
- * setupHelmetMock();
+ * Mock helmet module
+ * See more details here: https://www.npmjs.com/package/react-helmet-async
  */
 const setupHelmetMock = () => {
-    // eslint-disable-next-line @typescript-eslint/no-var-requires, @typescript-eslint/no-require-imports
-    require("./setupHelmetMockImpl").setupHelmetMock();
+    jest.mock("react-helmet-async", () => ({
+        Helmet: () => null,
+        HelmetProvider: () => null,
+    }));
 };
 
 /* eslint-disable @typescript-eslint/explicit-member-accessibility */
@@ -291,11 +336,10 @@ const setupReactTestingLibrary = () => {
 /**
  * Mocks the react-virtualized-auto-sizer component for testing environments.
  *
- * This function delegates to the implementation in setupReactVirtualizedAutoSizerImpl.ts
- * to create a mock implementation of the AutoSizer component, which is commonly used
- * to measure and adapt to container dimensions. Instead of actual dimension measurements,
- * the mock provides fixed dimensions (600x600), allowing tests to run consistently
- * without actual DOM measuring.
+ * This function creates a mock implementation of the AutoSizer component from
+ * react-virtualized-auto-sizer, which is commonly used to measure and adapt to
+ * container dimensions. Instead of actual dimension measurements, the mock provides
+ * fixed dimensions (600x600), allowing tests to run consistently without actual DOM measuring.
  *
  * This is especially useful for testing components that use virtualized lists or grids,
  * as it eliminates the need for setting up complex DOM environments just to get measurements.
@@ -307,8 +351,7 @@ const setupReactTestingLibrary = () => {
  * setupReactVirtualizedAutoSizer();
  */
 const setupReactVirtualizedAutoSizer = () => {
-    // eslint-disable-next-line @typescript-eslint/no-var-requires, @typescript-eslint/no-require-imports
-    require("./setupReactVirtualizedAutoSizerImpl").setupReactVirtualizedAutoSizer();
+    jest.mock("react-virtualized-auto-sizer", () => ({ children }) => children({ height: 600, width: 600, scaledWidth: 600, scaledHeight: 600 }));
 };
 
 /**
@@ -329,11 +372,10 @@ const setupResizeObserver = () => {
 /**
  * Mocks the @tanstack/react-virtual library for testing environments.
  *
- * This function delegates to the implementation in setupTanstackReactVirtualizeImpl.ts
- * to create a mock implementation of the useVirtualizer hook from the @tanstack/react-virtual
- * library, which is used for efficiently rendering large lists and grids. The mock
- * returns a simplified version that generates virtual items with deterministic sizes
- * and provides all expected methods.
+ * This function creates a mock implementation of the useVirtualizer hook from
+ * the @tanstack/react-virtual library, which is used for efficiently rendering
+ * large lists and grids. The mock returns a simplified version that generates
+ * virtual items with deterministic sizes and provides all expected methods.
  *
  * Each virtual item has:
  * - A consistent height (40px)
@@ -350,8 +392,26 @@ const setupResizeObserver = () => {
  * setupTanstackReactVirtual();
  */
 const setupTanstackReactVirtual = () => {
-    // eslint-disable-next-line @typescript-eslint/no-var-requires, @typescript-eslint/no-require-imports
-    require("./setupTanstackReactVirtualizeImpl").setupTanstackReactVirtual();
+    jest.mock("@tanstack/react-virtual", () => ({
+        useVirtualizer: ({ count }) => ({
+            getVirtualItems: () => {
+                const result = [];
+                for (let i = 0; i < count; i++) {
+                    result.push({ index: i, start: i * 40, key: i, measureRef: () => { } });
+                }
+                return result;
+            },
+            getTotalSize: () => count,
+            scrollToIndex: () => { },
+            scrollToOffset: () => { },
+            scrollToAlign: () => { },
+            scrollToItem: () => { },
+            resetAfterIndex: () => { },
+            resetAfterItem: () => { },
+            scrollTo: () => { },
+            measure: () => { },
+        }),
+    }));
 };
 
 /* eslint-disable @typescript-eslint/no-explicit-any */

package/index.esm.js

@@ -1,4 +1,7 @@
 import failOnConsole from 'jest-fail-on-console';
+import { jsx } from 'react/jsx-runtime';
+import { APILoadingStatus } from '@vis.gl/react-google-maps';
+import { initialize } from '@googlemaps/jest-mocks';
 import '@testing-library/jest-dom';
 import { cleanup, act } from '@testing-library/react';
 import { Temporal } from '@js-temporal/polyfill';
@@ -7,10 +10,8 @@ import { Globals } from '@react-spring/web';
 /**
  * Sets up a mock implementation for HTML Canvas API in testing environments.
  *
- * This function delegates to the implementation in setupCanvasMockImpl.ts to provide
- * a mock implementation of the HTML Canvas API using jest-canvas-mock, allowing tests
- * to run without requiring a real DOM canvas.
- *
+ * This function uses jest-canvas-mock to provide a mock implementation of the
+ * HTML Canvas API, allowing tests to run without requiring a real DOM canvas.
  * Useful for testing components that use canvas rendering.
  *
  * @example
@@ -20,8 +21,8 @@ import { Globals } from '@react-spring/web';
  * setupCanvasMock();
  */
 const setupCanvasMock = () => {
-    // eslint-disable-next-line @typescript-eslint/no-var-requires, @typescript-eslint/no-require-imports
-    require("./setupCanvasMockImpl").setupCanvasMock();
+    // eslint-disable-next-line @typescript-eslint/no-require-imports
+    require("jest-canvas-mock");
 };
 
 /**
@@ -43,11 +44,12 @@ const setupFailOnConsole = (overrides = {}) => {
     });
 };
 
+const getPlacePredictionsMock = jest.fn();
 /**
  * Sets up mocks for Google Maps API and @vis.gl/react-google-maps components in testing environments.
  *
- * This function delegates to the implementation in setupGoogleMapsImpl.tsx to configure
- * mock implementations of Maps, Markers, Geocoder, geometry functions, and places services,
+ * This function mocks both the Google Maps JavaScript API and React components from @vis.gl/react-google-maps.
+ * It provides mock implementations of Maps, Markers, Geocoder, geometry functions, and places services,
  * allowing tests of map-dependent components to run without requiring the actual Google Maps API.
  *
  * Key features:
@@ -63,27 +65,70 @@ const setupFailOnConsole = (overrides = {}) => {
  * setupGoogleMaps();
  */
 const setupGoogleMaps = () => {
-    // eslint-disable-next-line @typescript-eslint/no-var-requires, @typescript-eslint/no-require-imports
-    require("./setupGoogleMapsImpl").setupGoogleMaps();
+    //To create @vis.gl/react-google-maps mock, the initialization needs to be called
+    initialize();
+    jest.mock("@vis.gl/react-google-maps", () => {
+        const originalModule = jest.requireActual("@vis.gl/react-google-maps");
+        const mapOptions = { mapId: "Map 1" };
+        const map = new google.maps.Map(document.createElement("div"), mapOptions);
+        const AdvancedMarkerMock = jest.fn(props => {
+            return (jsx("div", { "data-position": JSON.stringify(props.position), "data-testid": "marker", children: props.children }));
+        });
+        const MapMock = jest.fn(props => {
+            return jsx("div", { "data-testid": "map", children: props.children });
+        });
+        const MapMarkerMock = jest.fn(props => {
+            return jsx("div", { "data-testid": "map", children: props.children });
+        });
+        return {
+            ...originalModule,
+            useApiLoadingStatus: () => APILoadingStatus.LOADED,
+            useApiIsLoaded: () => true,
+            useMap: () => map,
+            AdvancedMarker: AdvancedMarkerMock,
+            Map: MapMock,
+            Marker: MapMarkerMock,
+        };
+    });
+    beforeEach(() => {
+        initialize();
+        //Adding extras
+        global.window.google.maps = {
+            ...global.window.google.maps,
+            Geocoder: jest.fn(),
+            geometry: {
+                ...global.window.google.maps.geometry,
+                spherical: {
+                    computeDistanceBetween: jest.fn(),
+                    computeArea: jest.fn(),
+                    computeHeading: jest.fn(),
+                    computeLength: jest.fn(),
+                    computeOffset: jest.fn(),
+                    computeOffsetOrigin: jest.fn(),
+                    computeSignedArea: jest.fn(),
+                    interpolate: jest.fn(),
+                },
+            },
+            places: {
+                ...global.window.google.maps.places,
+                AutocompleteService: jest.fn().mockImplementation(() => ({
+                    ...global.window.google.maps.places,
+                    getPlacePredictions: getPlacePredictionsMock,
+                })),
+            },
+        };
+    });
 };
 
 /**
- * Sets up mocks for react-helmet-async in testing environments.
- *
- * This function delegates to the implementation in setupHelmetMockImpl.ts to create
- * simple mock implementations for the Helmet and HelmetProvider components from
- * react-helmet-async, allowing tests to run without requiring the actual library's
- * functionality.
- *
- * @example
- * // In your jest setup file
- * import { setupHelmetMock } from '@trackunit/react-test-setup';
- *
- * setupHelmetMock();
+ * Mock helmet module
+ * See more details here: https://www.npmjs.com/package/react-helmet-async
  */
 const setupHelmetMock = () => {
-    // eslint-disable-next-line @typescript-eslint/no-var-requires, @typescript-eslint/no-require-imports
-    require("./setupHelmetMockImpl").setupHelmetMock();
+    jest.mock("react-helmet-async", () => ({
+        Helmet: () => null,
+        HelmetProvider: () => null,
+    }));
 };
 
 /* eslint-disable @typescript-eslint/explicit-member-accessibility */
@@ -289,11 +334,10 @@ const setupReactTestingLibrary = () => {
 /**
  * Mocks the react-virtualized-auto-sizer component for testing environments.
  *
- * This function delegates to the implementation in setupReactVirtualizedAutoSizerImpl.ts
- * to create a mock implementation of the AutoSizer component, which is commonly used
- * to measure and adapt to container dimensions. Instead of actual dimension measurements,
- * the mock provides fixed dimensions (600x600), allowing tests to run consistently
- * without actual DOM measuring.
+ * This function creates a mock implementation of the AutoSizer component from
+ * react-virtualized-auto-sizer, which is commonly used to measure and adapt to
+ * container dimensions. Instead of actual dimension measurements, the mock provides
+ * fixed dimensions (600x600), allowing tests to run consistently without actual DOM measuring.
  *
  * This is especially useful for testing components that use virtualized lists or grids,
  * as it eliminates the need for setting up complex DOM environments just to get measurements.
@@ -305,8 +349,7 @@ const setupReactTestingLibrary = () => {
  * setupReactVirtualizedAutoSizer();
  */
 const setupReactVirtualizedAutoSizer = () => {
-    // eslint-disable-next-line @typescript-eslint/no-var-requires, @typescript-eslint/no-require-imports
-    require("./setupReactVirtualizedAutoSizerImpl").setupReactVirtualizedAutoSizer();
+    jest.mock("react-virtualized-auto-sizer", () => ({ children }) => children({ height: 600, width: 600, scaledWidth: 600, scaledHeight: 600 }));
 };
 
 /**
@@ -327,11 +370,10 @@ const setupResizeObserver = () => {
 /**
  * Mocks the @tanstack/react-virtual library for testing environments.
  *
- * This function delegates to the implementation in setupTanstackReactVirtualizeImpl.ts
- * to create a mock implementation of the useVirtualizer hook from the @tanstack/react-virtual
- * library, which is used for efficiently rendering large lists and grids. The mock
- * returns a simplified version that generates virtual items with deterministic sizes
- * and provides all expected methods.
+ * This function creates a mock implementation of the useVirtualizer hook from
+ * the @tanstack/react-virtual library, which is used for efficiently rendering
+ * large lists and grids. The mock returns a simplified version that generates
+ * virtual items with deterministic sizes and provides all expected methods.
  *
  * Each virtual item has:
  * - A consistent height (40px)
@@ -348,8 +390,26 @@ const setupResizeObserver = () => {
  * setupTanstackReactVirtual();
  */
 const setupTanstackReactVirtual = () => {
-    // eslint-disable-next-line @typescript-eslint/no-var-requires, @typescript-eslint/no-require-imports
-    require("./setupTanstackReactVirtualizeImpl").setupTanstackReactVirtual();
+    jest.mock("@tanstack/react-virtual", () => ({
+        useVirtualizer: ({ count }) => ({
+            getVirtualItems: () => {
+                const result = [];
+                for (let i = 0; i < count; i++) {
+                    result.push({ index: i, start: i * 40, key: i, measureRef: () => { } });
+                }
+                return result;
+            },
+            getTotalSize: () => count,
+            scrollToIndex: () => { },
+            scrollToOffset: () => { },
+            scrollToAlign: () => { },
+            scrollToItem: () => { },
+            resetAfterIndex: () => { },
+            resetAfterItem: () => { },
+            scrollTo: () => { },
+            measure: () => { },
+        }),
+    }));
 };
 
 /* eslint-disable @typescript-eslint/no-explicit-any */

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@trackunit/react-test-setup",
   "description": "Test setup utilities for React applications",
-  "version": "1.0.17-alpha-b79b85624a2.0",
+  "version": "1.0.17",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {

package/src/setupCanvasMock.d.ts

@@ -1,10 +1,8 @@
 /**
  * Sets up a mock implementation for HTML Canvas API in testing environments.
  *
- * This function delegates to the implementation in setupCanvasMockImpl.ts to provide
- * a mock implementation of the HTML Canvas API using jest-canvas-mock, allowing tests
- * to run without requiring a real DOM canvas.
- *
+ * This function uses jest-canvas-mock to provide a mock implementation of the
+ * HTML Canvas API, allowing tests to run without requiring a real DOM canvas.
  * Useful for testing components that use canvas rendering.
  *
  * @example

package/src/setupGoogleMaps.d.ts

@@ -1,8 +1,8 @@
 /**
  * Sets up mocks for Google Maps API and @vis.gl/react-google-maps components in testing environments.
  *
- * This function delegates to the implementation in setupGoogleMapsImpl.tsx to configure
- * mock implementations of Maps, Markers, Geocoder, geometry functions, and places services,
+ * This function mocks both the Google Maps JavaScript API and React components from @vis.gl/react-google-maps.
+ * It provides mock implementations of Maps, Markers, Geocoder, geometry functions, and places services,
  * allowing tests of map-dependent components to run without requiring the actual Google Maps API.
  *
  * Key features:

package/src/setupHelmetMock.d.ts

@@ -1,15 +1,5 @@
 /**
- * Sets up mocks for react-helmet-async in testing environments.
- *
- * This function delegates to the implementation in setupHelmetMockImpl.ts to create
- * simple mock implementations for the Helmet and HelmetProvider components from
- * react-helmet-async, allowing tests to run without requiring the actual library's
- * functionality.
- *
- * @example
- * // In your jest setup file
- * import { setupHelmetMock } from '@trackunit/react-test-setup';
- *
- * setupHelmetMock();
+ * Mock helmet module
+ * See more details here: https://www.npmjs.com/package/react-helmet-async
  */
 export declare const setupHelmetMock: () => void;

package/src/setupReactVirtualizedAutoSizer.d.ts

@@ -1,11 +1,10 @@
 /**
  * Mocks the react-virtualized-auto-sizer component for testing environments.
  *
- * This function delegates to the implementation in setupReactVirtualizedAutoSizerImpl.ts
- * to create a mock implementation of the AutoSizer component, which is commonly used
- * to measure and adapt to container dimensions. Instead of actual dimension measurements,
- * the mock provides fixed dimensions (600x600), allowing tests to run consistently
- * without actual DOM measuring.
+ * This function creates a mock implementation of the AutoSizer component from
+ * react-virtualized-auto-sizer, which is commonly used to measure and adapt to
+ * container dimensions. Instead of actual dimension measurements, the mock provides
+ * fixed dimensions (600x600), allowing tests to run consistently without actual DOM measuring.
  *
  * This is especially useful for testing components that use virtualized lists or grids,
  * as it eliminates the need for setting up complex DOM environments just to get measurements.

package/src/setupTanstackReactVirtualize.d.ts

@@ -1,11 +1,10 @@
 /**
  * Mocks the @tanstack/react-virtual library for testing environments.
  *
- * This function delegates to the implementation in setupTanstackReactVirtualizeImpl.ts
- * to create a mock implementation of the useVirtualizer hook from the @tanstack/react-virtual
- * library, which is used for efficiently rendering large lists and grids. The mock
- * returns a simplified version that generates virtual items with deterministic sizes
- * and provides all expected methods.
+ * This function creates a mock implementation of the useVirtualizer hook from
+ * the @tanstack/react-virtual library, which is used for efficiently rendering
+ * large lists and grids. The mock returns a simplified version that generates
+ * virtual items with deterministic sizes and provides all expected methods.
  *
  * Each virtual item has:
  * - A consistent height (40px)

package/src/setupCanvasMockImpl.d.ts

@@ -1,9 +0,0 @@
-/**
- * Implementation for HTML Canvas API mocking in testing environments.
- *
- * This function uses jest-canvas-mock to provide a mock implementation of the
- * HTML Canvas API, allowing tests to run without requiring a real DOM canvas.
- *
- * @internal
- */
-export declare const setupCanvasMock: () => void;

package/src/setupGoogleMapsImpl.d.ts

@@ -1,10 +0,0 @@
-/**
- * Implementation for Google Maps API and @vis.gl/react-google-maps mocks in testing environments.
- *
- * This function mocks both the Google Maps JavaScript API and React components from @vis.gl/react-google-maps.
- * It provides mock implementations of Maps, Markers, Geocoder, geometry functions, and places services,
- * allowing tests of map-dependent components to run without requiring the actual Google Maps API.
- *
- * @internal
- */
-export declare const setupGoogleMaps: () => void;

package/src/setupHelmetMockImpl.d.ts

@@ -1,10 +0,0 @@
-/**
- * Implementation for react-helmet-async mocking in testing environments.
- *
- * This function creates simple mock implementations for the Helmet and HelmetProvider
- * components from react-helmet-async, allowing tests to run without requiring the
- * actual library's functionality.
- *
- * @internal
- */
-export declare const setupHelmetMock: () => void;

package/src/setupReactVirtualizedAutoSizerImpl.d.ts

@@ -1,11 +0,0 @@
-/**
- * Implementation for react-virtualized-auto-sizer component mocking in testing environments.
- *
- * This function creates a mock implementation of the AutoSizer component from
- * react-virtualized-auto-sizer, which is commonly used to measure and adapt to
- * container dimensions. Instead of actual dimension measurements, the mock provides
- * fixed dimensions (600x600), allowing tests to run consistently without actual DOM measuring.
- *
- * @internal
- */
-export declare const setupReactVirtualizedAutoSizer: () => void;

package/src/setupTanstackReactVirtualizeImpl.d.ts

@@ -1,11 +0,0 @@
-/**
- * Implementation for @tanstack/react-virtual library mocking in testing environments.
- *
- * This function creates a mock implementation of the useVirtualizer hook from
- * the @tanstack/react-virtual library, which is used for efficiently rendering
- * large lists and grids. The mock returns a simplified version that generates
- * virtual items with deterministic sizes and provides all expected methods.
- *
- * @internal
- */
-export declare const setupTanstackReactVirtual: () => void;