diff --git a/packages/hooks/src/__tests__/useQuery.test.tsx b/packages/hooks/src/__tests__/useQuery.test.tsx index 6cbdb8e5a5..373dddef7c 100644 --- a/packages/hooks/src/__tests__/useQuery.test.tsx +++ b/packages/hooks/src/__tests__/useQuery.test.tsx @@ -841,6 +841,11 @@ describe('useQuery Hook', () => { break; case 3: expect(loading).toBeFalsy(); + expect(data).toEqual({ + cars: [carResults.cars[0]] + }); + break; + case 4: expect(data).toEqual({ cars: [carResults.cars[0], moreCarResults.cars[0]] }); @@ -859,7 +864,7 @@ describe('useQuery Hook', () => { ); await wait(() => { - expect(renderCount).toBe(4); + expect(renderCount).toBe(5); }); } ); diff --git a/packages/hooks/src/data/QueryData.ts b/packages/hooks/src/data/QueryData.ts index 06efa6d0b1..a45b24258a 100644 --- a/packages/hooks/src/data/QueryData.ts +++ b/packages/hooks/src/data/QueryData.ts @@ -267,30 +267,14 @@ export class QueryData extends OperationData { next: ({ loading, networkStatus, data }) => { const previousResult = this.previousData.result; - if (previousResult) { - // Calls to `ObservableQuery.fetchMore` return a result before the - // `updateQuery` function fully finishes. This can lead to an - // extra un-necessary re-render since the initially returned data is - // the same as data that has already been rendered. We'll - // prevent the un-necessary render from happening, making sure - // `fetchMore` results are only rendered when `updateQuery` has - // completed. - if ( - previousResult.loading && - previousResult.networkStatus === NetworkStatus.fetchMore && - isEqual(previousResult.data, data) - ) { - return; - } - - // Make sure we're not attempting to re-render similar results - if ( - previousResult.loading === loading && - previousResult.networkStatus === networkStatus && - isEqual(previousResult.data, data) - ) { - return; - } + // Make sure we're not attempting to re-render similar results + if ( + previousResult && + previousResult.loading === loading && + previousResult.networkStatus === networkStatus && + isEqual(previousResult.data, data) + ) { + return; } this.forceUpdate();