Skip to content

Commit b31414c

Browse files
remove test duplication, cache case sensitive baespath
1 parent 1682b3e commit b31414c

File tree

2 files changed

+98
-216
lines changed

2 files changed

+98
-216
lines changed

packages/react-router/tests/router.test.tsx

Lines changed: 92 additions & 210 deletions
Original file line numberDiff line numberDiff line change
@@ -2670,67 +2670,20 @@ describe('rewriteBasepath utility', () => {
26702670
expect(router.state.location.pathname).toBe('/users')
26712671
})
26722672

2673-
it('should handle basepath with leading slash but without trailing slash', async () => {
2674-
const rootRoute = createRootRoute({
2675-
component: () => <Outlet />,
2676-
})
2677-
2678-
const usersRoute = createRoute({
2679-
getParentRoute: () => rootRoute,
2680-
path: '/users',
2681-
component: () => <div data-testid="users">Users</div>,
2682-
})
2683-
2684-
const routeTree = rootRoute.addChildren([usersRoute])
2685-
2686-
const router = createRouter({
2687-
routeTree,
2688-
history: createMemoryHistory({
2689-
initialEntries: ['/api/v1/users'],
2690-
}),
2691-
rewrite: rewriteBasepath({ basepath: '/api/v1' }), // With leading slash but no trailing slash
2692-
})
2693-
2694-
render(<RouterProvider router={router} />)
2695-
2696-
await waitFor(() => {
2697-
expect(screen.getByTestId('users')).toBeInTheDocument()
2698-
})
2699-
2700-
expect(router.state.location.pathname).toBe('/users')
2701-
})
2702-
2703-
it('should handle basepath without leading slash but with trailing slash', async () => {
2704-
const rootRoute = createRootRoute({
2705-
component: () => <Outlet />,
2706-
})
2707-
2708-
const usersRoute = createRoute({
2709-
getParentRoute: () => rootRoute,
2710-
path: '/users',
2711-
component: () => <div data-testid="users">Users</div>,
2712-
})
2713-
2714-
const routeTree = rootRoute.addChildren([usersRoute])
2715-
2716-
const router = createRouter({
2717-
routeTree,
2718-
history: createMemoryHistory({
2719-
initialEntries: ['/api/v1/users'],
2720-
}),
2721-
rewrite: rewriteBasepath({ basepath: 'api/v1/' }), // Without leading slash but with trailing slash
2722-
})
2723-
2724-
render(<RouterProvider router={router} />)
2725-
2726-
await waitFor(() => {
2727-
expect(screen.getByTestId('users')).toBeInTheDocument()
2728-
})
2729-
2730-
expect(router.state.location.pathname).toBe('/users')
2731-
})
2732-
2733-
it('should handle basepath without leading and trailing slashes', async () => {
2673+
it.each([
2674+
{
2675+
description: 'basepath with leading slash but without trailing slash',
2676+
basepath: '/api/v1',
2677+
},
2678+
{
2679+
description: 'basepath without leading slash but with trailing slash',
2680+
basepath: 'api/v1/',
2681+
},
2682+
{
2683+
description: 'basepath without leading and trailing slashes',
2684+
basepath: 'api/v1',
2685+
},
2686+
])('should handle $description', async ({ basepath }) => {
27342687
const rootRoute = createRootRoute({
27352688
component: () => <Outlet />,
27362689
})
@@ -2748,7 +2701,7 @@ describe('rewriteBasepath utility', () => {
27482701
history: createMemoryHistory({
27492702
initialEntries: ['/api/v1/users'],
27502703
}),
2751-
rewrite: rewriteBasepath({ basepath: 'api/v1' }), // Without leading and trailing slashes
2704+
rewrite: rewriteBasepath({ basepath }),
27522705
})
27532706

27542707
render(<RouterProvider router={router} />)
@@ -2760,171 +2713,100 @@ describe('rewriteBasepath utility', () => {
27602713
expect(router.state.location.pathname).toBe('/users')
27612714
})
27622715

2763-
it('should not resolve to 404 when basepath has trailing slash and URL matches', async () => {
2764-
const rootRoute = createRootRoute({
2765-
component: () => <Outlet />,
2766-
})
2767-
2768-
const homeRoute = createRoute({
2769-
getParentRoute: () => rootRoute,
2770-
path: '/',
2771-
component: () => <div data-testid="home">Home</div>,
2772-
})
2773-
2774-
const usersRoute = createRoute({
2775-
getParentRoute: () => rootRoute,
2776-
path: '/users',
2777-
component: () => <div data-testid="users">Users</div>,
2778-
})
2779-
2780-
const routeTree = rootRoute.addChildren([homeRoute, usersRoute])
2781-
2782-
const router = createRouter({
2783-
routeTree,
2784-
history: createMemoryHistory({
2785-
initialEntries: ['/my-app/'],
2786-
}),
2787-
rewrite: rewriteBasepath({ basepath: '/my-app/' }), // With trailing slash
2788-
})
2789-
2790-
render(<RouterProvider router={router} />)
2791-
2792-
await waitFor(() => {
2793-
expect(screen.getByTestId('home')).toBeInTheDocument()
2794-
})
2795-
2796-
expect(router.state.location.pathname).toBe('/')
2797-
expect(router.state.statusCode).toBe(200)
2798-
})
2799-
2800-
it('should not resolve to 404 when basepath has no trailing slash and URL matches', async () => {
2801-
const rootRoute = createRootRoute({
2802-
component: () => <Outlet />,
2803-
})
2804-
2805-
const homeRoute = createRoute({
2806-
getParentRoute: () => rootRoute,
2807-
path: '/',
2808-
component: () => <div data-testid="home">Home</div>,
2809-
})
2810-
2811-
const usersRoute = createRoute({
2812-
getParentRoute: () => rootRoute,
2813-
path: '/users',
2814-
component: () => <div data-testid="users">Users</div>,
2815-
})
2816-
2817-
const routeTree = rootRoute.addChildren([homeRoute, usersRoute])
2818-
2819-
const router = createRouter({
2820-
routeTree,
2821-
history: createMemoryHistory({
2822-
initialEntries: ['/my-app'],
2823-
}),
2824-
rewrite: rewriteBasepath({ basepath: '/my-app' }), // Without trailing slash
2825-
})
2826-
2827-
render(<RouterProvider router={router} />)
2828-
2829-
await waitFor(() => {
2830-
expect(screen.getByTestId('home')).toBeInTheDocument()
2831-
})
2832-
2833-
expect(router.state.location.pathname).toBe('/')
2834-
expect(router.state.statusCode).toBe(200)
2835-
})
2836-
2837-
it('should handle basepath with trailing slash when navigating to root path', async () => {
2838-
const rootRoute = createRootRoute({
2839-
component: () => <Outlet />,
2840-
})
2841-
2842-
const homeRoute = createRoute({
2843-
getParentRoute: () => rootRoute,
2844-
path: '/',
2845-
component: () => (
2846-
<div>
2847-
<Link to="/about" data-testid="about-link">
2848-
About
2849-
</Link>
2850-
</div>
2851-
),
2852-
})
2853-
2854-
const aboutRoute = createRoute({
2855-
getParentRoute: () => rootRoute,
2856-
path: '/about',
2857-
component: () => <div data-testid="about">About</div>,
2858-
})
2716+
it.each([
2717+
{ description: 'has trailing slash', basepath: '/my-app/' },
2718+
{ description: 'has no trailing slash', basepath: '/my-app' },
2719+
])(
2720+
'should not resolve to 404 when basepath $description and URL matches',
2721+
async ({ basepath }) => {
2722+
const rootRoute = createRootRoute({
2723+
component: () => <Outlet />,
2724+
})
28592725

2860-
const routeTree = rootRoute.addChildren([homeRoute, aboutRoute])
2726+
const homeRoute = createRoute({
2727+
getParentRoute: () => rootRoute,
2728+
path: '/',
2729+
component: () => <div data-testid="home">Home</div>,
2730+
})
28612731

2862-
const history = createMemoryHistory({ initialEntries: ['/my-app/'] })
2732+
const usersRoute = createRoute({
2733+
getParentRoute: () => rootRoute,
2734+
path: '/users',
2735+
component: () => <div data-testid="users">Users</div>,
2736+
})
28632737

2864-
const router = createRouter({
2865-
routeTree,
2866-
history,
2867-
rewrite: rewriteBasepath({ basepath: '/my-app/' }), // With trailing slash
2868-
})
2738+
const routeTree = rootRoute.addChildren([homeRoute, usersRoute])
28692739

2870-
render(<RouterProvider router={router} />)
2740+
const router = createRouter({
2741+
routeTree,
2742+
history: createMemoryHistory({
2743+
initialEntries: ['/my-app/'],
2744+
}),
2745+
rewrite: rewriteBasepath({ basepath }),
2746+
})
28712747

2872-
const aboutLink = await screen.findByTestId('about-link')
2873-
fireEvent.click(aboutLink)
2748+
render(<RouterProvider router={router} />)
28742749

2875-
await waitFor(() => {
2876-
expect(screen.getByTestId('about')).toBeInTheDocument()
2877-
})
2750+
await waitFor(() => {
2751+
expect(screen.getByTestId('home')).toBeInTheDocument()
2752+
})
28782753

2879-
expect(router.state.location.pathname).toBe('/about')
2880-
expect(history.location.pathname).toBe('/my-app/about')
2881-
})
2754+
expect(router.state.location.pathname).toBe('/')
2755+
expect(router.state.statusCode).toBe(200)
2756+
},
2757+
)
28822758

2883-
it('should handle basepath without trailing slash when navigating to root path', async () => {
2884-
const rootRoute = createRootRoute({
2885-
component: () => <Outlet />,
2886-
})
2759+
it.each([
2760+
{ description: 'with trailing slash', basepath: '/my-app/' },
2761+
{ description: 'without trailing slash', basepath: '/my-app' },
2762+
])(
2763+
'should handle basepath $description when navigating to root path',
2764+
async ({ basepath }) => {
2765+
const rootRoute = createRootRoute({
2766+
component: () => <Outlet />,
2767+
})
28872768

2888-
const homeRoute = createRoute({
2889-
getParentRoute: () => rootRoute,
2890-
path: '/',
2891-
component: () => (
2892-
<div>
2893-
<Link to="/about" data-testid="about-link">
2894-
About
2895-
</Link>
2896-
</div>
2897-
),
2898-
})
2769+
const homeRoute = createRoute({
2770+
getParentRoute: () => rootRoute,
2771+
path: '/',
2772+
component: () => (
2773+
<div>
2774+
<Link to="/about" data-testid="about-link">
2775+
About
2776+
</Link>
2777+
</div>
2778+
),
2779+
})
28992780

2900-
const aboutRoute = createRoute({
2901-
getParentRoute: () => rootRoute,
2902-
path: '/about',
2903-
component: () => <div data-testid="about">About</div>,
2904-
})
2781+
const aboutRoute = createRoute({
2782+
getParentRoute: () => rootRoute,
2783+
path: '/about',
2784+
component: () => <div data-testid="about">About</div>,
2785+
})
29052786

2906-
const routeTree = rootRoute.addChildren([homeRoute, aboutRoute])
2787+
const routeTree = rootRoute.addChildren([homeRoute, aboutRoute])
29072788

2908-
const history = createMemoryHistory({ initialEntries: ['/my-app'] })
2789+
const history = createMemoryHistory({ initialEntries: ['/my-app/'] })
29092790

2910-
const router = createRouter({
2911-
routeTree,
2912-
history,
2913-
rewrite: rewriteBasepath({ basepath: '/my-app' }), // Without trailing slash
2914-
})
2791+
const router = createRouter({
2792+
routeTree,
2793+
history,
2794+
rewrite: rewriteBasepath({ basepath }),
2795+
})
29152796

2916-
render(<RouterProvider router={router} />)
2797+
render(<RouterProvider router={router} />)
29172798

2918-
const aboutLink = await screen.findByTestId('about-link')
2919-
fireEvent.click(aboutLink)
2799+
const aboutLink = await screen.findByTestId('about-link')
2800+
fireEvent.click(aboutLink)
29202801

2921-
await waitFor(() => {
2922-
expect(screen.getByTestId('about')).toBeInTheDocument()
2923-
})
2802+
await waitFor(() => {
2803+
expect(screen.getByTestId('about')).toBeInTheDocument()
2804+
})
29242805

2925-
expect(router.state.location.pathname).toBe('/about')
2926-
expect(history.location.pathname).toBe('/my-app/about')
2927-
})
2806+
expect(router.state.location.pathname).toBe('/about')
2807+
expect(history.location.pathname).toBe('/my-app/about')
2808+
},
2809+
)
29282810

29292811
it('should handle empty basepath gracefully', async () => {
29302812
const rootRoute = createRootRoute({

packages/router-core/src/rewrite.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -25,18 +25,18 @@ export function rewriteBasepath(opts: {
2525
const trimmedBasepath = trimPath(opts.basepath)
2626
const normalizedBasepath = `/${trimmedBasepath}`
2727
const normalizedBasepathWithSlash = `${normalizedBasepath}/`
28+
const checkBasepath = opts.caseSensitive
29+
? normalizedBasepath
30+
: normalizedBasepath.toLowerCase()
31+
const checkBasepathWithSlash = opts.caseSensitive
32+
? normalizedBasepathWithSlash
33+
: normalizedBasepathWithSlash.toLowerCase()
2834

2935
return {
3036
input: ({ url }) => {
3137
const pathname = opts.caseSensitive
3238
? url.pathname
3339
: url.pathname.toLowerCase()
34-
const checkBasepath = opts.caseSensitive
35-
? normalizedBasepath
36-
: normalizedBasepath.toLowerCase()
37-
const checkBasepathWithSlash = opts.caseSensitive
38-
? normalizedBasepathWithSlash
39-
: normalizedBasepathWithSlash.toLowerCase()
4040

4141
// Handle exact basepath match (e.g., /my-app -> /)
4242
if (pathname === checkBasepath) {

0 commit comments

Comments
 (0)