-
Notifications
You must be signed in to change notification settings - Fork 2.7k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Testing utility docs #11805
Testing utility docs #11805
Conversation
|
size-limit report 📦
|
✅ Deploy Preview for apollo-client-docs ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I'll leave most of the wording and such to Maria. Had some suggestions on structure and content, but otherwise this is a really great start to the doc! Feel free to ignore anything you disagree with as I trust your judgement on the intent. Thanks for writing this doc up!
|
||
Now let's write some tests! | ||
|
||
The first thing we'll do is mock the global fetch function using the `createSchemaFetch` utility. This will allow us to intercept and respond to network requests made by our Apollo Client instance using responses generated against our test schema 🎉 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Would it make sense to also include a section about "When to use createSchemaFetch
vs MSW"? Since these utilities are mutually exclusive, it might be best to state that somewhere explicitly in this doc to ensure those that aren't as familiar with those tools don't get confused and try and use both together.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Really, really love this idea :) Will work on adding that shortly.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Added in aebc3a5 let me know what you think!
|
||
For a working example that demonstrates how to use both Testing Library and Mock Service Worker to write integration tests with `createTestSchema`, check out this project on CodeSandbox: | ||
|
||
[![Edit Testing React Components](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/github/apollographql/docs-examples/tree/main/apollo-client/v3/testing-react-components?file=/src/dog.test.js) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hah yeah I just noticed this on another page. Will look into whether we can remove the link icon here 👍
Co-authored-by: Lenz Weber-Tronic <lorenz.weber-tronic@apollographql.com>
|
||
> This page is heavily inspired by the excellent [Redux documentation](https://redux.js.org/usage/writing-tests#guiding-principles); the same principles apply to Apollo Client. | ||
|
||
## `createTestSchema` and `createSchemaFetch` |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I would probably keep createSchemaFetch
out of this heading as it is not required for msw
, which is also under this heading.
…raphql/apollo-client into issue-11775-testing-utility-docs
Closes #11775.
To do: