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

Tanstack Query Devtools does not fill out the whole page height in the tanstack devtools

Aperta
  • Qualcosa non va?
#11,182 2 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

@waterWang ci sta già lavorando.

Dal 13/8/2026.

  • #11184 di @waterWang — aperta

Valutazione

Difficoltà
3/5
Tempo stimato
1-2 giorni
Idoneità per principianti
52/100
Tipo di issue
Bug
Chiarezza
Abbastanza chiara
Stato di attività
Tranquilla
Stack tecnologico
react, typescript
Ambito
devtools, frontend

Direzione di ricerca

Riproduci il problema utilizzando i pacchetti TanStack Devtools e React Query elencati, con la configurazione di TanStackDevtools mostrata nel report. Esamina come è disposto ReactQueryDevtoolsPanel all'interno dell'area generale dei devtools; il lavoro è completato quando il pannello delle query riempie l'altezza disponibile e gestisce comunque correttamente gli elenchi lunghi di query.

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

Descrizione

Describe the bug

When I open the tanstack query devtools tab in tanstack devtools, the tanstack query tab does not fill the whole height.

Your minimal, reproducible example

Reproducable in all sites with tanstack query

Steps to reproduce
  1. Open tanstack devtools (the general extension) with the tanstack query extension
  2. Make the devtools area bigger
  3. Now you see that if you have a long list of query it gets an scroll but the tanstack query extension does noet fill the whole height
Expected behavior

I would expect taht the tanstack query devtools would fill the whole height

How often does this bug happen?

Every time

Screenshots or Videos

I would expect that the devtools would be fill all over the area I marked red

Image
Platform
  • OS: Windows
  • Browser: Google Chrome
Tanstack Query adapter

react-query

TanStack Query version

5.101.4

TypeScript version

6.0.3

Additional context

"@tanstack/react-query-devtools": "^5.101.4",
"@tanstack/devtools-vite": "^0.8.3",
"@tanstack/react-devtools": "^0.10.10",

Devtools code

import { ReactQueryDevtoolsPanel } from '@tanstack/react-query-devtools';
import { TanStackRouterDevtoolsPanel } from '@tanstack/react-router-devtools';
import { TanStackDevtools } from '@tanstack/react-devtools';
import { formDevtoolsPlugin } from '@tanstack/react-form-devtools';
...

<TanStackDevtools
        config={{ position: 'bottom-left' }}
        plugins={[
          {
            name: 'TanStack Query',
            render: <ReactQueryDevtoolsPanel />,
          },
          {
            name: 'TanStack Router',
            render: <TanStackRouterDevtoolsPanel router={router} />,
          },
          formDevtoolsPlugin(),
        ]}
      />
Lingua principale
TypeScript
Stelle
50.4k
Fork
4.2k
Merge medio
11h 33m
PR unite (30g)
421

Preparare l'ambiente

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/query

Tutte le issue di TanStack/query

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.