Did you know there's a simple way to create mock responses for AWS AppSync queries? To accomplish this you just need to create the query, a special data source, and a resolver.
Define the Query
To keep things simple, we're going to be prototyping the following graphql query.
type Query {
foo(input: FooInput): FooOutput!
}
type FooOutput {
bar: String!
}
input FooInput {
value: Int
}
Create the Data Source
We'll be using a special passthrough data source type, aptly named NONE
. Here's all that's required to make it in CDK.
const prototypeDS = graphqlApi.addNoneDataSource(`prototypeDataSource`, {
name: "Prototype",
description: "Prototype graphql responses"
});
VTL Templates
The vtl request template is going to be the same for all of your prototype requests.
{
"version": "2018-05-29",
"payload": $util.toJson($ctx.args.input)
}
Finally, the fun part. We can define the response by modifying the content within $util.Json
in the following template.
#set($value = $ctx.args.input.value)
$util.toJson({
"bar": "You entered ${value}"
})
Creating the Resolver
Now that we have a query, data source, and some vtl templates it's time to tie them all together with a resolver.
prototypeDS.createResolver({
typeName: "Query",
fieldName: "foo",
requestMappingTemplate: appsync.MappingTemplate.fromFile(join(__dirname, "mapping-templates", "Query.foo.request.vtl")),
responseMappingTemplate: appsync.MappingTemplate.fromFile(join(__dirname, "mapping-templates", "Query.foo.response.vtl"))
});
Testing
All that's left to do is deploy the stack and try out the new query
query {
foo(input: { value: 12 }) {
bar
}
}
You should get back
{
"data": {
"foo": {
"bar": "You entered 12"
}
}
}
Summary
You've seen how to easily prototype responses to a query so that frontend developers can start working without waiting for the backend to be fully implemented. You can use this decoupling to allow your frontend and backend developers to work concurrently, or let the frontend devs start first so they can identify any issues with the query before wasting time on the backend.
References
https://docs.aws.amazon.com/appsync/latest/devguide/resolver-mapping-template-reference-none.html
https://docs.aws.amazon.com/cdk/api/latest/docs/aws-appsync-readme.html
Top comments (0)