https://github.com/abhinaba-ghosh/testcafe-graphql-mock
custom plugin for testcafe to mock graphql server
https://github.com/abhinaba-ghosh/testcafe-graphql-mock
graphql mock testcafe
Last synced: about 1 year ago
JSON representation
custom plugin for testcafe to mock graphql server
- Host: GitHub
- URL: https://github.com/abhinaba-ghosh/testcafe-graphql-mock
- Owner: abhinaba-ghosh
- License: mit
- Created: 2020-07-26T20:35:26.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2022-06-02T21:15:22.000Z (almost 4 years ago)
- Last Synced: 2025-04-11T00:34:25.576Z (about 1 year ago)
- Topics: graphql, mock, testcafe
- Language: JavaScript
- Homepage: https://www.npmjs.com/package/testcafe-graphql-mock
- Size: 1.03 MB
- Stars: 3
- Watchers: 1
- Forks: 1
- Open Issues: 13
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README

# testcafe-graphql-mock
[](https://app.circleci.com/pipelines/github/abhinaba-ghosh/testcafe-graphql-mock)
[](https://www.npmjs.com/package/testcafe-graphql-mock)
[](https://github.com/abhinaba-ghosh/testcafe-graphql-mock/blob/master/LICENSE)
simple testcafe commands for executing a mocked GraphQL server using only the client.
## Installation
```ssh
npm i -D testcafe-graphql-mock
```
## API available
```ts
interface MockGraphQLOptions {
schema: string | string[] | IntrospectionQuery;
mock: IMocks;
delay?: number;
}
mockGraphQL(options: MockGraphQLOptions, req, res);
```
## Basic Usage
```js
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.
```js
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
```js
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](https://github.com/abhinaba-ghosh/testcafe-graphql-mock/issues)
## Contribution
Any pull request is welcome.
If this plugin helps you in your automation journey, choose to [Sponsor](https://www.patreon.com/user?u=32109749&fan_landing=true)
If it works for you , give a [Star](https://github.com/abhinaba-ghosh/testcafe-graphql-mock)! :star:
_- Copyright © 2020- [Abhinaba Ghosh](https://www.linkedin.com/in/abhinaba-ghosh-9a2ab8a0/)_