TanStack / TanStack/router

SolidJS Router DevTools Props Not Compatible with React's JSX Types

Open
#4,658 3 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

good first issue
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

I'm able to set the style prop for the toggleButtonProps on the devtool component in React. However other props like className and aria-label do not appear to be set.

I don't know if this is a bug or not but it also seems that I have to reload the browser every time I make changes to those toggleButtonProps props that do work like style.

Your Example Website or App

https://stackblitz.com/edit/tanstack-router-5kmyiwxf?file=src%2Froutes%2F__root.tsx

Steps to Reproduce the Bug or Issue
  1. Define props on the toggleButtonProps property on <TanStackRouterDevtools /> in React.
  2. Observe that even on page reload certain props are not populated like className.
Expected behavior

As a user, I expect that when I set toggleButtonProps they are applied to the dev tools toggle button.

Screenshots or Videos

No response

Platform
  • Router / Start Version: 1.127.8
  • OS: macOS
  • Browser: Chrome
  • Browser Version: 138
  • Bundler: vite
  • Bundler Version: v6.3.5
Additional context

No response

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

Open the linked StackBlitz reproduction and start at the React entry point, focusing on toggleButtonProps and the devtools toggle button. Check how className and aria-label are handled compared with style, and verify whether changes require a browser reload. Done means the supplied props are applied consistently without requiring a reload.

Written by the indexing model from the issue text.

Assessment

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

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.