Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

Router devtools crash when search params contain a BigInt (JSON.stringify in history tracking)

Aperta Adatta ai principianti
  • Qualcosa non va?
#8,768 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

@A-Raphie ci sta già lavorando.

Dal 19/10/2026.

  • #8769 di @A-Raphie — aperta

Valutazione

Difficoltà
2/5
Tempo stimato
1-3 ore
Idoneità per principianti
76/100
Tipo di issue
Bug
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
react, typescript
Ambito
devtools, frontend

Direzione di ricerca

Inizia da @tanstack/router-devtools-core, in BaseTanStackRouterDevtoolsPanel, e verifica come il tracciamento della cronologia confronta la posizione corrente con quella precedente. L’issue indica JSON.stringify sui valori di ricerca; controlla se location.searchStr o location.href del router è disponibile per il confronto. Il lavoro è concluso quando i devtools possono tracciare una route con un valore di ricerca BigInt senza generare errori e continuano a rilevare i cambiamenti di posizione.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

Which project does this relate to?

Router (devtools)

Describe the bug

TanStackRouterDevtoolsPanel throws TypeError: Do not know how to serialize a BigInt as soon as the current route's validated search holds a bigint, e.g. a route whose validateSearch decodes an int64 id. The router itself handles it fine (the app's custom parseSearch/stringifySearch round-trip the value). The crash comes from the devtools' history tracking, which compares locations with JSON.stringify:

// @tanstack/router-devtools-core, BaseTanStackRouterDevtoolsPanel
const sameLocation = lastMatch && lastMatch.pathname === currentMatch.pathname
  && JSON.stringify(lastMatch.search ?? {}) === JSON.stringify(currentMatch.search ?? {});

JSON.stringify throws on any bigint, and the error surfaces as an uncaught route error ("The following error wasn't caught by any route!").

Steps to reproduce
  1. Configure the router with a parseSearch/stringifySearch that supports bigints, and a route whose validateSearch returns e.g. { id: 9007199254740993n }.
  2. Mount TanStackRouterDevtoolsPanel.
  3. Navigate to that route: the devtools throw TypeError: Do not know how to serialize a BigInt.
Expected behavior

The devtools shouldn't assume search values are JSON-serializable. The router has already serialized the search with the app's own stringifySearch, so comparing location.searchStr (or location.href) needs no JSON.stringify and respects custom serializers. Wherever the devtools must stringify search values for display, a configurable serializer that defaults to JSON.stringify would match what was suggested for Query's devtools in TanStack/query#3082. That issue is the same class of bug, still commonly worked around by patching BigInt.prototype.toJSON.

Platform
  • @tanstack/router-devtools-core 1.168.2 (latest), via @tanstack/react-router-devtools
  • @tanstack/react-router 1.171.x
  • Chrome, React 19
Lingua principale
TypeScript
Stelle
15.2k
Fork
1.9k
Merge medio
1g 13h
PR unite (30g)
76

Preparare l'ambiente

Apri in Codespaces

Avvia il container di sviluppo del progetto nel browser, con il tuo account GitHub.

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di TanStack/router

Tutte le issue di TanStack/router

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.