This document provides instructions for testing GraphQL queries using the .http
file in the REST Client extension for VS Code.
.env
file containing the base URL for your GraphQL server, defined as WP_BASE_URL
.To use the environment variable WP_BASE_URL
in your .http
file, you need to define it in your .env
file. Make sure your .env
file includes:
WP_BASE_URL=http://your-graphql-server-url
Replace http://your-graphql-server-url
with the actual GraphQL server Base URL.
To add a new query test to the .http
file, follow these steps:
.http
FileOnce the query is created, add it to the .http
file. You can follow the same structure as the existing queries.
For example, to add a Get Posts query, it would look like this:
### Get Posts
POST /graphql HTTP/1.1
Content-Type: application/json
{
"query": "query { posts { nodes { id title content } } }"
}
If your query requires variables, you can include them just like in the previous examples. For instance, if you want to pass an id
variable to fetch a specific post, your request could look like this:
### Get Post By Id
POST /graphql HTTP/1.1
Content-Type: application/json
{
"query": "query getPost($id: ID!) { post(id: $id) { id title } }",
"variables": {"id": "cG9zdDox"}
}
.http
file in Visual Studio Code..env
file is correctly set up with the WP_BASE_URL
..http
file. The REST Client will execute the request and display the response in the results pane.If there are any errors in the query, they will be displayed in the errors
field of the response.
If you’re encountering issues, here are a few things to check:
WP_BASE_URL
is set correctly in the .env
file.{
"query": "query {
posts {
nodes {
id
title
content
}
}
}"
}
Instead, do this:
{
"query": "query { posts { nodes { id title content } } }"
}