Running listUsers Query

listUsers Query

With the GraphQL server running in node-dev container's shell (npm start), open a browser on the host and navigate to the GraphiQL tester http://localhost:8080/graph. Copy this query content (doc/graphql-grahiql-samples.md, Queries, List Users) into the left pane of the GraphiQL window (get rid of the comments with the GraphiQL instructions, if you haven't cleared them out before):

query listUsers {
  listUsers(first: 3, orderBy: [{field:"full_name",direction:ASC}]) {
    edges {
      node {
        id
        full_name
        username
        primary_email
        primary_locale
      }
      cursor
    }
    pageInfo {
      hasNextPage
      hasPreviousPage
      startCursor
      endCursor
    }
  }
}

Here we have the query arguments listed in the parentheses, followed by the list of fields that we want to get back (starting with edges), as well as the pageInfo - clearly has something to do with pagination

Hit the "Execute Query" run-like looking button in the top bar, next to the GraphiQL logo. You should get this in the right (result) pane:

{
  "data": {
    "listUsers": {
      "edges": [
        {
          "node": {
            "id": "VXNlcjoxRTRZbzExWTNyOWE=",
            "full_name": "Jane Doe",
            "username": "jane01",
            "primary_email": "jd@example.com",
            "primary_locale": "en"
          },
          "cursor": "bW9uZ286MUU0WW8xMVkzcjlhfDB8MA=="
        },
        {
          "node": {
            "id": "VXNlcjoxRWc2ZDFhRkw4czc=",
            "full_name": "John Public",
            "username": "john01",
            "primary_email": "jp@example.com",
            "primary_locale": "en"
          },
          "cursor": "bW9uZ286MUVnNmQxYUZMOHM3fDB8MQ=="
        }
      ],
      "pageInfo": {
        "hasNextPage": false,
        "hasPreviousPage": false,
        "startCursor": "bW9uZ286MUU0WW8xMVkzcjlhfDB8MA==",
        "endCursor": "bW9uZ286MUVnNmQxYUZMOHM3fDB8MQ=="
      }
    }
  }
}

In the node-dev shell, you can see some debug-level log statements printed. It is definitely cooking.


Everything looks pretty simple and logical. Now, let's review the exact syntax and flow to ensure there is no mystery left in what is done and how.