GraphQL Inspector

Reading GraphQL traffic in the Network panel means scrolling through a column of identical "graphql" rows and unwrapping a JSON blob just to find out which operation you are looking at. GraphQL Inspector adds a GraphQL tab to DevTools that does that work for you. Every call is listed under its operation name, with a colored icon that tells you at a glance whether it is a query, a mutation or a subscription — next to its status, duration and transferred size. Rows appear the moment the request leaves the page and fill in when the response lands, so you can watch a mutation go out and come back. Anonymous documents are listed by their root field, so they stay identifiable too. Select a request and you get five tabs: Query — the document with syntax highlighting, and a Pretty button that re-indents minified queries into something readable. Variables — a collapsible JSON tree, or raw text, with one-click copy. Response — a collapsible JSON tree, with the GraphQL "errors" block lifted to the top and marked in red. Headers — URL, method, status and remote address, plus request and response headers, with copy all. Timing — total, TTFB, transferred bytes, response size and request size, plus a breakdown of the connection phases. Finding the one call you care about: filter by operation name, URL or query text, or flip on the Errors toggle to see only what failed — HTTP failures and GraphQL "errors" alike. It understands how real apps talk to a GraphQL server: plain JSON bodies, batched arrays of operations (split into selectable chips), GET requests with ?query=, persisted queries and APQ, raw application/graphql documents, and multipart file uploads. The panel follows your DevTools light or dark theme, and needs no configuration. PRIVACY The extension requests no permissions at all. It makes no network calls of its own, has no account and no settings, and nothing it captures ever leaves your browser — everything lives in the panel's memory and is gone when you close DevTools.