Skip to content

Commit

Permalink
Merge pull request #121 from morrys/relay-v13
Browse files Browse the repository at this point in the history 
support relay v13 & react v18
  • Loading branch information
@morrys
morrys authored May 20, 2022
2 parents b130223 + e07fbf2 commit 378bb98
Show file tree
Hide file tree
Showing 10 changed files with 36,335 additions and 7,608 deletions.
3 changes: 2 additions & 1 deletion .gitignore
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,4 +4,5 @@ lib
test
*.tgz
coverage
.DS_Store
.DS_Store
.idea
140 changes: 58 additions & 82 deletions __tests__/ReactRelayQueryRenderer-test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,9 +14,8 @@
*/

'use strict';
jest.useFakeTimers();

jest.mock('scheduler', () => require.requireActual('scheduler/unstable_mock'));
jest.mock('scheduler', () => jest.requireActual('scheduler/unstable_mock'));

import * as React from 'react';
//import * as Scheduler from 'scheduler';
Expand All @@ -31,11 +30,21 @@ import * as ReactTestRenderer from 'react-test-renderer';

//import readContext from "react-relay/lib/readContext";

import { createOperationDescriptor, Network, Observable, ROOT_ID } from 'relay-runtime';
import { createOperationDescriptor, graphql, Network, Observable, ROOT_ID } from 'relay-runtime';

import { ROOT_TYPE } from 'relay-runtime/lib/store/RelayStoreUtils';

import { generateAndCompile, createMockEnvironment, createPersistedStore, createPersistedRecordSource } from '../src-test';
import { createMockEnvironment, createPersistedStore, createPersistedRecordSource } from '../src-test';

const NextQueryGenerated = graphql`
query ReactRelayQueryRendererTestNextQuery($id: ID!) {
node(id: $id) {
... on User {
name
}
}
}
`;

