From c3363dfda6e4b3c0c075470fad18c61a409c2a90 Mon Sep 17 00:00:00 2001 From: Jordan Eldredge Date: Wed, 5 Mar 2025 11:30:01 -0800 Subject: [PATCH 1/2] Avoid making assertions about unrelated warning calls Differential Revision: D70639378 --- .../__tests__/usePreloadedQuery-test.js | 65 ++++++++++--------- .../useRefetchableFragmentNode-test.js | 7 +- 2 files changed, 37 insertions(+), 35 deletions(-) diff --git a/packages/react-relay/relay-hooks/__tests__/usePreloadedQuery-test.js b/packages/react-relay/relay-hooks/__tests__/usePreloadedQuery-test.js index 5fe02a8ad73f0..5a698a1f66b66 100644 --- a/packages/react-relay/relay-hooks/__tests__/usePreloadedQuery-test.js +++ b/packages/react-relay/relay-hooks/__tests__/usePreloadedQuery-test.js @@ -35,11 +35,16 @@ const {createMockEnvironment} = require('relay-test-utils'); const { injectPromisePolyfill__DEPRECATED, } = require('relay-test-utils-internal'); -const warning = require('warning'); +const { + disallowConsoleErrors, + disallowWarnings, + expectToWarn, +} = require('relay-test-utils-internal'); -injectPromisePolyfill__DEPRECATED(); +disallowWarnings(); +disallowConsoleErrors(); -jest.mock('warning'); +injectPromisePolyfill__DEPRECATED(); const query = graphql` query usePreloadedQueryTestQuery($id: ID!) { @@ -110,11 +115,6 @@ class ErrorBoundary extends React.Component<$FlowFixMe, $FlowFixMe> { } } -beforeEach(() => { - // $FlowFixMe[prop-missing] - warning.mockClear(); -}); - afterAll(() => { jest.clearAllMocks(); }); @@ -1041,15 +1041,20 @@ describe('usePreloadedQuery', () => { return data.node?.name; } let renderer; - TestRenderer.act(() => { - renderer = TestRenderer.create( - - - - - , - ); - }); + expectToWarn( + 'usePreloadedQuery(): usePreloadedQuery was passed a preloaded query that was created with a different environment than the one that is currently in context. In the future, this will become a hard error.', + () => { + TestRenderer.act(() => { + renderer = TestRenderer.create( + + + + + , + ); + }); + }, + ); expect(renderer?.toJSON()).toEqual('Fallback'); expect(altFetch).toHaveBeenCalledTimes(1); @@ -1058,16 +1063,20 @@ describe('usePreloadedQuery', () => { altDataSource.next(response); } - TestRenderer.act(() => jest.runAllImmediates()); + expectToWarn( + 'usePreloadedQuery(): usePreloadedQuery was passed a preloaded query that was created with a different environment than the one that is currently in context. In the future, this will become a hard error.', + () => { + TestRenderer.act(() => jest.runAllImmediates()); + }, + ); expect(renderer?.toJSON()).toEqual('Zuck'); }); }); describe('when loadQuery is passed a preloadedQuery that was disposed', () => { it('warns that the preloadedQuery has already been disposed', () => { - const expectWarningMessage = expect.stringMatching( - /^usePreloadedQuery\(\): Expected preloadedQuery to not be disposed/, - ); + const expectWarningMessage = + 'usePreloadedQuery(): Expected preloadedQuery to not be disposed yet. This is because disposing the query marks it for future garbage collection, and as such query results may no longer be present in the Relay store. In the future, this will become a hard error.'; const prefetched = loadQuery(environment, preloadableConcreteRequest, { id: '1', }); @@ -1091,19 +1100,11 @@ describe('usePreloadedQuery', () => { }; render(); - expect(warning).toBeCalledTimes(1); - expect(warning).toHaveBeenLastCalledWith( - true, // invariant holds - expectWarningMessage, - ); prefetched.dispose(); - render(); - expect(warning).toBeCalledTimes(2); - expect(warning).toHaveBeenLastCalledWith( - false, // invariant broken - expectWarningMessage, - ); + expectToWarn(expectWarningMessage, () => { + render(); + }); }); }); diff --git a/packages/react-relay/relay-hooks/__tests__/useRefetchableFragmentNode-test.js b/packages/react-relay/relay-hooks/__tests__/useRefetchableFragmentNode-test.js index 6bf01e10f15ec..25b50ed4962bd 100644 --- a/packages/react-relay/relay-hooks/__tests__/useRefetchableFragmentNode-test.js +++ b/packages/react-relay/relay-hooks/__tests__/useRefetchableFragmentNode-test.js @@ -646,10 +646,11 @@ describe.each([['New', useRefetchableFragmentInternal]])( refetch({id: '4'}); }); - expect(warning).toHaveBeenCalledTimes(1); + // $FlowFixMe[prop-missing] + const triggeredWarnings = warning.mock.calls.filter(args => !args[0]); + expect(triggeredWarnings.length).toBe(1); expect( - // $FlowFixMe[prop-missing] - warning.mock.calls[0][1].includes( + triggeredWarnings[0][1].includes( 'Relay: Unexpected call to `refetch` while using a null fragment ref', ), ).toEqual(true); From c62986dd6de3d584af1effc68623a3ff3d3c74f7 Mon Sep 17 00:00:00 2001 From: Jordan Eldredge Date: Fri, 7 Mar 2025 10:09:36 -0800 Subject: [PATCH 2/2] Don't use expectToWarn, it plays poorly with TestRenderer in OSS --- .../__tests__/usePreloadedQuery-test.js | 66 ++++++++++--------- 1 file changed, 34 insertions(+), 32 deletions(-) diff --git a/packages/react-relay/relay-hooks/__tests__/usePreloadedQuery-test.js b/packages/react-relay/relay-hooks/__tests__/usePreloadedQuery-test.js index 5a698a1f66b66..0157bf3476654 100644 --- a/packages/react-relay/relay-hooks/__tests__/usePreloadedQuery-test.js +++ b/packages/react-relay/relay-hooks/__tests__/usePreloadedQuery-test.js @@ -35,17 +35,12 @@ const {createMockEnvironment} = require('relay-test-utils'); const { injectPromisePolyfill__DEPRECATED, } = require('relay-test-utils-internal'); -const { - disallowConsoleErrors, - disallowWarnings, - expectToWarn, -} = require('relay-test-utils-internal'); - -disallowWarnings(); -disallowConsoleErrors(); +const warning = require('warning'); injectPromisePolyfill__DEPRECATED(); +jest.mock('warning'); + const query = graphql` query usePreloadedQueryTestQuery($id: ID!) { node(id: $id) { @@ -115,6 +110,11 @@ class ErrorBoundary extends React.Component<$FlowFixMe, $FlowFixMe> { } } +beforeEach(() => { + // $FlowFixMe[prop-missing] + warning.mockClear(); +}); + afterAll(() => { jest.clearAllMocks(); }); @@ -1041,20 +1041,15 @@ describe('usePreloadedQuery', () => { return data.node?.name; } let renderer; - expectToWarn( - 'usePreloadedQuery(): usePreloadedQuery was passed a preloaded query that was created with a different environment than the one that is currently in context. In the future, this will become a hard error.', - () => { - TestRenderer.act(() => { - renderer = TestRenderer.create( - - - - - , - ); - }); - }, - ); + TestRenderer.act(() => { + renderer = TestRenderer.create( + + + + + , + ); + }); expect(renderer?.toJSON()).toEqual('Fallback'); expect(altFetch).toHaveBeenCalledTimes(1); @@ -1063,12 +1058,7 @@ describe('usePreloadedQuery', () => { altDataSource.next(response); } - expectToWarn( - 'usePreloadedQuery(): usePreloadedQuery was passed a preloaded query that was created with a different environment than the one that is currently in context. In the future, this will become a hard error.', - () => { - TestRenderer.act(() => jest.runAllImmediates()); - }, - ); + TestRenderer.act(() => jest.runAllImmediates()); expect(renderer?.toJSON()).toEqual('Zuck'); }); }); @@ -1076,7 +1066,7 @@ describe('usePreloadedQuery', () => { describe('when loadQuery is passed a preloadedQuery that was disposed', () => { it('warns that the preloadedQuery has already been disposed', () => { const expectWarningMessage = - 'usePreloadedQuery(): Expected preloadedQuery to not be disposed yet. This is because disposing the query marks it for future garbage collection, and as such query results may no longer be present in the Relay store. In the future, this will become a hard error.'; + /^usePreloadedQuery\(\): Expected preloadedQuery to not be disposed/; const prefetched = loadQuery(environment, preloadableConcreteRequest, { id: '1', }); @@ -1100,11 +1090,23 @@ describe('usePreloadedQuery', () => { }; render(); + // $FlowFixMe[prop-missing] + const warningCallsBefore = warning.mock.calls.filter(([_, message]) => + message.match(expectWarningMessage), + ); + expect(warningCallsBefore.length).toBe(1); + // invariant holds + expect(warningCallsBefore[0][0]).toBe(true); prefetched.dispose(); - expectToWarn(expectWarningMessage, () => { - render(); - }); + render(); + // $FlowFixMe[prop-missing] + const warningCallsAfter = warning.mock.calls.filter(([_, message]) => + message.match(expectWarningMessage), + ); + expect(warningCallsAfter.length).toBe(2); + // invariant broken + expect(warningCallsAfter[1][0]).toBe(false); }); });