https://github.com/abhinaba-ghosh/graphql-mock-e2e-example
GraphQL queries mocking example with Cypress and Testcafe
https://github.com/abhinaba-ghosh/graphql-mock-e2e-example
cypress graphql mock testcafe
Last synced: about 1 year ago
JSON representation
GraphQL queries mocking example with Cypress and Testcafe
- Host: GitHub
- URL: https://github.com/abhinaba-ghosh/graphql-mock-e2e-example
- Owner: abhinaba-ghosh
- License: mit
- Created: 2020-07-29T15:50:04.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2020-07-29T16:22:47.000Z (over 5 years ago)
- Last Synced: 2024-10-18T08:34:40.586Z (over 1 year ago)
- Topics: cypress, graphql, mock, testcafe
- Language: JavaScript
- Homepage:
- Size: 351 KB
- Stars: 0
- Watchers: 1
- Forks: 2
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# GraphQL-Mock-Example: Testcafe vs Cypress
| Library Used | NPM Link |
| --------------------- | ----------------------------------------------------------- |
| cypress-graphql-mock | [here](https://www.npmjs.com/package/testcafe-graphql-mock) |
| testcafe-graphql-mock | [here](https://www.npmjs.com/package/cypress-graphql-mock) |
## Instructions to test:
- start the client app
```ssh
cd client
npm install
SKIP_PREFLIGHT_CHECK=true npm start
```
- Testcafe mock tests
```ssh
# start another terminal in root directory
npm run testcafe:test
```
- Cypress mock tests
```ssh
npm run cypress:test
```
## cypress-graphql-mock
### Basic usage
```js
beforeEach(() => {
cy.task('getSchema').then((schema) => {
cy.mockGraphql({});
});
});
it('Should mock getUser', () => {
cy.mockGraphqlOps({
operations: {
getUser: {
user: {
id: 1,
name: 'Name',
email: 'Email',
},
},
},
});
cy.visit('/');
cy.get('#GET_USER').click();
cy.get('#data').should(
'contain',
JSON.stringify({
user: { id: 1, name: 'Name', email: 'Email', __typename: 'User' },
})
);
});
```
## testcafe-graphql-mock
### Basic Usage
```js
import { mockGraphQL } from 'testcafe-graphql-mock';
// 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');
});
```