function expectToBeRendered(
renderSpy,
Expand Down Expand Up @@ -176,28 +185,30 @@ describe('ReactRelayQueryRenderer', () => {
}
}

beforeEach(async () => {
beforeEach(() => {
Scheduler.unstable_clearYields();
jest.resetModules();

environment = createMockEnvironment();
store = environment.getStore();
({ TestQuery } = generateAndCompile(`
query TestQuery($id: ID = "<default>") {
const frag = graphql`
fragment ReactRelayQueryRendererTestFragment on User {
name
}
`;
TestQuery = graphql`
query ReactRelayQueryRendererTestQuery($id: ID = "<default>") {
node(id: $id) {
id
...TestFragment
...ReactRelayQueryRendererTestFragment
}
}
fragment TestFragment on User {
name
}
`));
`;

render = jest.fn(() => <div />);
variables = { id: '4' };
await environment.hydrate();
environment.hydrate();
jest.runAllTimers();
});

afterEach(async () => {
Expand Down Expand Up @@ -243,7 +254,7 @@ describe('ReactRelayQueryRenderer', () => {
__isWithinUnmatchedTypeRefinement: false,

__fragments: {
TestFragment: {},
ReactRelayQueryRendererTestFragment: {},
},

__fragmentOwner: owner.request,
Expand Down Expand Up @@ -374,7 +385,7 @@ describe('ReactRelayQueryRenderer', () => {
__isWithinUnmatchedTypeRefinement: false,

__fragments: {
TestFragment: {},
ReactRelayQueryRendererTestFragment: {},
},

__fragmentOwner: owner.request,
Expand All @@ -400,7 +411,7 @@ describe('ReactRelayQueryRenderer', () => {
__isWithinUnmatchedTypeRefinement: false,

__fragments: {
TestFragment: {},
ReactRelayQueryRendererTestFragment: {},
},

__fragmentOwner: owner.request,
Expand All @@ -412,7 +423,7 @@ describe('ReactRelayQueryRenderer', () => {
});
});
describe('when fetch returns a response synchronously first time', () => {
it('fetches the query once, always renders snapshot returned by fetch', async () => {
it('fetches the query once, always renders snapshot returned by fetch', () => {
const fetch = jest.fn().mockReturnValueOnce(response);
store = new Store(
new RecordSource({ storage: createPersistedRecordSource() }),
Expand All @@ -425,7 +436,8 @@ describe('ReactRelayQueryRenderer', () => {
network: Network.create(fetch),
store,
});
await environment.hydrate();
environment.hydrate();
jest.runAllTimers();
function Child(props) {
// NOTE the unstable_yieldValue method will move to the static renderer.
// When React sync runs we need to update this.
Expand Down Expand Up @@ -468,7 +480,7 @@ describe('ReactRelayQueryRenderer', () => {

__isWithinUnmatchedTypeRefinement: false,
__fragments: {
TestFragment: {},
ReactRelayQueryRendererTestFragment: {},
},

__fragmentOwner: owner.request,
Expand All @@ -492,7 +504,7 @@ describe('ReactRelayQueryRenderer', () => {
__isWithinUnmatchedTypeRefinement: false,

__fragments: {
TestFragment: {},
ReactRelayQueryRendererTestFragment: {},
},

__fragmentOwner: owner.request,
Expand All @@ -503,9 +515,10 @@ describe('ReactRelayQueryRenderer', () => {
});
});
describe('when variables change before first result has completed', () => {
it('correctly renders data for new variables', async () => {
it('correctly renders data for new variables', () => {
environment = createMockEnvironment();
await environment.hydrate();
environment.hydrate();
jest.runAllTimers();
let pendingRequests = [];
jest.spyOn(environment, 'execute').mockImplementation((request: any) => {
const nextRequest: any = { request };
Expand Down Expand Up @@ -544,7 +557,7 @@ describe('ReactRelayQueryRenderer', () => {
__isWithinUnmatchedTypeRefinement: false,

__fragments: {
TestFragment: {},
ReactRelayQueryRendererTestFragment: {},
},

__fragmentOwner: firstOwner.request,
Expand Down Expand Up @@ -603,7 +616,7 @@ describe('ReactRelayQueryRenderer', () => {
__isWithinUnmatchedTypeRefinement: false,

__fragments: {
TestFragment: {},
ReactRelayQueryRendererTestFragment: {},
},

__fragmentOwner: thirdOwner.request,
Expand Down Expand Up @@ -676,7 +689,7 @@ describe('ReactRelayQueryRenderer', () => {
id: '4',
__isWithinUnmatchedTypeRefinement: false,
__fragments: {
TestFragment: {},
ReactRelayQueryRendererTestFragment: {},
},

__fragmentOwner: owner.request,
Expand All @@ -686,7 +699,7 @@ describe('ReactRelayQueryRenderer', () => {
});
});

it('skip loading state when request could be resolved synchronously', async () => {
it('skip loading state when request could be resolved synchronously', () => {
const fetch = () => response;
store = new Store(
new RecordSource({ storage: createPersistedRecordSource() }),
Expand All @@ -699,7 +712,8 @@ describe('ReactRelayQueryRenderer', () => {
network: Network.create(fetch),
store,
});
await environment.hydrate();
environment.hydrate();
jest.runAllTimers();
ReactTestRenderer.create(
<ReactRelayQueryRenderer
query={TestQuery}
Expand All @@ -718,7 +732,7 @@ describe('ReactRelayQueryRenderer', () => {
__isWithinUnmatchedTypeRefinement: false,

__fragments: {
TestFragment: {},
ReactRelayQueryRendererTestFragment: {},
},

__fragmentOwner: owner.request,
Expand All @@ -728,7 +742,7 @@ describe('ReactRelayQueryRenderer', () => {
});
});

it('skip loading state when request failed synchronously', async () => {
it('skip loading state when request failed synchronously', () => {
const error = new Error('Mock Network Error');
const fetch: any = () => error;
store = new Store(
Expand All @@ -742,7 +756,8 @@ describe('ReactRelayQueryRenderer', () => {
network: Network.create(fetch),
store,
});
await environment.hydrate();
environment.hydrate();
jest.runAllTimers();
ReactTestRenderer.create(
<ReactRelayQueryRenderer
query={TestQuery}
Expand Down Expand Up @@ -823,7 +838,7 @@ describe('ReactRelayQueryRenderer', () => {
expect(environment.execute).not.toBeCalled();
});

it('refetches if the `environment` prop changes', async () => {
it('refetches if the `environment` prop changes', () => {
expect.assertions(5);
environment.mock.resolve(TestQuery, {
data: {
Expand All @@ -835,7 +850,8 @@ describe('ReactRelayQueryRenderer', () => {
// Update with a different environment
environment.mockClear();
environment = createMockEnvironment();
await environment.hydrate();
environment.hydrate();
jest.runAllTimers();
renderer.getInstance().setProps({
environment,
query: TestQuery,
Expand Down Expand Up @@ -903,15 +919,7 @@ describe('ReactRelayQueryRenderer', () => {
render.mockClear();

// Update with a different query
const { NextQuery } = generateAndCompile(`
query NextQuery($id: ID!) {
node(id: $id) {
... on User {
name
}
}
}
`);
const NextQuery = NextQueryGenerated;
renderer.getInstance().setProps({
cacheConfig,
environment,
Expand Down Expand Up @@ -969,7 +977,7 @@ describe('ReactRelayQueryRenderer', () => {
__isWithinUnmatchedTypeRefinement: false,

__fragments: {
TestFragment: {},
ReactRelayQueryRendererTestFragment: {},
},

__fragmentOwner: owner.request,
Expand Down Expand Up @@ -1023,7 +1031,7 @@ describe('ReactRelayQueryRenderer', () => {
id: '4',
__isWithinUnmatchedTypeRefinement: false,
__fragments: {
TestFragment: {},
ReactRelayQueryRendererTestFragment: {},
},

__fragmentOwner: owner.request,
Expand All @@ -1039,7 +1047,7 @@ describe('ReactRelayQueryRenderer', () => {
__isWithinUnmatchedTypeRefinement: false,

__fragments: {
TestFragment: {},
ReactRelayQueryRendererTestFragment: {},
},

__fragmentOwner: owner.request,
Expand Down Expand Up @@ -1086,7 +1094,7 @@ describe('ReactRelayQueryRenderer', () => {
id: '4',
__isWithinUnmatchedTypeRefinement: false,
__fragments: {
TestFragment: {},
ReactRelayQueryRendererTestFragment: {},
},

__fragmentOwner: owner.request,
Expand All @@ -1111,15 +1119,7 @@ describe('ReactRelayQueryRenderer', () => {
let nextProps;

beforeEach(() => {
({ NextQuery } = generateAndCompile(`
query NextQuery($id: ID!) {
node(id: $id) {
... on User {
name
}
}
}
`));
NextQuery = NextQueryGenerated;

variables = { id: '4' };
renderer = ReactTestRenderer.create(
Expand Down Expand Up @@ -1174,15 +1174,7 @@ describe('ReactRelayQueryRenderer', () => {
let nextProps;

beforeEach(() => {
({ NextQuery } = generateAndCompile(`
query NextQuery($id: ID!) {
node(id: $id) {
... on User {
name
}
}
}
`));
NextQuery = NextQueryGenerated;

variables = { id: '4' };
renderer = ReactTestRenderer.create(
Expand Down Expand Up @@ -1244,15 +1236,7 @@ describe('ReactRelayQueryRenderer', () => {
let nextProps;

beforeEach(() => {
({ NextQuery } = generateAndCompile(`
query NextQuery($id: ID!) {
node(id: $id) {
... on User {
name
}
}
}
`));
NextQuery = NextQueryGenerated;

renderer = ReactTestRenderer.create(
<PropsSetter>
Expand Down Expand Up @@ -1372,15 +1356,7 @@ describe('ReactRelayQueryRenderer', () => {
let nextProps;

beforeEach(() => {
({ NextQuery } = generateAndCompile(`
query NextQuery($id: ID!) {
node(id: $id) {
... on User {
name
}
}
}
`));
NextQuery = NextQueryGenerated;

renderer = ReactTestRenderer.create(
<PropsSetter>
Expand Down
Loading

0 comments on commit 378bb98

Please sign in to comment.