@@ -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 ( {
0 commit comments