patrickisgreat / testcafe-graphql-mock

custom plugin for testcafe to mock graphql server

testcafe-graphql-mock

simple testcafe commands for executing a mocked GraphQL server using only the client.

Installation

npm i -D testcafe-graphql-mock

API available

interface MockGraphQLOptions {
  schema: string | string[] | IntrospectionQuery;
  mock: IMocks;
  delay?: number;
}

mockGraphQL(options: MockGraphQLOptions, req, res);

Basic Usage

import { mockGraphQL } from 'testcafe-graphql-mock';

// define the schema
const schema = `
type Person {
  firstname: String!
  surname: String!
}

type Query {
  people: [Person]
}
`;

// define the mock
const mock = {
  Query: () => ({
    people: () => [
      {
        firstname: 'Lee',
        surname: 'Byron',
      },
    ],
  }),
};

// create traditional testcafe request mock
const requestMock = RequestMock()
  .onRequestTo({ url: 'http://localhost:3000/graphql', method: 'POST' })
  .respond(async (req, res) => {
    await mockGraphQL(
      {
        schema,
        mock,
      },
      req,
      res
    );
  });

// now call the testcafe request mock in fixures as request hooks
fixture(`GraphQL Mock test`)
  .page('http://localhost:3000/')
  .requestHooks(requestMock);

test('test graphql mock data', async (t) => {
  await t.click(Selector('button'));
  await expect(Selector('div')).contains('Lee Byron');
});

Read schema from .graphql file

You need to use graphQLSchemaFromFile method from the library.

import { graphQLSchemaFromFile } from 'testcafe-graphql-mock';

// use the graphql schema reader method in your request mocks
const requestMock = RequestMock()
  .onRequestTo({ url: 'http://localhost:3000/graphql', method: 'POST' })
  .respond(async (req, res) => {
    await mockGraphQL(
      {
        schema: graphQLSchemaFromFile(
          `${process.cwd()}/test/test-schema.graphql`
        ),
        mock,
      },
      req,
      res
    );
  });

Delay the GraphQL mocked response

use the delay (in milliseconds) parameter in mockGraphQL({}) options

const requestMock = RequestMock()
  .onRequestTo({ url: 'http://localhost:3000/graphql', method: 'POST' })
  .respond(async (req, res) => {
    await mockGraphQL(
      {
        schema,
        mock,
        delay: 5000,
      },
      req,
      res
    );
  });

License

MIT

Tell me your issues

you can raise any issue here

Contribution

Any pull request is welcome.

If this plugin helps you in your automation journey, choose to Sponsor

If it works for you , give a Star! ⭐

- Copyright © 2020- Abhinaba Ghosh