diff --git a/Changelog.md b/Changelog.md index 238607b807..c01ca5dc9e 100644 --- a/Changelog.md +++ b/Changelog.md @@ -1,6 +1,7 @@ # Change log ### vNext +- MockNetworkInterface match mock requests regardless of variable order [#973](https://github.com/apollographql/react-apollo/pull/973) ### 1.4.11 - Replace string refs with callback refs [#908](https://github.com/apollographql/react-apollo/pull/908) diff --git a/src/test-utils.tsx b/src/test-utils.tsx index 05173a9792..94855db6cd 100644 --- a/src/test-utils.tsx +++ b/src/test-utils.tsx @@ -258,9 +258,10 @@ export class MockSubscriptionNetworkInterface extends MockNetworkInterface function requestToKey(request: ParsedRequest): string { const queryString = request.query && print(request.query); - return JSON.stringify({ + const requestKey = { variables: request.variables || {}, debugName: request.debugName, query: queryString, - }); + }; + return JSON.stringify(requestKey, Object.keys(requestKey).sort()); } diff --git a/test/react-web/client/graphql/queries/index.test.tsx b/test/react-web/client/graphql/queries/index.test.tsx index f7ff02a3a6..b6995827ea 100644 --- a/test/react-web/client/graphql/queries/index.test.tsx +++ b/test/react-web/client/graphql/queries/index.test.tsx @@ -244,6 +244,59 @@ describe('queries', () => { ); }); + it("doesn't care about the order of variables in a request", done => { + const query = gql` + query people($first: Int, $jedi: Boolean) { + allPeople(first: $first, jedi: $jedi) { + people { + name + } + } + } + `; + const data = { allPeople: { people: [{ name: 'Luke Skywalker' }] } }; + const variables = { first: 1, jedi: true }; + const mocks = [ + { + request: { + query, + variables, + }, + result: { + data, + }, + }, + ]; + const networkInterface = mockNetworkInterface.apply(null, mocks); + const client = new ApolloClient({ networkInterface, addTypename: false }); + const options = { + options: { + variables: { + jedi: true, + first: 1, + }, + }, + }; + + @graphql(query, options) + class Container extends React.Component { + componentWillReceiveProps(props) { + expect(props.data.loading).toBe(false); + expect(props.data.allPeople).toEqual(data.allPeople); + done(); + } + render() { + return null; + } + } + + renderer.create( + + + , + ); + }); + it('allows falsy values in the mapped variables from props', done => { const query = gql` query people($first: Int) {