GraphQL Query Tester
Run GraphQL operations with browser fetch first, inspect data and errors clearly, and load a searchable type explorer from introspection when available.
Updated
GraphQL request
Headers
Response
data
No data yet.
raw response
Run a query to inspect the full JSON response.
Introspection explorer
No schema types loaded yet.
How to use GraphQL Query Tester
The GraphQL Query Tester lets you send queries and mutations with custom headers, JSON variables, and optional operation names from one browser workspace. It shows the raw response, separates data from GraphQL errors, measures request duration, and supports explicit server-proxy fallback when browser CORS blocks direct calls. You can also run full schema introspection and browse a searchable type explorer with field arguments and rendered return types like [User!]!, making endpoint discovery and debugging much faster during integration work.
- Enter your GraphQL endpoint URL and add any required headers such as Authorization or x-api-key.
- Paste a query or mutation into the editor, then add variables JSON and an optional operation name.
- Run the request to inspect response data, GraphQL errors, raw JSON, and measured duration.
- If browser fetch fails from CORS/network policy, click Send via server proxy to retry safely.
- Load schema introspection to browse types, expand fields, and search names or return types.
Your data never leaves your device — 100% private processing.
Why GraphQL errors require structured inspection
A GraphQL endpoint can return HTTP 200 even when part of the operation fails, because protocol-level success and resolver-level execution errors are separate concerns. Relying on status code alone often hides real failures in the errors array, where each entry includes a message, optional path, and source location metadata. Effective debugging therefore means viewing data and errors together: partial data might still be useful, while a nested path pinpoints exactly which field resolver failed. This tester surfaces those details in a dedicated list so teams can distinguish transport problems from schema or business-logic faults quickly.
Introspection in development vs production hardening
Introspection is ideal during development because it exposes available types, fields, argument signatures, and return shapes, enabling tooling like explorers and code generation. In production, some organizations disable introspection to reduce schema reconnaissance risk, especially for private APIs. That trade-off means clients must rely on pre-published SDL docs, persisted query catalogs, or internal schema registries instead of runtime discovery. The schema loader in this tool handles both scenarios gracefully: when introspection succeeds, you get a searchable explorer; when it is disabled, you get a clear hint explaining why schema browsing is unavailable while normal query execution can still work.
Worked examples
Run a country list query
Inputs: Endpoint countries.trevorblades.com + { countries { code name emoji } }
Result: Returns country array in data with no errors and measured duration
Filter schema by type name
Inputs: Load introspection then search "Country"
Result: Explorer shows matching types and field signatures like [Country!]!
Glossary
- Operation name
- The optional label on a GraphQL query or mutation used by servers, logs, and tracing tools.
- Introspection
- A GraphQL capability that returns schema metadata such as types, fields, and argument definitions.
- Resolver path
- The path in a GraphQL error object that identifies which nested field failed during execution.
- Type reference
- A nested GraphQL type structure (LIST/NON_NULL/object) rendered into readable strings like [User!]!.
- CORS fallback
- Retrying a request through a server relay when browser cross-origin policy blocks direct fetch.
Related reading
Frequently Asked Questions
Get weekly tool tips & updates
New tools, power-user tips, and productivity hacks — delivered free every Friday.
No spam, ever. Unsubscribe with one click.
Why use GraphQL Query Tester?
- Runs GraphQL requests with endpoint URL, headers, query, variables, and operationName in one workflow
- Splits GraphQL errors into a readable list with message, path, and source locations for faster triage
- Loads introspection schema into a searchable explorer of types, fields, args, and return signatures
- Falls back to server proxy only when browser CORS/network limits block a direct request
Common use cases
- Validate query variables and operation names before wiring GraphQL calls into frontend code
- Debug resolver-level errors by comparing data and errors arrays from the same response payload
- Explore unfamiliar schemas quickly by loading introspection and searching by type or field name
- Reproduce CORS-limited API issues with browser-first execution and explicit proxy retry controls
Related Developer Tools
API Tester (Online REST Client)
Build and send HTTP requests with method, URL, headers, auth, and JSON body, then inspect status, timing, headers, and response payload in one browser tool.
JSON Formatter & Validator
Format, validate, and minify JSON instantly. Includes syntax highlighting, error detection, and a collapsible tree view — free, private, in-browser.
CORS Tester / Preflight Checker
Run a real preflight and follow-up request against any endpoint, then verify Access-Control headers for origin, methods, headers, and credentials.
Regex Tester
Test and debug regular expressions online. See live matches, capture groups, and replace output. Free, private, instant.
Base64 Encoder & Decoder
Encode text or files to Base64, or decode Base64 strings back to text. Fast, free, and runs entirely in your browser.
URL Encoder / Decoder
Encode and decode URLs and URL components online. Convert special characters to percent-encoding and back instantly — free, private, and fast.
Explore all Developer Tools.