@trackunit/react-core-contexts-test 0.1.243 → 0.1.246

package/index.esm.js

@@ -1,14 +1,1149 @@
-export { D as Debugger, T as TrackunitProvidersMockBuilder, i as doNothing, f as flushPromises, k as flushPromisesInAct, m as mockAnalyticsContext, b as mockAssetSortingContext, c as mockCurrentUserContext, d as mockEnvironmentContext, e as mockOemBrandingContext, g as mockToastContext, h as mockUserSubscriptionContext, q as queryFor, j as queryForHook, t as trackunitProviders, a as useDebugger, u as useIsFirstRender, v as validateIrisApp, w as waitForRenderTanstackRouterQuirk } from './index.esm2.js';
-import 'react/jsx-runtime';
-import '@testing-library/react';
-import '@trackunit/react-core-hooks';
-import 'lodash/omit';
-import '@apollo/client';
-import '@apollo/client/link/error';
-import '@apollo/client/testing';
-import '@trackunit/react-core-contexts-api';
-import '@trackunit/shared-utils';
-import '@apollo/client/react';
-import '@tanstack/react-router';
-import 'react';
-import 'graphql';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { act, render } from '@testing-library/react';
+import { ErrorHandlingContextProvider, CurrentUserProvider, AnalyticsContext, UserSubscriptionProvider, OemBrandingContextProvider, TokenProvider, ToastProvider, ConfirmationDialogProvider, FilterBarProvider, AssetSortingProvider, NavigationContextProvider, CurrentUserPreferenceProvider, EnvironmentContextProvider, ModalDialogContextProvider } from '@trackunit/react-core-hooks';
+import omit from 'lodash/omit';
+import { ApolloLink } from '@apollo/client';
+import { onError } from '@apollo/client/link/error';
+import { MockLink, MockedProvider } from '@apollo/client/testing';
+import { AssetSortByProperty, SortOrder } from '@trackunit/react-core-contexts-api';
+import { doNothing as doNothing$1, objectValues, objectKeys } from '@trackunit/shared-utils';
+import { useApolloClient } from '@apollo/client/react';
+import { createMemoryHistory, createRootRoute, createRoute, createRouter, RouterProvider, Outlet } from '@tanstack/react-router';
+import React, { useRef, useCallback, useMemo, useEffect } from 'react';
+import { GraphQLError } from 'graphql';
+
+const defaultOptions = {
+    mutate: {
+        errorPolicy: "all",
+    },
+    query: {
+        errorPolicy: "all",
+    },
+};
+/**
+ * This is a wrapper around the MockedProvider that logs errors to the console.
+ */
+function ApolloMockedProviderWithError(props) {
+    const isDebugging = !!process.env.VSCODE_INSPECTOR_OPTIONS || !!process.env.DEBUG;
+    const { mocks, ...otherProps } = props;
+    const mockLink = new MockLink(mocks, false, { showWarnings: props.forceDebugging || isDebugging });
+    const errorLoggingLink = onError(({ graphQLErrors, networkError }) => {
+        if (graphQLErrors) {
+            // eslint-disable-next-line array-callback-return
+            graphQLErrors.map(({ message, locations, path }) => {
+                if (props.forceDebugging || isDebugging) {
+                    // eslint-disable-next-line no-console
+                    console.log(`[GraphQL error]: Message: ${message}, Location: ${locations}, Path: ${path}`);
+                }
+            });
+        }
+        if (networkError && (props.forceDebugging || isDebugging)) {
+            // eslint-disable-next-line no-console
+            console.log(`[Network error]: ${networkError}`);
+        }
+    });
+    const link = ApolloLink.from([errorLoggingLink, mockLink]);
+    return (jsx(MockedProvider, { ...otherProps, defaultOptions: { ...defaultOptions, watchQuery: { fetchPolicy: "no-cache" } }, link: link }));
+}
+
+/**
+ * Do nothing
+ */
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const doNothing = () => {
+    /* Do nothing */
+};
+
+const mockAnalyticsContext = {
+    logEvent: doNothing,
+    logError: doNothing,
+    logPageView: doNothing,
+    setUserProperty: doNothing,
+};
+
+const mockAssetSortingContext = {
+    setSortBy: doNothing,
+    sortingState: {
+        sortBy: AssetSortByProperty.Criticality,
+        order: SortOrder.Desc,
+    },
+};
+
+const mockConfirmationDialogContext = {
+    confirm: doNothing,
+};
+
+/**
+ * Mocks the current user context
+ *
+ * @returns {ICurrentUserContext} - Returns the mocked current user context
+ */
+const mockCurrentUserContext = {
+    clientSideUserId: "751ea227-f199-4d00-925f-a608312c5e45",
+    userName: "",
+    userRole: "",
+    customerId: 12345,
+    userId: 154312,
+    tasUserId: "751ea227-f199-4d00-925f-a608312c5e45",
+    email: "",
+    name: "",
+    accountId: "",
+    assumedUser: null,
+    jobTitle: "",
+    isAuthenticated: true,
+    isVerified: true,
+    isTrackunitUser: false,
+    isAssuming: false,
+    isAccountOwner: true,
+};
+
+/**
+ * Mocks the current user context
+ *
+ * @returns {IUserPreferencesContext} - Returns the mocked current user context
+ */
+const mockCurrentUserPreferenceContext = {
+    language: "en",
+    setLanguage: doNothing,
+    timeZonePreference: "LOCAL_TIME_ZONE",
+    setTimeZonePreference: doNothing,
+    systemOfMeasurement: "SI",
+    setSystemOfMeasurement: doNothing,
+};
+
+const mockEnvironmentContext = {
+    auth: {
+        url: "",
+        clientId: "",
+        issuer: "",
+    },
+    managerClassicUrl: "https://sso.trackunit.com",
+    googleMapsApiKey: "",
+    amplitudeApiKey: "",
+    amplitudeApiEndpoint: "",
+    graphqlPublicUrl: "",
+    graphqlManagerUrl: "",
+    graphqlManagerImageUploadUrl: "",
+    graphqlInternalUrl: "",
+    graphqlReportUrl: "",
+    buildVersion: "",
+    commitNumber: 0,
+    buildDate: "",
+    irisAppSdkServerUrl: "",
+    publicUrl: "",
+    isFeatureBranch: false,
+    environment: "dev",
+    sentryDsn: "",
+    sessionId: "",
+    tracingHeaders: {
+        "X-TrackunitAppVersion": "",
+        "session-id": "",
+        "commit-number": 0,
+    },
+    trackunitRestApiUrl: "",
+    hubspotRequestAppAccessFormId: "",
+    uptimeId: "",
+    reportAccessCallback: "",
+    reportAccessClientId: "",
+};
+
+/**
+ * Mocks the ErrorHandlingContextValue
+ *
+ * @returns {ErrorHandlingContextValue} - Returns the mocked current user context
+ */
+const mockErrorHandlerContext = {
+    captureException: doNothing$1,
+    addBreadcrumb: doNothing$1,
+    setTag: doNothing$1,
+};
+
+const mockModalDialogContext = {
+    openModal: doNothing,
+    closeModal: doNothing,
+};
+
+const mockNavigationContext = {
+    hasAccessTo: (options) => {
+        return Promise.resolve(true);
+    },
+    gotoAssetHome: (assetId, options) => {
+        return Promise.resolve(true);
+    },
+    gotoSiteHome: (siteId, options) => {
+        return Promise.resolve(true);
+    },
+    gotoAppLibrary: (irisAppId) => {
+        return Promise.resolve(true);
+    },
+    gotoFleetApp: (options) => {
+        return Promise.resolve(true);
+    },
+    gotoCustomerHome: (customerId) => {
+        return Promise.resolve(true);
+    },
+    gotoAdmin: (url) => {
+        return Promise.resolve(true);
+    },
+    gotoMarketplace: () => {
+        return Promise.resolve(true);
+    },
+    reloadManager: () => {
+        return Promise.resolve(true);
+    },
+};
+
+const mockOemBrandingContext = {
+    getAllBrandingDetails: doNothing,
+    getOemBranding: async () => null,
+    getOemImage: doNothing,
+};
+
+const mockToastContext = {
+    addToast: doNothing,
+    setIsManifestError: doNothing,
+};
+
+/**
+ * This is a mock for the UserSubscriptionContext.
+ *
+ * @returns { IUserSubscriptionContext }- mock for the UserSubscriptionContext
+ */
+const mockUserSubscriptionContext = {
+    numberOfDaysWithAccessToHistoricalData: 30,
+    numberOfDaysWithAccessToHistoricalInsights: 30,
+    features: [],
+    loading: false,
+    packageType: "EXPAND_FLEET_OWNER",
+};
+
+const buildFlatRouteMap = (routes) => {
+    const routeMap = {};
+    routes.forEach(route => {
+        routeMap[route.id] = route;
+        if (Array.isArray(route.children)) {
+            Object.assign(routeMap, buildFlatRouteMap(route.children));
+        }
+    });
+    return routeMap;
+};
+/**
+ * This component is used to wrap the children of the RouterContainer to add a test root container
+ */
+const RootRouteDebugger = () => {
+    // const matches = useMatches();
+    // console.log(
+    //   "matches",
+    //   matches.map(match => match.routeId)
+    // );
+    return jsx(Outlet, {});
+};
+/**
+ * This component is used to wrap the children of the RouterContainer to add a test root container.
+ *
+ * @param addTestRootContainer boolean to add test root container
+ * @param children children to be wrapped
+ * @returns React.ReactElement
+ */
+const TestRenderChildren = ({ addTestRootContainer, children }) => {
+    return addTestRootContainer ? (jsx("div", { className: "inline-block h-[1000px] w-[1024px] scale-[.99]", "data-testid": "testRoot", style: {
+            "--tw-scale-x": "0.99",
+            "--tw-scale-y": "0.99",
+        }, children: children })) : (jsx("div", { children: children }));
+};
+/**
+ * This component is used to wrap the children of the RouterContainer to add a test root container.
+ *
+ * @param addTestRootContainer boolean to add test root container
+ * @param selectedRouterProps selected router props
+ * @param rootRoute root route
+ * @param children children to be wrapped
+ * @returns {React.ReactElement} children component wrapped in a test root container
+ */
+const RouterContainer = ({ addTestRootContainer, selectedRouterProps, rootRoute, children, }) => {
+    var _a, _b;
+    const client = useApolloClient();
+    // The current version of createMemoryHistory seem to have issues when NOT ending on / so adding a # will not effect what url is rendered but it seems to work
+    const memoryHistory = useRef(createMemoryHistory({
+        initialEntries: (_b = (_a = selectedRouterProps === null || selectedRouterProps === void 0 ? void 0 : selectedRouterProps.initialEntries) === null || _a === void 0 ? void 0 : _a.map(entry => entry.path + "#")) !== null && _b !== void 0 ? _b : ["/#"],
+        initialIndex: 0,
+    }));
+    const getChildren = useCallback(() => children, [children]);
+    const router = useMemo(() => {
+        var _a, _b;
+        let localRootRoute = rootRoute;
+        if (!localRootRoute) {
+            const route = createRootRoute({ component: RootRouteDebugger });
+            const childRoute = createRoute({
+                path: "/",
+                getParentRoute: () => route,
+                component: () => {
+                    return jsx(TestRenderChildren, { addTestRootContainer: addTestRootContainer, children: getChildren() });
+                },
+            });
+            route.addChildren([childRoute]);
+            localRootRoute = route;
+        }
+        else {
+            const pathsToRoute = buildFlatRouteMap([localRootRoute]);
+            objectValues(pathsToRoute).forEach(route => {
+                route.options.component = RootRouteDebugger;
+                route.lazyFn = undefined;
+            });
+            if (pathsToRoute.__root__) {
+                pathsToRoute.__root__.options.component = RootRouteDebugger;
+                pathsToRoute.__root__.options.beforeLoad = () => { };
+                pathsToRoute.__root__.lazyFn = undefined;
+            }
+            if (pathsToRoute["/"]) {
+                // This ensures / is not redirecting to default home route
+                pathsToRoute["/"].options.beforeLoad = () => { };
+            }
+            if ((((_a = selectedRouterProps === null || selectedRouterProps === void 0 ? void 0 : selectedRouterProps.initialEntries) === null || _a === void 0 ? void 0 : _a.length) || 0) > 0) {
+                (_b = selectedRouterProps === null || selectedRouterProps === void 0 ? void 0 : selectedRouterProps.initialEntries) === null || _b === void 0 ? void 0 : _b.forEach(entry => {
+                    const route = pathsToRoute[entry.route];
+                    if (route) {
+                        if (entry.component) {
+                            route.options.component = entry.component;
+                        }
+                        else {
+                            route.update({
+                                component: () => {
+                                    return (jsx(TestRenderChildren, { addTestRootContainer: addTestRootContainer, children: getChildren() }));
+                                },
+                            });
+                        }
+                    }
+                });
+            }
+            else {
+                const slashRoute = pathsToRoute["/"];
+                if (slashRoute) {
+                    slashRoute.options.component = () => (jsx(TestRenderChildren, { addTestRootContainer: addTestRootContainer, children: getChildren() }));
+                }
+                else {
+                    const childRoute = createRoute({
+                        path: "/",
+                        getParentRoute: () => localRootRoute,
+                        component: () => {
+                            return (jsx(TestRenderChildren, { addTestRootContainer: addTestRootContainer, children: getChildren() }));
+                        },
+                    });
+                    localRootRoute.addChildren([childRoute]);
+                }
+            }
+        }
+        return createRouter({
+            routeTree: localRootRoute,
+            history: memoryHistory.current,
+            context: {
+                hasAccessTo: async () => {
+                    return true;
+                },
+                showMarketplace: true,
+                showHelpCenter: true,
+                showAppLibrary: true,
+                client: null,
+                defaultUserRoute: "/",
+                isAuthenticated: true,
+            },
+        });
+        // Skipping this rule for now.
+        // Explicit calls to rerender() will create a new router as `children` is changed.
+        // This causes unexpected state updates in Tanstack router which make the test fail
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [rootRoute]);
+    const context = useMemo(() => ({
+        hasAccessTo: async () => true,
+        isAuthenticated: true,
+        client,
+        defaultUserRoute: "/",
+        ...((selectedRouterProps === null || selectedRouterProps === void 0 ? void 0 : selectedRouterProps.context) || {}),
+    }), [client, selectedRouterProps === null || selectedRouterProps === void 0 ? void 0 : selectedRouterProps.context]);
+    const ErrorComponent = ({ error }) => {
+        return jsxs(Fragment, { children: ["UNCAUGHT ERROR IN TEST: ", error instanceof Error ? error.message : error] });
+    };
+    return jsx(RouterProvider, { context: context, defaultErrorComponent: ErrorComponent, router: router });
+};
+
+/**
+ * Flushes all promises in the queue.
+ * This is useful when testing async code.
+ *
+ * @param waitTimeInMS - The amount of time to wait before resolving the promise.
+ * @returns {Promise<void>} - Returns a promise that resolves after the wait time.
+ */
+const flushPromises = (waitTimeInMS = 0) => {
+    return new Promise(resolve => {
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        if (global.ORG_setTimeout) {
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            return global.ORG_setTimeout(() => global.ORG_setTimeout(resolve, waitTimeInMS), 1);
+        }
+        else {
+            setTimeout(() => setTimeout(resolve, waitTimeInMS), 1);
+        }
+    });
+};
+/**
+ * Flushes all promises in the queue.
+ * This is useful when testing async code.
+ *
+ * @param waitTimeInMS - The amount of time to wait before resolving the promise.
+ * @returns {Promise<void>} - Returns a promise that resolves after the wait time.
+ */
+const flushPromisesInAct = (waitTimeInMS = 0) => {
+    return act(() => {
+        return new Promise(resolve => {
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            if (global.ORG_setTimeout) {
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                return global.ORG_setTimeout(() => global.ORG_setTimeout(resolve, waitTimeInMS), 1);
+            }
+            else {
+                setTimeout(() => setTimeout(resolve, waitTimeInMS), 1);
+            }
+        });
+    });
+};
+/**
+ * This is a temp hack to work around a Tanstack Router quirk.
+ * This will wait for the render to finish before resolving the promise.
+ *
+ * @param rerender - The rerender function.
+ */
+const waitForRenderTanstackRouterQuirk = async (rerender) => {
+    return await act(async () => {
+        rerender();
+        await flushPromises();
+    });
+};
+
+/**
+ * This builder allows you to enable trackunit providers using the builder pattern, and then call 1 of either:
+ * For React Components:
+ * - render
+ * For React Hooks:
+ * - renderHook
+ * For Storybook:
+ * - storybook
+ */
+class TrackunitProvidersMockBuilder {
+    constructor() {
+        this.selectedEnvironmentContext = mockEnvironmentContext;
+        this.selectedModalDialogContext = mockModalDialogContext;
+        this.selectedNavigationContext = mockNavigationContext;
+        this.selectedTokenContext = { token: "fakeToken" };
+        this.selectedApolloMocks = [];
+        this.selectedRouterProps = null;
+        this.selectedToastContext = mockToastContext;
+        this.selectedErrorHandler = mockErrorHandlerContext;
+        this.selectedConfirmationDialogContext = mockConfirmationDialogContext;
+        this.selectedAssetSortingContext = mockAssetSortingContext;
+        this.selectedCurrentUserContext = mockCurrentUserContext;
+        this.selectedCurrentUserPreferenceContext = mockCurrentUserPreferenceContext;
+        this.selectedAnalyticsContext = mockAnalyticsContext;
+        this.selectedOemBrandingContext = mockOemBrandingContext;
+        this.selectedUserSubscriptionContext = mockUserSubscriptionContext;
+        this.selectedFilterBarValues = { filterBarValues: {} };
+    }
+    /**
+     * Use this Analytics Context.
+     * Defaults to mockAnalyticsContext.
+     *
+     * This context is used by the useAnalytics hook from lib "@trackunit/react-core-hooks"
+     *
+     * @see mockAnalyticsContext
+     * @example
+     * ...
+     * it("should allow render", async () => {
+     *   await trackunitProviders().analytics(yourPartialAnalyticsMock).render(<YourTestComponent data-testid="yourTestId" />);
+     *   expect(screen.getByTestId("yourTestId")).toBeInTheDocument();
+     * });
+     * ...
+     * @example
+     * ...
+     * it("should allow renderHook", async () => {
+     *   const { result } = await trackunitProviders().analytics(yourPartialAnalyticsMock).renderHook(() => useYourTestHook());
+     *   expect(result.current).toEqual(anything());
+     * });
+     * ...
+     * @param analyticsContext - The analytics context to use.
+     * @returns { TrackunitProvidersMockBuilder } - The builder.
+     */
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    analytics(analyticsContext) {
+        this.selectedAnalyticsContext = { ...mockAnalyticsContext, ...analyticsContext };
+        return this;
+    }
+    /**
+     * Use this Environment Context.
+     * Defaults to mockEnvironmentContext.
+     *
+     * This context is used by the useEnvironment hook from lib "@trackunit/react-core-hooks"
+     *
+     * @see mockEnvironmentContext
+     * @example
+     * ...
+     * it("should allow render", async () => {
+     *   await trackunitProviders().environment(yourPartialEnvironmentsMock).render(<YourTestComponent data-testid="yourTestId" />);
+     *   expect(screen.getByTestId("yourTestId")).toBeInTheDocument();
+     * });
+     * ...
+     * @example
+     * ...
+     * it("should allow renderHook", async () => {
+     *   const { result } = await trackunitProviders().environment(yourPartialEnvironmentMock).renderHook(() => useYourTestHook());
+     *   expect(result.current).toEqual(anything());
+     * });
+     * ...
+     * @param environmentContext - The environment context to use.
+     * @returns { TrackunitProvidersMockBuilder } - The builder.
+     */
+    environment(environmentContext) {
+        this.selectedEnvironmentContext = { ...mockEnvironmentContext, ...environmentContext };
+        return this;
+    }
+    /**
+     * Use this Navigation Context.
+     * Defaults to mockNavigationContext.
+     *
+     * @see mockNavigationContext
+     * @example
+     * ...
+     * it("should allow render", async () => {
+     *   await trackunitProviders().navigation(yourPartialNavigationMock).render(<YourTestComponent data-testid="yourTestId" />);
+     *   expect(screen.getByTestId("yourTestId")).toBeInTheDocument();
+     * });
+     */
+    navigation(navigationContext) {
+        this.selectedNavigationContext = { ...mockNavigationContext, ...navigationContext };
+        return this;
+    }
+    /**
+     * Use this to pass in a differerent current user.
+     * Defaults to mockCurrentUserContext.
+     *
+     * This context is used by the useCurrentUser hook from lib "@trackunit/react-core-hooks"
+     *
+     * @see mockCurrentUserContext
+     * @example
+     * ...
+     * it("should allow render", async () => {
+     *   await trackunitProviders().currentUser(yourPartialCurrentUserMock).render(<YourTestComponent data-testid="yourTestId" />);
+     *   expect(screen.getByTestId("yourTestId")).toBeInTheDocument();
+     * });
+     * ...
+     * @example
+     * ...
+     * it("should allow renderHook", async () => {
+     *   const { result } = await trackunitProviders().currentUser(yourPartialCurrentUserMock).renderHook(() => useYourTestHook());
+     *   expect(result.current).toEqual(anything());
+     * });
+     * ...
+     * @returns { TrackunitProvidersMockBuilder } - The builder.
+     */
+    currentUser(currentUserContext) {
+        this.selectedCurrentUserContext = { ...mockCurrentUserContext, ...currentUserContext };
+        return this;
+    }
+    /**
+     * Use this to pass in a differerent current user preference.
+     * Defaults to mockCurrentUserPreferenceContext.
+     *
+     * This context is used by the useCurrentUserPreference hook from lib "@trackunit/react-core-hooks"
+     *
+     * @see mockCurrentUserPreferenceContext
+     * @example
+     * ...
+     * it("should allow render", async () => {
+     *   await trackunitProviders().currentUserPreference(yourPartialCurrentUserPreferenceMock).render(<YourTestComponent data-testid="yourTestId" />);
+     * expect(screen.getByTestId("yourTestId")).toBeInTheDocument();
+     * });
+     * ...
+     * @example
+     * ...
+     * it("should allow renderHook", async () => {
+     * const { result } = await trackunitProviders().currentUserPreference(yourPartialCurrentUserPreferenceMock).renderHook(() => useYourTestHook());
+     * expect(result.current).toEqual(anything());
+     * });
+     * ...
+     * @returns { TrackunitProvidersMockBuilder } - The builder.
+     */
+    currentUserPreference(currentUserPreferenceContext) {
+        this.selectedCurrentUserPreferenceContext = {
+            ...mockCurrentUserPreferenceContext,
+            ...currentUserPreferenceContext,
+        };
+        return this;
+    }
+    /**
+     * Use this to pass in a differerent filter bar values when working with pages with filterbar.
+     * Defaults to { filterBarValues: {} }.
+     *
+     * @param filterBarValues - The filter bar values to use.
+     * @example
+     * ...
+     * it("should allow render", async () => {
+     *  await trackunitProviders().filterBarValues(yourFilterBarValuesMock).render(<YourTestComponent data-testid="yourTestId" />);
+     * expect(screen.getByTestId("yourTestId")).toBeInTheDocument();
+     * });
+     * ...
+     * @example
+     * ...
+     * it("should allow renderHook", async () => {
+     * const { result } = await trackunitProviders().filterBarValues(yourFilterBarValuesMock).renderHook(() => useYourTestHook());
+     * expect(result.current).toEqual(anything());
+     * });
+     * ...
+     * @returns { TrackunitProvidersMockBuilder } - The builder.
+     */
+    filterBarValues(filterBarValues) {
+        this.selectedFilterBarValues = filterBarValues;
+        return this;
+    }
+    /**
+     * Use this to pass in a differerent current user subscription.
+     * Defaults to mockUserSubscriptionContext.
+     *
+     * This context is used by the useUserSubscription hook from lib "@trackunit/react-core-hooks"
+     *
+     * @see mockUserSubscriptionContext
+     * @example
+     * ...
+     * it("should allow render", async () => {
+     *   await trackunitProviders().userSubscription(yourPartialUserSubscriptionMock).render(<YourTestComponent data-testid="yourTestId" />);
+     *   expect(screen.getByTestId("yourTestId")).toBeInTheDocument();
+     * });
+     * ...
+     * @example
+     * ...
+     * it("should allow renderHook", async () => {
+     *   const { result } = await trackunitProviders().userSubscription(yourPartialUserSubscriptionMock).renderHook(() => useYourTestHook());
+     *   expect(result.current).toEqual(anything());
+     * });
+     * ...
+     * @returns { TrackunitProvidersMockBuilder } - The builder.
+     */
+    userSubscription(userSubscription) {
+        var _a;
+        //TODO DONT SUPPORT THE WIERD WAY OF PASSING FEATURES
+        const featuresConverted = ((_a = userSubscription.features) === null || _a === void 0 ? void 0 : _a.map(f => {
+            if (typeof f === "string") {
+                return { id: f, name: f };
+            }
+            return f;
+        })) || [];
+        this.selectedUserSubscriptionContext = {
+            ...mockUserSubscriptionContext,
+            ...omit(userSubscription, "features"),
+            features: [...(mockUserSubscriptionContext.features || []), ...featuresConverted],
+        };
+        return this;
+    }
+    /**
+     * Set global asset sorting context.
+     * Defaults to mockAssetSortingContext.
+     *
+     * This context is used by the useAssetSorting hook from lib "@trackunit/react-core-hooks"
+     *
+     * @see mockAssetSortingContext
+     * @example
+     * ...
+     * it("should allow render", async () => {
+     *   await trackunitProviders().assetSorting(yourPartialAssetSortingMock).render(<YourTestComponent data-testid="yourTestId" />);
+     *   expect(screen.getByTestId("yourTestId")).toBeInTheDocument();
+     * });
+     * ...
+     * @example
+     * ...
+     * it("should allow renderHook", async () => {
+     *   const { result } = await trackunitProviders().assetSorting(yourPartialAssetSortingMock).renderHook(() => useYourTestHook());
+     *   expect(result.current).toEqual(anything());
+     * });
+     * ...
+     * @param assetSortingContext - Override the default context.
+     * @returns { TrackunitProvidersMockBuilder } - The builder.
+     */
+    assetSorting(assetSortingContext) {
+        this.selectedAssetSortingContext = { ...mockAssetSortingContext, ...assetSortingContext };
+        return this;
+    }
+    /**
+     * Set OEM Branding context.
+     * Defaults to mockOemBrandingContext.
+     *
+     * This context is used by the useAssetSorting hook from lib "@trackunit/react-core-hooks"
+     *
+     * @see mockOemBrandingContext
+     * @example
+     * ...
+     * it("should allow render", async () => {
+     *   await trackunitProviders().oemBrandingContext(yourPartialOemBrandingMock).render(<YourTestComponent data-testid="yourTestId" />);
+     *   expect(screen.getByTestId("yourTestId")).toBeInTheDocument();
+     * });
+     * ...
+     * @example
+     * ...
+     * it("should allow renderHook", async () => {
+     *   const { result } = await trackunitProviders().oemBrandingContext(yourPartialOemBrandingMock).renderHook(() => useYourTestHook());
+     *   expect(result.current).toEqual(anything());
+     * });
+     * ...
+     * @param oemBrandingContext - Override the default context.
+     */
+    oemBrandingContext(oemBrandingContext) {
+        this.selectedOemBrandingContext = { ...mockOemBrandingContext, ...oemBrandingContext };
+        return this;
+    }
+    /**
+     * Use this ToastContext with the given mocks.
+     * Defaults to mockToastContext.
+     *
+     * This context is used by the useToast hook from lib "@trackunit/react-core-hooks"
+     *
+     * @see mockToastContext
+     * @example
+     * ...
+     * it("should allow render", async () => {
+     *   await trackunitProviders().toast(yourPartialToastMock).render(<YourTestComponent data-testid="yourTestId" />);
+     *   expect(screen.getByTestId("yourTestId")).toBeInTheDocument();
+     * });
+     * ...
+     * @example
+     * ...
+     * it("should allow renderHook", async () => {
+     *   const { result } = await trackunitProviders().toast(yourPartialToastMock).renderHook(() => useYourTestHook());
+     *   expect(result.current).toEqual(anything());
+     * });
+     * ...
+     * @param toastContext - Override the default toast context.
+     */
+    toast(toastContext) {
+        this.selectedToastContext = { ...mockToastContext, ...toastContext };
+        return this;
+    }
+    /**
+     * confirmationDialog
+     */
+    confirmationDialog(confirmationDialog) {
+        this.selectedConfirmationDialogContext = { ...mockConfirmationDialogContext, ...confirmationDialog };
+        return this;
+    }
+    /**
+     * modalDialog
+     */
+    modalDialog(modalDialog) {
+        this.selectedModalDialogContext = { ...mockModalDialogContext, ...modalDialog };
+        return this;
+    }
+    /**
+     * errorHandler
+     */
+    errorHandler(errorHandler) {
+        this.selectedErrorHandler = { ...mockErrorHandlerContext, ...errorHandler };
+        return this;
+    }
+    /**
+     * Use this token.
+     *
+     * This context is used by the useToken hook from lib "@trackunit/react-core-hooks"
+     *
+     * @example
+     * ...
+     * it("should allow render", async () => {
+     *   await trackunitProviders().token(yourMockedToken).render(<YourTestComponent data-testid="yourTestId" />);
+     *   expect(screen.getByTestId("yourTestId")).toBeInTheDocument();
+     * });
+     * ...
+     * @example
+     * ...
+     * it("should allow renderHook", async () => {
+     *   const { result } = await trackunitProviders().token(yourMockedToken).renderHook(() => useYourTestHook());
+     *   expect(result.current).toEqual(anything());
+     * });
+     * ...
+     * @param token - The token to use.
+     * @returns { TrackunitProvidersMockBuilder } - The builder.
+     */
+    token(token) {
+        this.selectedTokenContext = { token };
+        return this;
+    }
+    /**
+     * Use this Router Props with the given mocks.
+     *
+     * This is used to provide a MemoryRouter from lib "@tanstack/react-router"
+     *
+     * @example
+     * ...
+     * it("should allow render", async () => {
+     *   await trackunitProviders().routerProps(yourRouterPropsMock).render(<YourTestComponent data-testid="yourTestId" />);
+     *   expect(screen.getByTestId("yourTestId")).toBeInTheDocument();
+     * });
+     * ...
+     * @example
+     * ...
+     * it("should allow renderHook", async () => {
+     *   const { result } = await trackunitProviders().routerProps(yourRouterPropsMock).renderHook(() => useYourTestHook());
+     *   expect(result.current).toEqual(anything());
+     * });
+     * ...
+     * @param routerProps - The router props to use.
+     * @returns { TrackunitProvidersMockBuilder } - The builder.
+     */
+    routerProps(routerProps) {
+        this.selectedRouterProps = routerProps;
+        return this.rootRoute(routerProps.routeTree ? routerProps.routeTree : this.selectedRootRoute);
+    }
+    /**
+     * Use this Manager Apollo Context Provider with the given mocks.
+     *
+     * This context is used by the useQuery and useLazyQuery hook from lib "@apollo/client"
+     *
+     * @see https://www.apollographql.com/docs/react/development-testing/testing
+     * @example
+     * ...
+     * it("should allow render", async () => {
+     *   await trackunitProviders().apollo([yourApolloMocks]).render(<YourTestComponent data-testid="yourTestId" />);
+     *   expect(screen.getByTestId("yourTestId")).toBeInTheDocument();
+     * });
+     * ...
+     * @example
+     * ...
+     * it("should allow renderHook", async () => {
+     *   const { result } = await trackunitProviders().apollo([yourApolloMocks]).renderHook(() => useYourTestHook());
+     *   expect(result.current).toEqual(anything());
+     * });
+     * ...
+     * @param apolloMocks - The mocks to use for the ApolloProvider.
+     */
+    apollo(apolloMocks) {
+        this.selectedApolloMocks = apolloMocks || [];
+        return this;
+    }
+    /**
+     * Validate the mocks that has been supplied to make sure they make sense.
+     * Note: This function is overridden in builders extending this one.
+     *
+     * @returns {boolean} true or throws error if any invalid mocks
+     */
+    validateSuppliedMocks() {
+        return true;
+    }
+    rootRoute(rootRoute) {
+        this.selectedRootRoute = rootRoute;
+        return this;
+    }
+    /**
+     * Make sure this represent the same structure as the main index.tsx does.
+     *
+     * @param testChildren - the child element being tested.
+     * @param addTestRootContainer - if you want to add a root container to the test.
+     */
+    getMockedCompositionRoot(testChildren, forceDebugging = false) {
+        return (jsx(ErrorHandlingContextProvider, { value: this.selectedErrorHandler, children: jsx(CurrentUserProvider, { value: this.selectedCurrentUserContext, children: jsx(AnalyticsContext.Provider, { value: this.selectedAnalyticsContext, children: jsx(UserSubscriptionProvider, { value: this.selectedUserSubscriptionContext, children: jsx(OemBrandingContextProvider, { value: this.selectedOemBrandingContext, children: jsx(TokenProvider, { value: this.selectedTokenContext, children: jsx(ToastProvider, { value: this.selectedToastContext, children: jsx(ConfirmationDialogProvider, { value: this.selectedConfirmationDialogContext, children: jsx(FilterBarProvider, { value: { filterBarValues: this.selectedFilterBarValues }, children: jsx(AssetSortingProvider, { value: this.selectedAssetSortingContext, children: jsx(ApolloMockedProviderWithError, { addTypename: false, forceDebugging: forceDebugging, mocks: this.selectedApolloMocks, children: jsx(NavigationContextProvider, { value: this.selectedNavigationContext, children: jsx(CurrentUserPreferenceProvider, { value: this.selectedCurrentUserPreferenceContext, children: jsx(EnvironmentContextProvider, { value: this.selectedEnvironmentContext, children: jsx(ModalDialogContextProvider, { value: this.selectedModalDialogContext, children: testChildren }) }) }) }) }) }) }) }) }) }) }) }) }) }) }));
+    }
+    getMockedCompositionRootWithRouter(testChildren, addTestRootContainer = true, forceDebugging = false) {
+        const childrenWithRouter = (jsx(RouterContainer, { addTestRootContainer: addTestRootContainer, rootRoute: this.selectedRootRoute, selectedRouterProps: this.selectedRouterProps, children: testChildren }));
+        return this.getMockedCompositionRoot(childrenWithRouter, forceDebugging);
+    }
+    /**
+     * This will return the mocked composition root.
+     */
+    async renderHook(callback, parentElement) {
+        this.validateSuppliedMocks();
+        // This ensures correct act loading when using hooks and not loaded if this build is used for storybook
+        const hookRenderer = await import('./HookRenderer.esm.js');
+        return hookRenderer.reactHooksRenderHook(callback, children => this.getMockedCompositionRootWithRouter(parentElement ? parentElement(children) : children));
+    }
+    /**
+     * This will use react-testing-library.render the child in the correct mocked hierarchy of context providers.
+     *
+     * @see https://testing-library.com/docs/react-testing-library/api#render
+     * @param child - the child element being tested.
+     */
+    async render(child) {
+        this.validateSuppliedMocks();
+        let mountedcomponent;
+        await act(async () => {
+            mountedcomponent = render(child, {
+                wrapper: ({ children }) => this.getMockedCompositionRootWithRouter(children),
+            });
+            await flushPromises();
+        });
+        await act(async () => {
+            await flushPromises();
+        });
+        await act(async () => {
+            await flushPromises();
+        });
+        return mountedcomponent;
+    }
+    /**
+     *  This will return the children in the correct mocked hierarchy of context providers.
+     */
+    storybook(child) {
+        return this.getMockedCompositionRoot(child, true);
+    }
+}
+/**
+ * This is the default mock builder for the TrackunitProviders.
+ */
+const trackunitProviders = () => new TrackunitProvidersMockBuilder();
+
+/**
+ * Differentiate between the first and subsequent renders.
+ *
+ * @returns {boolean} Returns true if it is the first render, false otherwise.
+ */
+const useIsFirstRender = () => {
+    const renderRef = useRef(true);
+    if (renderRef.current === true) {
+        renderRef.current = false;
+        return true;
+    }
+    return renderRef.current;
+};
+/**
+ * Logs props that have changed.
+ * Use this for debugging which props force a component to re-render.
+ * This is a hook version of the class component lifecycle method `componentDidUpdate`.
+ * ALWAYS wrap in your own object.
+ *
+ * @param id optional id to use for logging or it will guess the id from the stack trace
+ * @param propsToWatch all the props to watch for changes
+ * @example
+ * const propsToWatch = { foo: props.foo, bar: props.bar };
+ * useDebugger(propsToWatch);
+ */
+const useDebugger = (propsToWatch, id) => {
+    const prevPropsRef = useRef(propsToWatch);
+    const uniqueId = useMemo(() => {
+        var _a;
+        // eslint-disable-next-line local-rules/no-typescript-assertion
+        let stackId = id || (propsToWatch && propsToWatch.id);
+        const stack = new Error().stack;
+        if (!stackId && stack) {
+            const stackLines = stack.split("\n");
+            for (let i = 0; i < stackLines.length; i++) {
+                const stackLine = stackLines[i];
+                if (stackLine === null || stackLine === void 0 ? void 0 : stackLine.includes("useDebugger")) {
+                    stackId = (_a = stackLines[i + 1]) === null || _a === void 0 ? void 0 : _a.trim().split(" ")[1];
+                    break;
+                }
+            }
+        }
+        return stackId || "unknown-id";
+    }, [id, propsToWatch]);
+    const isFirstRender = useIsFirstRender();
+    // eslint-disable-next-line no-console
+    console.log(isFirstRender ? "First-render" : "Re-render", uniqueId, window.location.pathname);
+    useEffect(() => {
+        // eslint-disable-next-line local-rules/prefer-custom-object-entries
+        const changedProps = Object.entries(propsToWatch || {}).reduce((result, [key, value]) => {
+            if (prevPropsRef.current && prevPropsRef.current[key] !== value) {
+                result[key + ""] = [prevPropsRef.current[key], value];
+            }
+            return result;
+        }, {});
+        if (objectKeys(changedProps).length > 0) {
+            // eslint-disable-next-line no-console
+            objectKeys(changedProps).forEach(changedProp => {
+                // eslint-disable-next-line no-console
+                console.log(`${uniqueId} changed property: ${changedProp}`);
+                // JSON stringify is used to avoid console.table from logging the object reference
+                const result = JSON.parse(JSON.stringify(changedProps[changedProp]));
+                const result0 = result[0];
+                const result1 = result[1];
+                result0 &&
+                    typeof result0 === "object" &&
+                    objectKeys(result0).forEach(prop => {
+                        result0[prop] = typeof result0[prop] === "object" ? JSON.stringify(result0[prop]) : result0[prop];
+                    });
+                result1 &&
+                    typeof result1 === "object" &&
+                    objectKeys(result1).forEach(prop => {
+                        result1[prop] = typeof result1[prop] === "object" ? JSON.stringify(result1[prop]) : result1[prop];
+                    });
+                // eslint-disable-next-line no-console
+                console.table([result0, result1]);
+            });
+            // eslint-disable-next-line no-console
+            console.dir(changedProps);
+        }
+        prevPropsRef.current = propsToWatch;
+    }, [propsToWatch, uniqueId]);
+};
+/**
+ * Debugger component for debugging state changes and re-renders.
+ *
+ * This component will log when it is mounted, re-renders or unmounted.
+ * It will also log when any of its props change.
+ *
+ * @param id optional id to use for logging
+ * @param stop if true, will stop execution and open debugger
+ * @param logPropsChanges optional object with props to watch for changes
+ * @param children the children to render
+ */
+const Debugger = ({ id, logPropsChanges, stop, children, }) => {
+    var _a, _b, _c, _d, _e, _f, _g;
+    const uniqueId = id ||
+        (
+        // @ts-ignore
+        (_e = (_d = (_c = (_b = (_a = React["__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED"]) === null || _a === void 0 ? void 0 : _a.ReactCurrentOwner) === null || _b === void 0 ? void 0 : _b.current) === null || _c === void 0 ? void 0 : _c._debugOwner) === null || _d === void 0 ? void 0 : _d.type) === null || _e === void 0 ? void 0 : _e.name) ||
+        ((_g = (_f = new Error().stack) === null || _f === void 0 ? void 0 : _f.split("\n")[2]) === null || _g === void 0 ? void 0 : _g.trim()) ||
+        "unknown-id";
+    useDebugger(logPropsChanges || {}, id);
+    useEffect(() => {
+        // eslint-disable-next-line no-console
+        console.log(`${uniqueId} Debugger is mounting`);
+        return () => {
+            // eslint-disable-next-line no-console
+            console.log(`${uniqueId} Debugger is unmounting`);
+        };
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    if (stop === true) {
+        // eslint-disable-next-line no-debugger
+        debugger;
+    }
+    return jsx("div", { className: "Debugger", children: children });
+};
+
+/**
+ *
+ * @param document Document that represents the specific GQL query / mutation schema.
+ * @param variables Variables that should be passed to the query / mutation.
+ * Note that an *exact* match between the mock and operation is necessary.
+ * @param data Data object to be returned.
+ * Note that *all* properties should be given a value, use `null` in place of `undefined`,
+ * otherwise nothing will be returned.
+ * @param error ApolloError object to be returned.
+ * @returns {MockedResponse} with data attached, this response can be passed to the mocked ApolloProvider.
+ * @see [Testing React components using MockedProvider and associated APIs](https://www.apollographql.com/docs/react/development-testing/testing/)
+ * @example
+ *  it("should show the brand fetched from graphql", async () => {
+ *   const mock = queryFor(GetDemoAssetDocument, {
+ *    assetId: "assetId",
+ *   });
+ *
+ *   AssetRuntime.getAssetInfo = jest.fn().mockResolvedValue({ assetId: "assetId" });
+ *   await trackunitProviders()
+ *     .apollo([mock])
+ *     .render(<App />);
+ *
+ *   # mock.data is the combined result of what is passed in from queryFor and what is generated by generateMockData
+ *   expect(screen.getByText(`Brand: ${mock.data.asset?.brand}`)).toBeInTheDocument();
+ * });
+ */
+const queryFor = (document, variables, data, error) => {
+    return {
+        request: {
+            query: document,
+            variables,
+        },
+        data,
+        newData: () => {
+            if (process.env.VSCODE_INSPECTOR_OPTIONS || process.env.DEBUG) {
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                const name = document.definitions[0].name.value;
+                // eslint-disable-next-line no-console
+                console.log("Found Response for: " +
+                    name +
+                    " for variables: " +
+                    JSON.stringify(variables, null, 2) +
+                    " Returning: " +
+                    "{ data: " +
+                    JSON.stringify(data, null, 2) +
+                    ", error: " +
+                    JSON.stringify(error, null, 2) +
+                    "}");
+            }
+            return {
+                data,
+                errors: error ? [new GraphQLError(error.message)] : undefined,
+            };
+        },
+    };
+};
+/**
+ *
+ * @param document Document that represents the specific GQL query / mutation schema.
+ * @param variables Variables that should be passed to the query / mutation.
+ * Note that an *exact* match between the mock and operation is necessary.
+ * @param data Data object to be returned.
+ * Note that *all* properties should be given a value, use `null` in place of `undefined`,
+ * otherwise nothing will be returned.
+ * @param error ApolloError object to be returned.
+ * @returns {MockedResponse} that can be passed to the mocked ApolloProvider.
+ * @see [Testing React components using MockedProvider and associated APIs](https://www.apollographql.com/docs/react/development-testing/testing/)
+ */
+const queryForHook = (hookFn, document, variables, data, error) => {
+    return {
+        request: {
+            query: document,
+            variables,
+        },
+        newData: () => {
+            if (process.env.VSCODE_INSPECTOR_OPTIONS || process.env.DEBUG) {
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                const name = document.definitions[0].name.value;
+                // eslint-disable-next-line no-console
+                console.log("Found Response for: " +
+                    name +
+                    " for variables: " +
+                    JSON.stringify(variables, null, 2) +
+                    " Returning: " +
+                    "{ data: " +
+                    JSON.stringify(data, null, 2) +
+                    ", error: " +
+                    JSON.stringify(error, null, 2) +
+                    "}");
+            }
+            return {
+                data,
+                errors: error ? [new GraphQLError(error.message)] : undefined,
+            };
+        },
+    };
+};
+
+/**
+ * This helps validate the IrisApp is exposed correctly it must expose:
+ * - bootstrap
+ * - mount
+ * - unmount
+ * According to the single spa spec.
+ *
+ * Your test could look like this
+ *
+ * @example
+ * import * as IrisApp from "./index";
+    describe("App", () => {
+      it("Should validate", async () => {
+        const result = await validateIrisApp(IrisApp);
+        expect(result).toBeNull();
+      });
+    });
+ * @param irisApp Import the index ts(x) file as above and pass it in.
+ * @returns {null|string} if everything is good - otherwise a string telling you what is wrong.
+ */
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const validateIrisApp = async (irisApp) => {
+    if (!irisApp.bootstrap || typeof irisApp.bootstrap !== "function") {
+        return "Missing a bootstrap function";
+    }
+    if (!irisApp.mount || typeof irisApp.mount !== "function") {
+        return "Missing a mount function";
+    }
+    if (!irisApp.unmount || typeof irisApp.unmount !== "function") {
+        return "Missing an unmount function";
+    }
+    if (irisApp.update && typeof irisApp.update !== "function") {
+        return "Update must be a function";
+    }
+    return null;
+};
+
+export { Debugger, TrackunitProvidersMockBuilder, doNothing, flushPromises, flushPromisesInAct, mockAnalyticsContext, mockAssetSortingContext, mockCurrentUserContext, mockEnvironmentContext, mockOemBrandingContext, mockToastContext, mockUserSubscriptionContext, queryFor, queryForHook, trackunitProviders, useDebugger, useIsFirstRender, validateIrisApp, waitForRenderTanstackRouterQuirk };