fix: Add encoding for additional special characters in encodeQueryValue

packages/nuqs/src/lib/url-encoding.test.ts

@@ -36,7 +36,7 @@ describe('url-encoding/encodeQueryValue', () => {
     expect(encodeQueryValue(input)).toBe(input)
   })
   test('Other special characters are passed through', () => {
-    const input = '-._~!$()*,;=:@/?[]{}\\|^'
+    const input = '-._~!$()*,;=:@/[]'
     expect(encodeQueryValue(input)).toBe(input)
   })
   test('practical use-cases', () => {
@@ -80,7 +80,9 @@ describe('url-encoding/renderQueryString', () => {
   test('encoding', () => {
     const search = new URLSearchParams()
     search.set('test', '-._~!$()*,;=:@/?[]{}\\|^')
-    expect(renderQueryString(search)).toBe('?test=-._~!$()*,;=:@/?[]{}\\|^')
+    expect(renderQueryString(search)).toBe(
+      '?test=-._~!$()*,;=:@/%3F[]%7B%7D%5C%7C%5E'
+    )
   })
   test('decoding', () => {
     const search = new URLSearchParams()
@@ -132,7 +134,9 @@ describe('url-encoding/renderQueryString', () => {
       const search = new URLSearchParams()
       search.set('filter', value)
       const query = renderQueryString(search)
-      expect(query.slice('?filter='.length)).toBe(value)
+      expect(query.slice('?filter='.length)).toBe(
+        'leftOfBicycleLane:car_lanes,curb%7CpavementHasShops:true%7CpavementWidth:narrow'
+      )
     }
     {
       const url = new URL(

packages/nuqs/src/lib/url-encoding.ts

@@ -42,6 +42,13 @@ export function encodeQueryValue(input: string): string {
       .replace(/`/g, '%60')
       .replace(/</g, '%3C')
       .replace(/>/g, '%3E')
+      .replace(/{/g, '%7B')
+      .replace(/}/g, '%7D')
+      .replace(/\|/g, '%7C')
+      .replace(/\\/g, '%5C')
+      .replace(/\^/g, '%5E')
+      .replace(/`/g, '%60')
+      .replace(/\?/g, '%3F')
       // Encode invisible ASCII control characters
       .replace(/[\x00-\x1F]/g, char => encodeURIComponent(char))
   )

packages/nuqs/src/serializer.test.ts

@@ -136,7 +136,7 @@ describe('serializer', () => {
       json: { foo: 'bar' }
     })
     expect(result).toBe(
-      '?int=0&str=&bool=false&arr=&json={%22foo%22:%22bar%22}'
+      '?int=0&str=&bool=false&arr=&json=%7B%22foo%22:%22bar%22%7D'
     )
   })
   it('supports a global clearOnDefault option', () => {
@@ -158,7 +158,7 @@ describe('serializer', () => {
       json: { foo: 'bar' }
     })
     expect(result).toBe(
-      '?int=0&str=&bool=false&arr=&json={%22foo%22:%22bar%22}'
+      '?int=0&str=&bool=false&arr=&json=%7B%22foo%22:%22bar%22%7D'
     )
   })
   it('gives precedence to parser clearOnDefault over global clearOnDefault', () => {
@@ -191,14 +191,16 @@ describe('serializer', () => {
   it('supports ? in the values', () => {
     const serialize = createSerializer(parsers)
     const result = serialize({ str: 'foo?bar', int: 1, bool: true })
-    expect(result).toBe('?str=foo?bar&int=1&bool=true')
+    expect(result).toBe('?str=foo%3Fbar&int=1&bool=true')
   })
   it('supports & in the base', () => {
     // Repro for https://github.com/47ng/nuqs/issues/812
     const serialize = createSerializer(parsers)
     const result = serialize('https://example.com/path?issue=is?here', {
       str: 'foo?bar'
     })
-    expect(result).toBe('https://example.com/path?issue=is?here&str=foo?bar')
+    expect(result).toBe(
+      'https://example.com/path?issue=is%3Fhere&str=foo%3Fbar'
+    )
   })
 })