router icon indicating copy to clipboard operation
router copied to clipboard

fix: Do not parse / stringify search params that are not json objects

Open adbjo opened this issue 3 weeks ago β€’ 4 comments

By default, the router parses search params using JSON.parse, regardless of whether the param is a JSON object or not. This causes strange behavior, for example, it adds quotes around numerical strings: http://my-app.com?p=123 changes to http://my-app.com?p="123"

It also causes rounding issues when large numbers are converted into integers, for example:

http://my-app.com?p=1000000000000001110 becomes http://my-app.com?p="1000000000000001200"

Which means that resource IDs cannot be used in search params, which I guess is a common use-case.

This PR solves this by not calling the parser on params that are not json objects.

adbjo avatar Dec 01 '25 09:12 adbjo

Walkthrough

Parse/stringify logic updated to avoid coercing or replacing raw string values unless a parser returns an object; qss decoding no longer coerces strings to booleans/numbers; tests updated to validate parse-first then stringify roundtrips.

Changes

Cohort / File(s) Summary
Search params logic
packages/router-core/src/searchParams.ts
parseSearchWith now assigns parser results only when the parser returns an object; stringifySearchWith only re-stringifies when the parser returns an object, otherwise original string values are preserved.
Query-string decoding
packages/router-core/src/qss.ts
Removed the toValue coercion helper; decode now returns raw string values (and arrays of raw strings) instead of coercing to numbers/booleans.
Tests
packages/router-core/tests/searchParams.test.ts, packages/router-core/tests/qss.test.ts
Tests updated to parse-first then stringify for isomorphism checks; expectations adjusted to reflect raw-string decoding and arrays for repeated keys.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20–30 minutes

  • Inspect searchParams.ts parser branches for cases where parsers return primitives vs objects.
  • Verify callers of qss.decode and any consumers expecting coerced numeric/boolean types.
  • Run unit tests covering repeated keys, empty values, escaped literals, and custom parsers.

Possibly related PRs

  • TanStack/router#4987 β€” Touches parse/stringify behavior and tests for default parse/stringify utilities; closely related test and behavior changes.
  • TanStack/router#5574 β€” Edits the same parsing/stringifying utilities (docs/JSDoc nearby); relevant to function-level behavior.
  • TanStack/router#4985 β€” Modifies qss.ts and searchParams.ts implementations; overlaps with decode/parse behavior adjustments.

Suggested reviewers

  • schiller-manuel
  • SeanCassiere

Poem

"I hopped through queries, kept each string intact,
I nudged only objects where parsers interact.
Numbers no longer sneak into string beds,
Roundtrips hum softly as tests nod their heads.
β€” πŸ‡"

Pre-merge checks and finishing touches

βœ… Passed checks (3 passed)
Check name Status Explanation
Docstring Coverage βœ… Passed Docstring coverage is 80.00% which is sufficient. The required threshold is 80.00%.
Title check βœ… Passed The title accurately describes the main change: preventing parsing and stringifying of search params that are not JSON objects, which addresses the issue of unwanted quoting of numerical/string parameters.
Description Check βœ… Passed Check skipped - CodeRabbit’s high-level summary is enabled.
✨ Finishing touches
  • [ ] πŸ“ Generate docstrings
πŸ§ͺ Generate unit tests (beta)
  • [ ] Create PR with unit tests
  • [ ] Post copyable unit tests in a comment

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❀️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

coderabbitai[bot] avatar Dec 01 '25 09:12 coderabbitai[bot]

πŸ€– Nx Cloud AI Fix Eligible

An automatically generated fix could have helped fix failing tasks for this run, but Self-healing CI is disabled for this workspace. Visit workspace settings to enable it and get automatic fixes in future runs.

To disable these notifications, a workspace admin can disable them in workspace settings.


View your CI Pipeline Execution β†— for commit 1af0d4bec8c29341345245823972c5ae76475034

Command Status Duration Result
nx affected --targets=test:eslint,test:unit,tes... ❌ Failed 11m 9s View β†—
nx run-many --target=build --exclude=examples/*... βœ… Succeeded 1m 20s View β†—

☁️ Nx Cloud last updated this comment at 2025-12-01 19:37:23 UTC

nx-cloud[bot] avatar Dec 01 '25 19:12 nx-cloud[bot]

More templates

@tanstack/arktype-adapter

npm i https://pkg.pr.new/TanStack/router/@tanstack/arktype-adapter@6000
@tanstack/directive-functions-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/directive-functions-plugin@6000
@tanstack/eslint-plugin-router

npm i https://pkg.pr.new/TanStack/router/@tanstack/eslint-plugin-router@6000
@tanstack/history

npm i https://pkg.pr.new/TanStack/router/@tanstack/history@6000
@tanstack/nitro-v2-vite-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/nitro-v2-vite-plugin@6000
@tanstack/react-router

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-router@6000
@tanstack/react-router-devtools

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-router-devtools@6000
@tanstack/react-router-ssr-query

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-router-ssr-query@6000
@tanstack/react-start

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-start@6000
@tanstack/react-start-client

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-start-client@6000
@tanstack/react-start-server

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-start-server@6000
@tanstack/router-cli

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-cli@6000
@tanstack/router-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-core@6000
@tanstack/router-devtools

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-devtools@6000
@tanstack/router-devtools-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-devtools-core@6000
@tanstack/router-generator

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-generator@6000
@tanstack/router-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-plugin@6000
@tanstack/router-ssr-query-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-ssr-query-core@6000
@tanstack/router-utils

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-utils@6000
@tanstack/router-vite-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-vite-plugin@6000
@tanstack/server-functions-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/server-functions-plugin@6000
@tanstack/solid-router

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-router@6000
@tanstack/solid-router-devtools

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-router-devtools@6000
@tanstack/solid-router-ssr-query

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-router-ssr-query@6000
@tanstack/solid-start

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-start@6000
@tanstack/solid-start-client

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-start-client@6000
@tanstack/solid-start-server

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-start-server@6000
@tanstack/start-client-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-client-core@6000
@tanstack/start-plugin-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-plugin-core@6000
@tanstack/start-server-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-server-core@6000
@tanstack/start-static-server-functions

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-static-server-functions@6000
@tanstack/start-storage-context

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-storage-context@6000
@tanstack/valibot-adapter

npm i https://pkg.pr.new/TanStack/router/@tanstack/valibot-adapter@6000
@tanstack/virtual-file-routes

npm i https://pkg.pr.new/TanStack/router/@tanstack/virtual-file-routes@6000
@tanstack/zod-adapter

npm i https://pkg.pr.new/TanStack/router/@tanstack/zod-adapter@6000

commit: 1af0d4b

pkg-pr-new[bot] avatar Dec 01 '25 19:12 pkg-pr-new[bot]

Fixes: https://github.com/TanStack/router/issues/6044

adbjo avatar Dec 09 '25 14:12 adbjo