From 7f9f1ffdc5b6ad3d5bcfa2fce2cb24ad4524fb26 Mon Sep 17 00:00:00 2001 From: Dirk-Jan Rutten Date: Sat, 23 Dec 2017 18:06:43 +0100 Subject: [PATCH 1/7] Removed the react-native test. --- package.json | 9 +- .../__snapshots__/component.test.tsx.snap | 11 --- test/react-native/component.test.tsx | 96 ------------------- 3 files changed, 2 insertions(+), 114 deletions(-) delete mode 100644 test/react-native/__snapshots__/component.test.tsx.snap delete mode 100644 test/react-native/component.test.tsx diff --git a/package.json b/package.json index 809830e939..7eaf8c8c88 100644 --- a/package.json +++ b/package.json @@ -61,18 +61,15 @@ ], "author": "James Baxley ", "babel": { - "presets": ["react-native"] + "presets": ["env"] }, "jest": { - "preset": "react-native", "testEnvironment": "jsdom", "transform": { "^.+\\.tsx?$": "/node_modules/ts-jest/preprocessor.js", "^.+\\.jsx?$": "babel-jest" }, - "transformIgnorePatterns": [ - "/node_modules/(?!(lodash-es|react-native)/)" - ], + "transformIgnorePatterns": ["/node_modules/(?!(lodash-es)/)"], "moduleFileExtensions": ["ts", "tsx", "js", "json"], "modulePathIgnorePatterns": [ "/examples", @@ -107,7 +104,6 @@ "babel-core": "6.26.0", "babel-jest": "22.0.4", "babel-preset-env": "1.6.1", - "babel-preset-react-native": "4.0.0", "bundlesize": "0.15.3", "cheerio": "1.0.0-rc.2", "colors": "1.1.2", @@ -131,7 +127,6 @@ "react": "16.2.0", "react-addons-test-utils": "15.6.2", "react-dom": "16.2.0", - "react-native": "0.51.0", "react-test-renderer": "16.2.0", "recompose": "0.26.0", "rimraf": "2.6.2", diff --git a/test/react-native/__snapshots__/component.test.tsx.snap b/test/react-native/__snapshots__/component.test.tsx.snap deleted file mode 100644 index 1c2c7ff5f9..0000000000 --- a/test/react-native/__snapshots__/component.test.tsx.snap +++ /dev/null @@ -1,11 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`App renders correctly 1`] = ` - - Loading... - -`; diff --git a/test/react-native/component.test.tsx b/test/react-native/component.test.tsx deleted file mode 100644 index 65e8ab35da..0000000000 --- a/test/react-native/component.test.tsx +++ /dev/null @@ -1,96 +0,0 @@ -import { Text } from 'react-native'; -import * as React from 'react'; -// Note: test renderer must be required after react-native. -import * as renderer from 'react-test-renderer'; -import ApolloClient from 'apollo-client'; -import { InMemoryCache as Cache } from 'apollo-cache-inmemory'; -import gql from 'graphql-tag'; -import { ApolloProvider, ChildProps, graphql } from '../../src'; -import { mockSingleLink } from '../../src/test-utils'; -import '../test-utils/toEqualJson'; - -describe('App', () => { - it('renders correctly', () => { - const query = gql` - query people { - allPeople(first: 1) { - people { - name - } - } - } - `; - - interface Data { - allPeople: { people: { name: string } }; - } - const link = mockSingleLink({ - request: { query }, - result: { data: { allPeople: { people: { name: 'Luke Skywalker' } } } }, - }); - const client = new ApolloClient({ - link, - cache: new Cache({ addTypename: false }), - }); - - const ContainerWithData = graphql(query)( - ({ data }: ChildProps<{}, Data>) => { - if (data.loading) return Loading...; - return {data.allPeople.people.name}; - }, - ); - const output = renderer.create( - - - , - ); - expect(output.toJSON()).toMatchSnapshot(); - }); - - it('executes a query', done => { - jest.useRealTimers(); - const query = gql` - query people { - allPeople(first: 1) { - people { - name - } - } - } - `; - interface Data { - allPeople: { people: { name: string } }; - } - const data1 = { allPeople: { people: { name: 'Luke Skywalker' } } }; - const link = mockSingleLink({ - request: { query }, - result: { data: data1 }, - }); - const client = new ApolloClient({ - link, - cache: new Cache({ addTypename: false }), - }); - - class Container extends React.Component> { - componentWillReceiveProps(props) { - expect(props.data.loading).toBeFalsy(); - expect(props.data.allPeople.people.name).toEqualJson( - data1.allPeople.people.name, - ); - done(); - } - render() { - if (this.props.data.loading) return Loading...; - return {this.props.data.allPeople.people.name}; - } - } - - const ContainerWithData = graphql(query)(Container); - - renderer.create( - - - , - ); - }); -}); From 53462f32a5ab4b8ffcf9b1fa465554f9eab255b6 Mon Sep 17 00:00:00 2001 From: Dirk-Jan Rutten Date: Tue, 26 Dec 2017 21:49:30 +0100 Subject: [PATCH 2/7] Improved test case --- test/react-web/client/Query.test.tsx | 17 +++++++---------- 1 file changed, 7 insertions(+), 10 deletions(-) diff --git a/test/react-web/client/Query.test.tsx b/test/react-web/client/Query.test.tsx index bac50bbc35..f822e8392b 100644 --- a/test/react-web/client/Query.test.tsx +++ b/test/react-web/client/Query.test.tsx @@ -191,15 +191,19 @@ describe('Query component', () => { }, ]; - const render = jest.fn(() => null); - const variables = { first: 1, }; const Component = () => ( - {render} + {result => { + catchAsyncError(done, () => { + expect(result.variables).toEqual({ first: 1 }); + done(); + }); + return null; + }} ); @@ -208,13 +212,6 @@ describe('Query component', () => { , ); - - setTimeout(() => { - catchAsyncError(done, () => { - expect(render.mock.calls[0][0].variables).toEqual({ first: 1 }); - done(); - }); - }, 0); }); it('errors if a Mutation is provided in the query', () => { From 9d1a8878690f6a40c90d862eb2fed123b9b260f6 Mon Sep 17 00:00:00 2001 From: Dirk-Jan Rutten Date: Wed, 27 Dec 2017 15:33:15 +0100 Subject: [PATCH 3/7] Unmount the component after the tests. --- test/react-web/client/Query.test.tsx | 46 +++++++++++++++------------- 1 file changed, 25 insertions(+), 21 deletions(-) diff --git a/test/react-web/client/Query.test.tsx b/test/react-web/client/Query.test.tsx index f822e8392b..4483080cdb 100644 --- a/test/react-web/client/Query.test.tsx +++ b/test/react-web/client/Query.test.tsx @@ -7,7 +7,6 @@ import ApolloProvider from '../../../src/ApolloProvider'; import Query from '../../../src/Query'; import { MockedProvider, mockSingleLink } from '../../../src/test-utils'; import catchAsyncError from '../../test-utils/catchAsyncError'; -// import { all } from 'async'; const allPeopleQuery = gql` query people { @@ -27,10 +26,17 @@ const allPeopleMocks = [ ]; describe('Query component', () => { + let wrapper; beforeEach(() => { jest.useRealTimers(); }); + afterEach(() => { + if (wrapper) { + wrapper.unmount(); + wrapper = null; + } + }); it('calls the children prop', done => { const Component = () => ( @@ -51,7 +57,7 @@ describe('Query component', () => { ); - mount( + wrapper = mount( , @@ -63,7 +69,7 @@ describe('Query component', () => { {result =>
} ); - const wrapper = mount( + wrapper = mount( , @@ -99,7 +105,7 @@ describe('Query component', () => { ); - mount( + wrapper = mount( , @@ -121,7 +127,7 @@ describe('Query component', () => { ); - mount( + wrapper = mount( , @@ -159,7 +165,7 @@ describe('Query component', () => { ); - mount( + wrapper = mount( , @@ -207,7 +213,7 @@ describe('Query component', () => { ); - mount( + wrapper = mount( , @@ -265,7 +271,7 @@ describe('Query component', () => { console.error = errorLogger; }); - it('provides a refetch render prop', done => { + fit('provides a refetch render prop', done => { const queryRefetch = gql` query people($first: Int) { allPeople(first: $first) { @@ -316,6 +322,7 @@ describe('Query component', () => { count++; return null; } + catchAsyncError(done, () => { if (count === 1) { // first data @@ -363,7 +370,7 @@ describe('Query component', () => { ); - mount( + wrapper = mount( , @@ -434,7 +441,7 @@ describe('Query component', () => { ); - mount( + wrapper = mount( , @@ -487,7 +494,7 @@ describe('Query component', () => { }, ]; - const wrapper = mount( + wrapper = mount( , @@ -497,7 +504,6 @@ describe('Query component', () => { catchAsyncError(done, () => { expect(count).toBe(POLL_COUNT); - wrapper.unmount(); done(); }); }); @@ -557,7 +563,7 @@ describe('Query component', () => { }, ]; - const wrapper = mount( + wrapper = mount( , @@ -567,7 +573,6 @@ describe('Query component', () => { catchAsyncError(done, () => { expect(count).toBe(POLL_COUNT); - wrapper.unmount(); done(); }); }); @@ -617,7 +622,7 @@ describe('Query component', () => { }, ]; - const wrapper = mount( + wrapper = mount( , @@ -627,7 +632,6 @@ describe('Query component', () => { catchAsyncError(done, () => { expect(count).toBe(POLL_COUNT); - wrapper.unmount(); done(); }); }); @@ -682,7 +686,7 @@ describe('Query component', () => { ); - mount( + wrapper = mount( , @@ -761,7 +765,7 @@ describe('Query component', () => { } } - mount( + wrapper = mount( , @@ -834,7 +838,7 @@ describe('Query component', () => { } } - mount( + wrapper = mount( , @@ -884,7 +888,7 @@ describe('Query component', () => { } } - mount( + wrapper = mount( , @@ -950,6 +954,6 @@ describe('Query component', () => { } } - mount(); + wrapper = mount(); }); }); From bb8e954215accf38f6bc1eab39ae61d1da3411e7 Mon Sep 17 00:00:00 2001 From: Dirk-Jan Rutten Date: Wed, 27 Dec 2017 15:50:11 +0100 Subject: [PATCH 4/7] Fixed the query tests by adding missing mocks. --- test/react-web/client/Query.test.tsx | 18 ++++++++++++++++-- 1 file changed, 16 insertions(+), 2 deletions(-) diff --git a/test/react-web/client/Query.test.tsx b/test/react-web/client/Query.test.tsx index 4483080cdb..967397a1a2 100644 --- a/test/react-web/client/Query.test.tsx +++ b/test/react-web/client/Query.test.tsx @@ -135,6 +135,20 @@ describe('Query component', () => { }); it('sets the notifyOnNetworkStatusChange prop', done => { + const data1 = { allPeople: { people: [{ name: 'Luke Skywalker' }] } }; + const data2 = { allPeople: { people: [{ name: 'Han Solo' }] } }; + + const mocks = [ + { + request: { query: allPeopleQuery }, + result: { data: data1 }, + }, + { + request: { query: allPeopleQuery }, + result: { data: data2 }, + }, + ]; + let count = 0; expect.assertions(4); const Component = () => ( @@ -166,7 +180,7 @@ describe('Query component', () => { ); wrapper = mount( - + , ); @@ -271,7 +285,7 @@ describe('Query component', () => { console.error = errorLogger; }); - fit('provides a refetch render prop', done => { + it('provides a refetch render prop', done => { const queryRefetch = gql` query people($first: Int) { allPeople(first: $first) { From 6cc94f7111907035058592d49ea6841c5bc617e8 Mon Sep 17 00:00:00 2001 From: Dirk-Jan Rutten Date: Wed, 27 Dec 2017 16:17:35 +0100 Subject: [PATCH 5/7] Fixed incorrect test implementation for the observable query --- .../client/graphql/queries/observableQuery.test.tsx | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) diff --git a/test/react-web/client/graphql/queries/observableQuery.test.tsx b/test/react-web/client/graphql/queries/observableQuery.test.tsx index 37072ad4e6..4f4b3e8db2 100644 --- a/test/react-web/client/graphql/queries/observableQuery.test.tsx +++ b/test/react-web/client/graphql/queries/observableQuery.test.tsx @@ -7,7 +7,7 @@ import { ApolloLink } from 'apollo-link'; import { InMemoryCache as Cache } from 'apollo-cache-inmemory'; import { mockSingleLink } from '../../../../../src/test-utils'; import { ApolloProvider, graphql } from '../../../../../src'; - +import catchAsyncError from '../../../../test-utils/catchAsyncError'; import stripSymbols from '../../../../test-utils/stripSymbols'; describe('[queries] observableQuery', () => { @@ -217,7 +217,7 @@ describe('[queries] observableQuery', () => { expect(queryObservable1).toBe(queryObservable2); }); - it('will refetch active `ObservableQuery`s when resetting the client store', () => { + it('will refetch active `ObservableQuery`s when resetting the client store', done => { const query = gql` query people { allPeople(first: 1) { @@ -227,7 +227,7 @@ describe('[queries] observableQuery', () => { } } `; - // const data = { allPeople: { people: [{ name: 'Luke Skywalker' }] } }; + let called = 0; const link = new ApolloLink((o, f) => { called++; @@ -266,7 +266,10 @@ describe('[queries] observableQuery', () => { expect(keys).toEqual(['1']); expect(called).toBe(1); (client.resetStore() as Promise).then(() => { - expect(called).toBe(2); + catchAsyncError(done, () => { + expect(called).toBe(2); + done(); + }); }); }); From 0ab70e13f0fb22b8fded6a72b02bf4ecd58d1fa9 Mon Sep 17 00:00:00 2001 From: Dirk-Jan Rutten Date: Thu, 28 Dec 2017 11:23:48 +0100 Subject: [PATCH 6/7] Removed broken tests --- .../graphql/queries/observableQuery.test.tsx | 56 ------------------- 1 file changed, 56 deletions(-) diff --git a/test/client/graphql/queries/observableQuery.test.tsx b/test/client/graphql/queries/observableQuery.test.tsx index 487c00bbc0..60d18fbde0 100644 --- a/test/client/graphql/queries/observableQuery.test.tsx +++ b/test/client/graphql/queries/observableQuery.test.tsx @@ -217,62 +217,6 @@ describe('[queries] observableQuery', () => { expect(queryObservable1).toBe(queryObservable2); }); - it('will refetch active `ObservableQuery`s when resetting the client store', done => { - const query = gql` - query people { - allPeople(first: 1) { - people { - name - } - } - } - `; - - let called = 0; - const link = new ApolloLink((o, f) => { - called++; - return f(o); - }).concat( - mockSingleLink( - { - request: { query }, - result: { data: { allPeople: null } }, - }, - { - request: { query }, - result: { data: { allPeople: { people: null } } }, - }, - ), - ); - const client = new ApolloClient({ - link, - cache: new Cache({ addTypename: false }), - }); - - @graphql(query) - class Container extends React.Component { - render() { - return null; - } - } - - renderer.create( - - - , - ); - - const keys = Array.from((client.queryManager as any).queries.keys()); - expect(keys).toEqual(['1']); - expect(called).toBe(1); - (client.resetStore() as Promise).then(() => { - catchAsyncError(done, () => { - expect(called).toBe(2); - done(); - }); - }); - }); - it('will recycle `ObservableQuery`s when re-rendering a portion of the tree', done => { const query = gql` query people { From ba76f610f7cdd7357d0ddbb3e22074a010273be3 Mon Sep 17 00:00:00 2001 From: Dirk-Jan Rutten Date: Thu, 28 Dec 2017 11:44:00 +0100 Subject: [PATCH 7/7] Removed unused import --- test/client/graphql/queries/observableQuery.test.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/test/client/graphql/queries/observableQuery.test.tsx b/test/client/graphql/queries/observableQuery.test.tsx index 60d18fbde0..6d4542a7af 100644 --- a/test/client/graphql/queries/observableQuery.test.tsx +++ b/test/client/graphql/queries/observableQuery.test.tsx @@ -7,7 +7,6 @@ import { ApolloLink } from 'apollo-link'; import { InMemoryCache as Cache } from 'apollo-cache-inmemory'; import { mockSingleLink } from '../../../../src/test-utils'; import { ApolloProvider, graphql } from '../../../../src'; -import catchAsyncError from '../../../test-utils/catchAsyncError'; import stripSymbols from '../../../test-utils/stripSymbols'; describe('[queries] observableQuery', () => {