|
1 |
| -import { describe, it, expect } from "vitest"; |
| 1 | +import { describe, it, expect, beforeEach } from "vitest"; |
2 | 2 | import { act, render, waitFor } from "@testing-library/react";
|
3 |
| -import { createMemoryHistory, createRouter, RouterProvider } from "@tanstack/react-router"; |
4 |
| -import { routeTree } from "../../src/routeTree.gen"; |
| 3 | +import { createMemoryHistory, createRootRoute, createRoute, createRouter, RouterHistory, RouterProvider } from "@tanstack/react-router"; |
5 | 4 | import { ThemeProvider } from "@quassel/ui";
|
6 | 5 | import { $session } from "../../src/stores/session";
|
7 | 6 | import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
|
| 7 | +import { Route as AuthImport } from "../../src/routes/_auth"; |
| 8 | +import { Route as SessionImport } from "../../src/routes/session"; |
8 | 9 |
|
9 | 10 | describe("_auth route", () => {
|
10 |
| - it("should redirect to /session if not logged in", async () => { |
11 |
| - const history = createMemoryHistory({ initialEntries: ["/"] }); |
| 11 | + let history: RouterHistory; |
| 12 | + let renderStage: () => void; |
| 13 | + |
| 14 | + beforeEach(async () => { |
| 15 | + history = createMemoryHistory({ initialEntries: ["/"] }); |
| 16 | + const rootRoute = createRootRoute(); |
| 17 | + const AuthRoute = AuthImport.update({ |
| 18 | + id: "/_auth", |
| 19 | + getParentRoute: () => rootRoute, |
| 20 | + } as never); |
| 21 | + const SessionRoute = SessionImport.update({ |
| 22 | + id: "/session", |
| 23 | + path: "/session", |
| 24 | + getParentRoute: () => rootRoute, |
| 25 | + } as never); |
| 26 | + const IndexRoute = createRoute({ path: "/", component: () => <div>Index</div>, getParentRoute: () => AuthRoute }); |
| 27 | + |
| 28 | + const routeTree = rootRoute.addChildren([IndexRoute, AuthRoute, SessionRoute]); |
12 | 29 | const queryClient = new QueryClient();
|
13 | 30 | const router = createRouter({ routeTree, history, context: { queryClient } });
|
14 | 31 |
|
15 |
| - render( |
16 |
| - <QueryClientProvider client={queryClient}> |
17 |
| - <ThemeProvider> |
18 |
| - <RouterProvider router={router} /> |
19 |
| - </ThemeProvider> |
20 |
| - </QueryClientProvider> |
21 |
| - ); |
| 32 | + await router.load(); |
| 33 | + |
| 34 | + renderStage = () => |
| 35 | + render( |
| 36 | + <QueryClientProvider client={queryClient}> |
| 37 | + <ThemeProvider> |
| 38 | + <RouterProvider router={router as never} /> |
| 39 | + </ThemeProvider> |
| 40 | + </QueryClientProvider> |
| 41 | + ); |
| 42 | + }); |
| 43 | + |
| 44 | + it("should redirect to /session if not logged in", async () => { |
| 45 | + renderStage(); |
22 | 46 |
|
23 | 47 | await waitFor(() => {
|
24 | 48 | expect(history.location.pathname).toBe("/session");
|
25 | 49 | });
|
26 | 50 | });
|
27 | 51 |
|
28 | 52 | it("should not redirect to /session if logged in", async () => {
|
29 |
| - const history = createMemoryHistory({ initialEntries: ["/"] }); |
30 |
| - const queryClient = new QueryClient(); |
31 |
| - const router = createRouter({ routeTree, history, context: { queryClient } }); |
32 |
| - |
33 | 53 | act(() => {
|
34 | 54 | $session.set({ email: "hans.kanns@example.com" });
|
35 | 55 | });
|
36 | 56 |
|
37 |
| - render( |
38 |
| - <QueryClientProvider client={queryClient}> |
39 |
| - <ThemeProvider> |
40 |
| - <RouterProvider router={router} /> |
41 |
| - </ThemeProvider> |
42 |
| - </QueryClientProvider> |
43 |
| - ); |
| 57 | + renderStage(); |
44 | 58 |
|
45 | 59 | await waitFor(() => {
|
46 | 60 | expect(history.location.pathname).toBe("/");
|
|
0 commit comments