TanStack / TanStack/router

`navigate()`'s `to` prop should not widen value type

Open
#3,128 0 comments 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

types
Dominant language
TypeScript
Stars
15.1k
Forks
1.9k
Avg merge
1d 20h
Merged PRs (30d)
143

Description

Which project does this relate to?

Router

Describe the bug

When using string templates + string unions, the to prop of navigate() will widen the type of the value to string instead of using the narrowed type.

Your Example Website or App

https://stackblitz.com/edit/github-nymikapi?file=src%2Fmain.tsx

Steps to Reproduce the Bug or Issue
  1. Open example
  2. Edit file if type errors don't show up
  3. Notice how navigate() types can catch issues with from with or without as const, and issues with to with as const.
  4. Notice how navigate() types fail to catch issues with to without as const
Expected behavior

navigate() should work like linkOptions()

Screenshots or Videos

No response

Platform
  • OS: Windows
  • Browser: Chrome
  • Version: 131.0.6778.265
Additional context

Previously related issue: https://github.com/TanStack/router/issues/3029

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the StackBlitz reproduction in src/main.tsx and compare navigate() with linkOptions(), checking the examples with and without as const. Trace the TypeScript types involved in the to prop; done means the non-as-const case catches the same invalid values as linkOptions().

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.