Hacktoberfest 2026 : les issues que les mainteneurs ont marquées pour octobre, ouvertes et accessibles aux débutants. Parcourir les issues Hacktoberfest

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

Ouverte
  • Quelque chose ne va pas ?
#11,182 2 commentaires 0 réactions 0 personnes assignées Voir sur GitHub

Les mainteneurs répondent en général sous 1 jour

@waterWang y travaille déjà.

Depuis le 13/8/2026.

  • #11184 par @waterWang — ouverte

Évaluation

Difficulté
3/5
Temps estimé
1-2 jours
Accessibilité débutants
52/100
Type d'issue
Bug
Clarté
Plutôt claire
Activité
Calme
Stack technique
react, typescript
Domaine
devtools, frontend

Piste de recherche

Reproduisez le problème avec les packages TanStack Devtools et React Query indiqués, en utilisant la configuration de TanStackDevtools présentée dans le rapport. Examinez la disposition de ReactQueryDevtoolsPanel dans la zone générale des devtools ; le travail est terminé lorsque le panneau des requêtes remplit toute la hauteur disponible et continue à gérer correctement les longues listes de requêtes.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Description

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(),
        ]}
      />
Langage dominant
TypeScript
Étoiles
50.4k
Forks
4.2k
Merge moyen
11 h 33 min
PR mergées (30 j)
421

Préparer son environnement

Par où commencer

  1. Lisez l'issue en entier, puis le guide de contribution du projet.
  2. Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
  3. Forkez le dépôt et travaillez sur une branche.
  4. Ouvrez une pull request qui référence le numéro de l'issue.

Autres issues de TanStack/query

Toutes les issues de TanStack/query

Issues similaires

Plus d'issues TypeScript

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.