refactor(router-core): interpolatePath skips optional segments w/ nullish param value (#5934)

Author: Sheraff

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

@@ -1146,7 +1146,7 @@ describe('router.navigate navigation using optional path parameters - edge cases
     })
     await router.invalidate()
 
-    expect(router.state.location.pathname).toBe('/files/prefix.txt')
+    expect(router.state.location.pathname).toBe('/files')
 
     // Add the name parameter back
     await router.navigate({
@@ -1236,7 +1236,7 @@ describe('router.navigate navigation using optional path parameters - edge cases
     })
     await router.invalidate()
 
-    expect(router.state.location.pathname).toBe('/files/prefix.txt')
+    expect(router.state.location.pathname).toBe('/files')
   })
 })
 

packages/react-router/tests/optional-path-params.test.tsx

@@ -578,7 +578,7 @@ describe('React Router - Optional Path Parameters', () => {
       const filesLink = await screen.findByTestId('files-link')
       const docLink = await screen.findByTestId('doc-link')
 
-      expect(filesLink).toHaveAttribute('href', '/files/prefix.txt')
+      expect(filesLink).toHaveAttribute('href', '/files')
       expect(docLink).toHaveAttribute('href', '/files/prefixdocument.txt')
     })
   })

packages/router-core/src/path.ts

@@ -320,22 +320,15 @@ export function interpolatePath({
 
     if (kind === SEGMENT_TYPE_OPTIONAL_PARAM) {
       const key = path.substring(segment[2], segment[3])
-      const prefix = path.substring(start, segment[1])
-      const suffix = path.substring(segment[4], end)
       const valueRaw = params[key]
 
       // Check if optional parameter is missing or undefined
-      if (valueRaw == null) {
-        if (prefix || suffix) {
-          // For optional params with prefix/suffix, keep the prefix/suffix but omit the param
-          joined += '/' + prefix + suffix
-        }
-        // If no prefix/suffix, omit the entire segment
-        continue
-      }
+      if (valueRaw == null) continue
 
       usedParams[key] = valueRaw
 
+      const prefix = path.substring(start, segment[1])
+      const suffix = path.substring(segment[4], end)
       const value = encodeParam(key, params, decodeCharMap) ?? ''
       joined += '/' + prefix + value + suffix
       continue

packages/router-core/tests/optional-path-params.test.ts

@@ -205,6 +205,12 @@ describe('Optional Path Parameters', () => {
         name: 'optional param with prefix - omitted',
         path: '/posts/prefix{-$category}',
         params: {},
+        result: '/posts',
+      },
+      {
+        name: 'optional param with prefix - empty string',
+        path: '/posts/prefix{-$category}',
+        params: { category: '' },
         result: '/posts/prefix',
       },
       {
@@ -217,6 +223,12 @@ describe('Optional Path Parameters', () => {
         name: 'optional param with suffix - omitted',
         path: '/posts/{-$category}.html',
         params: {},
+        result: '/posts',
+      },
+      {
+        name: 'optional param with suffix - empty string',
+        path: '/posts/{-$category}.html',
+        params: { category: '' },
         result: '/posts/.html',
       },
       {
@@ -229,6 +241,12 @@ describe('Optional Path Parameters', () => {
         name: 'optional param with prefix and suffix - omitted',
         path: '/posts/prefix{-$category}suffix',
         params: {},
+        result: '/posts',
+      },
+      {
+        name: 'optional param with prefix and suffix - empty string',
+        path: '/posts/prefix{-$category}suffix',
+        params: { category: '' },
         result: '/posts/prefixsuffix',
       },
       {

packages/solid-router/tests/navigate.test.tsx

@@ -1170,7 +1170,7 @@ describe('router.navigate navigation using optional path parameters - edge cases
     })
     await router.invalidate()
 
-    expect(router.state.location.pathname).toBe('/files/prefix.txt')
+    expect(router.state.location.pathname).toBe('/files')
 
     // Add the name parameter back
     await router.navigate({
@@ -1260,7 +1260,7 @@ describe('router.navigate navigation using optional path parameters - edge cases
     })
     await router.invalidate()
 
-    expect(router.state.location.pathname).toBe('/files/prefix.txt')
+    expect(router.state.location.pathname).toBe('/files')
   })
 })
 

packages/solid-router/tests/optional-path-params.test.tsx

@@ -579,7 +579,7 @@ describe('Solid Router - Optional Path Parameters', () => {
       const filesLink = await screen.findByTestId('files-link')
       const docLink = await screen.findByTestId('doc-link')
 
-      expect(filesLink).toHaveAttribute('href', '/files/prefix.txt')
+      expect(filesLink).toHaveAttribute('href', '/files')
       expect(docLink).toHaveAttribute('href', '/files/prefixdocument.txt')
     })
   })