React Query DevTools

+
UniversalWorks with Expo & React Native CLI

This tool works with both Expo and React Native CLI projects. Just install and go.

React Query bugs are almost never in the request. The network tab shows a clean 200 and the screen still shows yesterday's data, because the problem is in the cache: which key it landed under, whether the query is stale, whether anything is still observing it.

TanStack's own devtools answer exactly that — and they are web-only, so on React Native you are back to logging queryClient.getQueryData and rebuilding to read it. Buoy puts the same query browser on the device: every query with its key, state and cached data, editable in place, plus one-tap loading and error simulation.

The demo below is the real on-device tool on a mock QueryClient: the cache lights up, a checkout query fails, you inspect cart JSON, force a loading spinner without the network, restore it, then free-play.

Real component, live cache

1 / 6

Not a video — this is the shipped tool running on a mock QueryClient. Fresh, stale, fetching, inactive, error — every badge the list can show.

9:41
Loading live demo…
Mock cache, real component — the same code that renders in your app. Step through the tour, or just start tapping.

Installation

npm install @buoy-gg/react-query

That's it. The React Query DevTools auto-detects your QueryClient and appears in your FloatingDevTools menu.


Query States

Fresh

Data is valid and up-to-date

Stale

Data needs to be refetched

Fetching

Currently loading data

Paused

Fetch paused (offline)

Inactive

No active observers

Error

Query failed


What You Can Do

Refetch

Manually trigger a fetch

Invalidate

Mark query as stale

Reset

Reset to initial state

Remove

Delete from cache

Loading

Simulate loading state

Error

Simulate error state

Simulate loading & error states — Test how your UI handles loading spinners and error boundaries without waiting for real network conditions.


Mutations

Track all your mutations in real-time:

  • Status — idle, pending, success, or error
  • Variables — data passed to the mutation
  • Response — returned data or error message
  • Timing — when the mutation was submitted

WiFi Toggle

Simulate offline mode with one tap. The WiFi toggle controls React Query's onlineManager to pause all queries — perfect for testing offline-first features.


What It Can't Do

The simulated states are cache-level, not network-level. Triggering a loading state replaces the query function with one that never resolves; it does not slow or block a real request. That is what makes it instant and repeatable — but if you want to see the actual request fail, use a Network override instead.

Mutations are observed, not replayed. You can read a mutation's variables, status and response, but there is no re-fire button — replaying a mutation would repeat its side effects on your real backend.

What's Next


FAQ

How do I use React Query devtools in React Native?

The official TanStack devtools are web-only. Install @buoy-gg/react-query and the same capabilities — query browser, cache inspector, state simulation — run inside your app on the device.

Does it work with Expo Go?

Yes. It's pure JavaScript — no native modules — so it works in Expo Go, dev builds, and production.