zth / graphql-query-test-mock Goto Github PK
View Code? Open in Web Editor NEWEasily mock GraphQL queries in your Relay Modern / Apollo / any-other-GraphQL-client tests.
Easily mock GraphQL queries in your Relay Modern / Apollo / any-other-GraphQL-client tests.
Hello,
I've started using this library in our tests and I really like it so far. My main concern at this point is that we have to repeatedly mock data that is un-essential for a given test case. It is quite verbose and it's challenging to keep all nested fragment queries in sync with all the test cases across different files.
I'd like to be able to only specify core data for a given test and generate realistic mocks for the rest of the data. You can read more about this approach here.
To achieve this, I was thinking of adding support for async customHandler function so we can potentially call a graphql schema resolver function. Do you think that's the right approach? If so, I'd very happy to send a PR.
Thanks!
J
Hey @zth,
A dependency on "babel-polyfill" was introduced by commit 99cf483 because it uses async / await. Babel currently transpiles all +ES2015 syntax because the .babelrc does not specify a node target.
I think we have 2 main options here:
My preference would be option 2. because Node 7 is no longer supported and Node 6 will be retired in April (see the release schedule). Given this is a very young library with few users and targets an audience that uses GraphQL, I have a hunch that dropping support for Node <8 may not impact anyone. Here is what the change would look like: jnak@c5b7d46
Let me know if I should send a PR.
Cheers,
J
Hello,
With the latest version of the repo, there is an error with flow check
, do you know what could be the problem ?. Thanks in advance.
Error ----------------------------------------------------------- node_modules/graphql/error/GraphQLError.js.flow:212:16
Unclear type. Using `any`, `Object`, or `Function` types is not safe! (`unclear-type`)
212| (GraphQLError: any).prototype = Object.create(Error.prototype, {
^^^
Error ------------------------------------------------------------ node_modules/graphql/error/locatedError.js.flow:26:28
Unclear type. Using `any`, `Object`, or `Function` types is not safe! (`unclear-type`)
26| return (originalError: any);
^^^
Error ------------------------------------------------------------ node_modules/graphql/error/locatedError.js.flow:31:39
Unclear type. Using `any`, `Object`, or `Function` types is not safe! (`unclear-type`)
31| (originalError && (originalError: any).nodes) || nodes,
^^^
Error ------------------------------------------------------------ node_modules/graphql/error/locatedError.js.flow:32:38
Unclear type. Using `any`, `Object`, or `Function` types is not safe! (`unclear-type`)
32| originalError && (originalError: any).source,
^^^
Error ------------------------------------------------------------ node_modules/graphql/error/locatedError.js.flow:33:38
Unclear type. Using `any`, `Object`, or `Function` types is not safe! (`unclear-type`)
33| originalError && (originalError: any).positions,
^^^
Error ----------------------------------------------------- node_modules/graphql/jsutils/defineToStringTag.js.flow:23:61
Unclear type. Using `any`, `Object`, or `Function` types is not safe! (`unclear-type`)
23| export default function applyToStringTag(classObject: Class<any>): void {
^^^
Error ---------------------------------------------------------------- node_modules/graphql/language/lexer.js.flow:52:38
Unclear type. Using `any`, `Object`, or `Function` types is not safe! (`unclear-type`)
52| token = token.next || ((token: any).next = readToken(this, token));
^^^
Error -------------------------------------------------------------- node_modules/graphql/language/parser.js.flow:198:27
Unclear type. Using `any`, `Object`, or `Function` types is not safe! (`unclear-type`)
198| value: ((token.value: any): string),
^^^
Error -------------------------------------------------------------- node_modules/graphql/language/parser.js.flow:587:31
Unclear type. Using `any`, `Object`, or `Function` types is not safe! (`unclear-type`)
587| value: ((token.value: any): string),
^^^
Error -------------------------------------------------------------- node_modules/graphql/language/parser.js.flow:594:31
Unclear type. Using `any`, `Object`, or `Function` types is not safe! (`unclear-type`)
594| value: ((token.value: any): string),
^^^
Error -------------------------------------------------------------- node_modules/graphql/language/parser.js.flow:618:31
Unclear type. Using `any`, `Object`, or `Function` types is not safe! (`unclear-type`)
618| value: ((token.value: any): string),
^^^
Error -------------------------------------------------------------- node_modules/graphql/language/parser.js.flow:635:27
Unclear type. Using `any`, `Object`, or `Function` types is not safe! (`unclear-type`)
635| value: ((token.value: any): string),
^^^
Found 12 errors
error Command failed with exit code 2.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
error Command failed with exit code 2.
info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.
Enjoying the library so far but have hit a road bump when I create a mock which expects a validation error.
Firstly, the error object in the response seems to be completely ignored if status code is not set. As I understand, it is perfectly valid for a graphql server to return an error with a 200 status code - eg a field validation error. In this case relay's onCompleted: (response, errors)
has null for the error.
relay code:
const mutation = graphql`
mutation FooEditMutation(
$id: ID!,
$foo: String!
){
editFoo(id: $id, foo: $foo) {
id
foo
}
}`;
const variables = {
id: props.foo.id,
foo: foo
};
commitMutation(environment, {
mutation,
variables,
updater: (store) => {
console.log("updater running");
// ...
},
onCompleted: (response, errors) => {
console.log("errors is null");
},
onError: error => {throw new Error(error)}
});
test:
queryMock.mockQuery({
name: "FooEditMutation",
variables: {
id :"5d07e9310960ad00277ce5d1",
foo: ""
},
data: {
editFoo: null
},
error: {
errors: [
{
message: 'Validation failed: name: Path `foo` is required.',
locations: [
{
line: 7,
column: 3
}
],
path: [
'editFoo'
]
}
],
}
});
fireEvent.change(inputFoo, { target: { value: "" } });
fireEvent.click(submitFooButton);
await wait(() => {
getByText("Foo is a required field");
});
After hitting this problem I've been experimenting with different status code and error responses and I can't find one that doesn't throw some kind of error or warning. If I set status: 401
in the above then I get
console.error relay-environment.js:21
fetch error {
errors: [
{
message: 'Validation failed: name: Path `foo` is required.',
locations: [Array],
path: [Array]
}
]
}
● Edit Foo module › Checks an edited foo shows an error if the foo field is empty
Failed: "Error: TypeError: Cannot read property 'data' of undefined"
at Env.fail (node_modules/jest-jasmine2/build/jasmine/Env.js:775:61)
at node_modules/relay-runtime/lib/RelayObservable.js:641:7
at Object.error (node_modules/relay-runtime/lib/RelayObservable.js:584:11)
at Object.next (node_modules/relay-runtime/lib/RelayModernQueryExecutor.js:96:16)
at Object.next (node_modules/relay-runtime/lib/RelayObservable.js:565:20)
at node_modules/relay-runtime/lib/RelayObservable.js:482:12
The relay updater
and onComplete
callbacks are never reached. I've tried shaping the mock in various ways and I can't seem to get it to work. What am I doing wrong?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.