Specmatic UI project for GraphQL demo

Pre-requisites

Install the node packages for this project.

npm install

npm install git+https://github.com/znsio/specmatic-node-beta.git#4309b14

Note - Pick up the version (#4309b14) from package.json

Running automated UI Component tests with Specmatic GraphQL Stub

npm test

Bringing up the React application independently with Specmatic GraphQL Stub

Start up the Specmatic stub

npm run specmatic:stub

Testing the Specmatic stub

Use the following curl commands to test if the stub is working as expected -

1. Simple query

curl -X POST http://localhost:8080/graphql \
  -H "Content-Type: application/json" \
  -d '{
    "query": "query { findAvailableProducts(type: gadget, pageSize: 10) { id name inventory type } }"
  }'

2. Query with variables

curl -X POST http://localhost:8080/graphql \
  -H "Content-Type: application/json" \
  -d '{
    "query": "query FindAvailableProducts($type: ProductType!, $pageSize: Int!) { findAvailableProducts(type: $type, pageSize: $pageSize) { id name inventory type } }",
    "variables": {
      "type": "gadget",
      "pageSize": 10
    }
  }'

Start the application

npm start

This should automatically start the application and pull it up in your browser.

Explore the GraphQl spec using GraphiQL

npm run graphiql

You can now open GraphiQL in your browser and test out some GraphQL queries.

This instance of GraphiQL has been setup to query the Specmatic stub instance running on http://localhost:4000/graphql.