GQL: Multiple Query Execution

Question

We are using GraphQL using apollo-server, we are trying to execute multiple queries in a single Query Operation as described below.

I expect that both queries should execute and provide their results.

query Operation1 {
 getPosts: {
   id
   title
   url
 }
 getBooks: {
   id
   title   
 }
}

Now in the above case, if both queries are successful, then we are getting results for both given below.

{
  "data": {
    "getPosts": [{
      "id": "P1",
      "title": "post1",
      "url": "/blog/post1"
    }],
    "getBooks": [{
      "id": "B1",
      "title": "book1"
    }]    
  } 
}

But if in case any of query fails, the result is only represented as errors.

{
  "data": {},
  "errors": [
    {
      "message": "failure message",
      "locations": [
        {
          "line": 2,
          "column": 3
        }
      ],
      "path": [
        "getBooks"
      ],
      "extensions": {
        "code": "INTERNAL_SERVER_ERROR"
      }
    }
  ]
}

I am not sure if this is the desired behavior because my expectation was as follows.

{
  "data": {
    "getPosts": [
      {
        "id": "P1",
        "title": "post1",
        "url": "/blog/post1"
      }
    ],
    "getBooks": {
      "data": {},
      "errors": [
        {
          "message": "failure message",
          "locations": [
            {
              "line": 2,
              "column": 3
            }
          ],
          "path": [
            "getBooks"
          ],
          "extensions": {
            "code": "INTERNAL_SERVER_ERROR"
          }
        }
      ]
    }
  }
}

Answer 1

From the apollo docs: https://www.apollographql.com/docs/react/data/queries/#inspecting-error-states

Inspecting error states

providing the errorPolicy configuration option to the useQuery hook. The default value is none, which tells Apollo Client to treat all GraphQL errors as runtime errors. In this case, Apollo Client discards any query response data returned by the server and sets the error property in the useQuery result object.

If you set errorPolicy to all, useQuery does not discard query response data, allowing you to render partial results.

For more information, see Handling operation errors.

Answer 2

My first suggestion is to look at your server logs, not your browser logs. It says you're getting an internal server error.

Second, what you've listed here is not a valid GraphQL query syntax. What you have:

query Operation1 {
 getPosts: {
   id
   title
   url
 }
 getBooks: {
   id
   title   
 }
}

What I assume you're trying to do is done without colons:

query Operation1 {
 getPosts {
   id
   title
   url
 }
 getBooks {
   id
   title   
 }
}

Additionally, the output you're looking for is not what you would get if done correctly. data is the success of your entire operation (not each query). errors are the failures in the entire operation.

{
  "data": {
    "getPosts": [
      {
        "id": "P1",
        "title": "post1",
        "url": "/blog/post1"
      }
    ],
    "getBooks": []
  },
  "errors": [
    {
      "message": "Some error message",
      "locations": [
        {
          "line": 2,
          "column": 3
        }
      ],
      "path": [
        "getBooks"
      ],
      "extensions": {
        "code": "SOME_ERROR_CODE_HERE"
      }
    }
  }
}

---

Colons are used to create aliases, so that you can do the SAME query multiple times in one operation:

query Operation1 {
 getAllPosts: getPosts {
   id
   title
   url
 }
 getPostsFiltered: getPosts(filter: "something") {
   id
   title
   url
 }
}

This would give you a result similar to this:

{
  "data": {
    "getAllPosts": [
      {
        "id": "P1",
        "title": "post1",
        "url": "/blog/post1"
      }
    ],
    "getPostsFiltered": []
  }
}