Contact Us 1-800-596-4880

Configure Responses for Your GraphQL Implementation

logo cloud IDE Cloud IDE

logo desktop IDE Desktop IDE

Open Beta Release: The cloud IDE and AsyncAPI implementation support are in open beta. Any use of Anypoint Code Builder in its beta state is subject to the applicable beta services terms and conditions, available from the IDE.

Configure your GraphQL implementation to return a specific response for each flow.

Before You Begin

Add Logic to Your Flows

  1. In Anypoint Code Builder, open the Books Implementation project.

  2. From the Explorer, open flows.xml from the project directory.

  3. Within the Query.bookById flow, replace the Set Payload component after the <graphql-router:data-fetcher/> element with the following Set Payload configuration:

    <set-payload value='{"id": 1, "name": "My Book", "pageCount": 28, "author": "author-1"}' mimeType="application/json" />

    The XML for the Query.bookById flow now has this configuration:

    <flow name="Query.bookById">
      <graphql-router:data-fetcher xmlns:graphql-router="http://www.mulesoft.org/schema/mule/graphql-router" config-ref="api-router-config" objectTypeName="Query" fieldName="bookById"/>
      <set-payload value='{"id": 1, "name": "My Book", "pageCount": 28, "author": "author-1"}' mimeType="application/json" />
      <graphql-router:serialize xmlns:graphql-router="http://www.mulesoft.org/schema/mule/graphql-router" config-ref="api-router-config" objectTypeName="Query" fieldName="bookById"/>
    </flow>
  4. Rebuild the application by clicking the (Run and Debug) icon in the activity bar, and then clicking the Start Debugging (F5) icon.

  5. From your IDE, open the Terminal window in the console:

    • In the desktop IDE, select View > Terminal.

    • In the cloud IDE, click the (menu) icon, and select Terminal > New Terminal.

    • For either IDE: Press Ctrl and then press the backtick key (`).

      If the application is already running, click Start New to rerun the application in debug mode.

  6. Run the following curl command from the command prompt:

    curl --request POST \
    --location 'http://localhost:8081/graphql' \
    --header 'Content-Type: application/json' \
    --data '{
        "query": "query bookById($id: ID) {bookById(id: $id){ id name pageCount author{ id firstName lastName}}}",
        "variables": {
            "id": 1
        }
    }'

    Anypoint Code Builder returns your JSON response in the terminal (manually reformatted to enhance readability):

    { "data": {
                "bookById": {
                              "id":"1",
                              "name":"My Book",
                              "pageCount":28,
                              "author": {
                                          "id":"urn:uuid:123e4567-e89b-12d3-a456-426655440000",
                                          "firstName":"This is some example data",
                                          "lastName":"Hello World!"
                                        }
                            }
              }
    }

After testing the bookById endpoint, you can use Set Payload to add mock responses for testing the remaining flows. For example:

<flow name="api-main-flow">
  <http:listener xmlns:http="http://www.mulesoft.org/schema/mule/http" config-ref="http-listener-config" path="${http.listener.path}"/>
  <graphql-router:route xmlns:graphql-router="http://www.mulesoft.org/schema/mule/graphql-router" config-ref="api-router-config"/>
</flow>
<flow name="Query.bookById">
  <graphql-router:data-fetcher xmlns:graphql-router="http://www.mulesoft.org/schema/mule/graphql-router" config-ref="api-router-config" objectTypeName="Query" fieldName="bookById"/>
  <set-payload value='{"id": 1, "name": "My Book", "pageCount": 28, "author": "author-1"}' mimeType="application/json" />
  <graphql-router:serialize xmlns:graphql-router="http://www.mulesoft.org/schema/mule/graphql-router" config-ref="api-router-config" objectTypeName="Query" fieldName="bookById"/>
</flow>
<flow name="Query.books">
  <graphql-router:data-fetcher xmlns:graphql-router="http://www.mulesoft.org/schema/mule/graphql-router" config-ref="api-router-config" objectTypeName="Query" fieldName="books"/>
  <set-payload value='[{"id": 1, "name": "My Book", "pageCount": 28, "author": "author-1"},{"id": 2, "name": "His Book", "pageCount": 12, "author": "author-2"},{"id": 3, "name": "Her Book", "pageCount": 41, "author": "author-1"}]' mimeType="application/json"/>
  <graphql-router:serialize xmlns:graphql-router="http://www.mulesoft.org/schema/mule/graphql-router" config-ref="api-router-config" objectTypeName="Query" fieldName="books"/>
</flow>
<flow name="Query.bestsellers">
  <graphql-router:data-fetcher xmlns:graphql-router="http://www.mulesoft.org/schema/mule/graphql-router" config-ref="api-router-config" objectTypeName="Query" fieldName="bestsellers"/>
  <set-payload value='{"books": ["1,2"], "authors":["author-1", "author-2"]}' mimeType="application/json" />
  <graphql-router:serialize xmlns:graphql-router="http://www.mulesoft.org/schema/mule/graphql-router" config-ref="api-router-config" objectTypeName="Query" fieldName="bestsellers"/>
</flow>
<flow name="Book.author">
  <graphql-router:data-fetcher xmlns:graphql-router="http://www.mulesoft.org/schema/mule/graphql-router" config-ref="api-router-config" objectTypeName="Book" fieldName="author"/>
  <set-payload value='{"id": "author-1", "firstName": "John", "lastName": "Doe"}' mimeType="application/json" />
  <graphql-router:serialize xmlns:graphql-router="http://www.mulesoft.org/schema/mule/graphql-router" config-ref="api-router-config" objectTypeName="Book" fieldName="author"/>
</flow>
<flow name="Bestsellers.books">
  <graphql-router:data-fetcher xmlns:graphql-router="http://www.mulesoft.org/schema/mule/graphql-router" config-ref="api-router-config" objectTypeName="Bestsellers" fieldName="books"/>
  <set-payload value='[{"id": 1, "name": "My Book", "pageCount": 28, "author": "author-1"},{"id": 2, "name": "His Book", "pageCount": 12, "author": "author-2"},{"id": 2, "name": "Her Book", "pageCount": 41, "author": "author-1"}]' mimeType="application/json"/>
  <graphql-router:serialize xmlns:graphql-router="http://www.mulesoft.org/schema/mule/graphql-router" config-ref="api-router-config" objectTypeName="Bestsellers" fieldName="books"/>
</flow>
<flow name="Bestsellers.authors">
  <graphql-router:data-fetcher xmlns:graphql-router="http://www.mulesoft.org/schema/mule/graphql-router" config-ref="api-router-config" objectTypeName="Bestsellers" fieldName="authors"/>
  <set-payload value='[{"id": "author-1", "firstName": "John", "lastName": "Doe"},{"id": "author-2", "firstName": "Anie", "lastName": "Eberts"}]' mimeType="application/json" />
  <graphql-router:serialize xmlns:graphql-router="http://www.mulesoft.org/schema/mule/graphql-router" config-ref="api-router-config" objectTypeName="Bestsellers" fieldName="authors"/>
</flow>