The GraphQL Interface
Panel Layout
The GraphQL tab is designed for API exploration and query building. It features a request bar at the top, a split request panel on the left, and response panel on the right.
Interface Layout
Request Bar - URL + Send button
Schema Explorer
users { id name }
}
Query Editor
"data": {
"users": [...]
}
}
Response Panel
Request Bar
The top bar contains the endpoint URL and send button:
Protocol Badge
Indicates this is a GraphQL tab (not HTTP or SSE).
GraphQL Endpoint URL
Enter the GraphQL API endpoint. Supports environment variables. When the URL changes, schema is automatically fetched.
Send / Cancel Button
Execute the GraphQL query. Changes to "Cancel" during request. Press Enter in the URL field to send quickly.
Request Panel Tabs
The left panel has four tabs for building your request:
The main query editing area. Split into two sections:
- • Schema Explorer (top) - Browse and select fields
- • Query Editor (bottom) - View/edit the generated query
The divider between them is draggable - resize as needed.
JSON editor for query variables. Variables from schema explorer arguments are auto-populated here. Edit values as needed.
Add custom HTTP headers to the request. Same interface as HTTP requests. Default headers (Content-Type: application/json) are added automatically.
Configure authentication. Same options as HTTP requests: Bearer token, Basic auth, or API key.
Response Panel
The right panel displays the GraphQL response with three tabs:
The JSON response from the GraphQL server. Shows both data anderrors if present. Use Format/Minify buttons to adjust display.
HTTP response headers from the server.
Request timing information: DNS lookup, TCP connection, TLS handshake, time to first byte, and total duration. Plus request/response sizes.