TanStackT
TanStack14mo ago
1 reply
yummy-teal

How to unit test (jest) route lazyRouteComponent?

Hi, i'm using lazyRouteComponent on Code Based Routing, but when i try to unit test (jest) which keep getting an error. any idea how to solve it?

...
const homeRoute = createRoute({
getParentRoute: () => privateLayoutRoute,
path: '/home',
component: lazyRouteComponent(() => import('../../pages/Home/Home')),
validateSearch: (search) => homeSchema.parse(search),
});
...

export async function RenderAllProvider(path: string = '/') {
const router = createRouter({
routeTree: routeTree,
history: createMemoryHistory({
initialEntries: [path],
}),
});

let renders: RenderResult = {} as RenderResult;

await act(async () => {
renders = render(
<QueryClientProvider client={queryClient}>
<MumzProvider loaded>
<HelmetProvider>
<RouterProvider router={router as any} />
</HelmetProvider>
</MumzProvider>
</QueryClientProvider>,
);
});

await act(async () => {
await router.navigate({ to: path });
});

return renders;
}
Screenshot_2024-12-12_at_1.24.50_PM.png
Was this page helpful?