Run tests with React 19 RC.1 and adjust tests accordingly #12140

phryneas · 2024-11-18T16:58:27Z

If we are not in a render-streaming test

replace render to renderAsync for suspense tests
replace act with actAsync for suspense tests
adjust in counting tests for additional sibling prerendering in React 19 (these really should move over to committed-render streaming tests!)

If we are in a render-streaming test

various render calls now return promises -> add await
enforce calling disableActEnvironment on a per-test basis
remove act calls in these tests

Before we merge this, we should review testing-library/react-render-stream-testing-library#10 and release it as 2.0 (released as 2.0 alpha for now)

This currently builds on top of a PR in RRSTL and inlines actAsync, and renderAyncHook from testing-library/react-testing-library#1365 while providing a simple wrapper as renderAsync.

Please also review testing-library/react-render-stream-testing-library#10

I will still investigate using https://github.com/eps1lon/codemod-missing-await-act, but do so in a separate PR

svc-apollo-docs · 2024-11-18T16:58:31Z

✅ Docs Preview Ready

No new or changed pages found.

changeset-bot · 2024-11-18T16:58:31Z

⚠️ No Changeset found

Latest commit: 1507630

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

pkg-pr-new · 2024-11-18T16:59:26Z

npm i https://pkg.pr.new/@apollo/client@12140

commit: 1507630

github-actions · 2024-11-18T16:59:47Z

size-limit report 📦

Path	Size
dist/apollo-client.min.cjs	39.33 KB (0%)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/main.cjs"	48.01 KB (0%)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/main.cjs" (production)	45.59 KB (0%)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/index.js"	34.4 KB (0%)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/index.js" (production)	32.29 KB (0%)
import { ApolloProvider } from "dist/react/index.js"	1.26 KB (0%)
import { ApolloProvider } from "dist/react/index.js" (production)	1.24 KB (0%)
import { useQuery } from "dist/react/index.js"	5.21 KB (0%)
import { useQuery } from "dist/react/index.js" (production)	4.3 KB (0%)
import { useLazyQuery } from "dist/react/index.js"	5.69 KB (0%)
import { useLazyQuery } from "dist/react/index.js" (production)	4.77 KB (0%)
import { useMutation } from "dist/react/index.js"	3.62 KB (0%)
import { useMutation } from "dist/react/index.js" (production)	2.84 KB (0%)
import { useSubscription } from "dist/react/index.js"	4.42 KB (0%)
import { useSubscription } from "dist/react/index.js" (production)	3.48 KB (0%)
import { useSuspenseQuery } from "dist/react/index.js"	5.51 KB (0%)
import { useSuspenseQuery } from "dist/react/index.js" (production)	4.17 KB (0%)
import { useBackgroundQuery } from "dist/react/index.js"	5.01 KB (0%)
import { useBackgroundQuery } from "dist/react/index.js" (production)	3.66 KB (0%)
import { useLoadableQuery } from "dist/react/index.js"	5.09 KB (0%)
import { useLoadableQuery } from "dist/react/index.js" (production)	3.73 KB (0%)
import { useReadQuery } from "dist/react/index.js"	3.41 KB (0%)
import { useReadQuery } from "dist/react/index.js" (production)	3.35 KB (0%)
import { useFragment } from "dist/react/index.js"	2.28 KB (0%)
import { useFragment } from "dist/react/index.js" (production)	2.23 KB (0%)

phryneas · 2024-12-03T10:51:43Z

src/react/hooks/__tests__/useQuery.test.tsx

        () =>
          useQuery(query, {
            onCompleted,
            notifyOnNetworkStatusChange: true,
-            pollInterval: 110,
+            pollInterval: 200,


Interweaving things that are not part of the renderStream (expect(onCompleted).toHaveBeenCalledTimes(1)) with the timing of the renderStream can make up for a flaky test.
In the long run, this should probably be refactored and the call count should become part of the snapshot.
In the meantime, I'm raising the interval here to prevent this test from being flaky.

jerelmiller · 2024-12-04T00:31:55Z

config/jest.config.js

@@ -85,7 +85,6 @@ const standardReact17Config = {
    "^react-dom$": "react-dom-17",
    "^react-dom/server$": "react-dom-17/server",
    "^react-dom/test-utils$": "react-dom-17/test-utils",
-    "^@testing-library/react$": "@testing-library/react-12",


jerelmiller

Thanks for updating all those!

src/testing/internal/scenarios/index.ts

jerelmiller · 2024-12-04T00:44:30Z

src/testing/internal/scenarios/index.ts

@@ -63,6 +63,13 @@ export function setupVariablesCase() {
  return { mocks, query };
 }

+export function slowDownMocks<T extends MockedResponse<unknown>[]>(


Suggested change

export function slowDownMocks<T extends MockedResponse<unknown>[]>(

export function addDelayToMocks<T extends MockedResponse<unknown>[]>(

It took me a bit to realize what this helper did since "slow down" is not generally something you want in your tests if you can help it. Could you name this addDelayToMocks instead so that it makes it a bit more obvious its intent?

Good call :)

src/testing/internal/rtl/actAsync.ts

src/testing/internal/rtl/renderAsync.ts

jerelmiller · 2024-12-04T01:09:15Z

src/react/hooks/__tests__/useSuspenseQuery.test.tsx

  useTrackRenders,
 } from "@testing-library/react-render-stream";

+const IS_REACT_19 = React.version.startsWith("19");
+
+afterEach(() => wait(10));


any chance you could add a comment here to explain why this is needed?

That comment would be // ooops ^^ I think that's not necessary.

Co-authored-by: Jerel Miller <[email protected]>

bump react to 19 rc.1

110e5e3

phryneas added 25 commits November 25, 2024 13:15

patch REACT_FALLBACK_THROTTLE_MS

3226c83

swap sync usages of render to their async counterparts

db33a3b

bump dep

2a7df4f

adjust delay and REACT_FALLBACK_THROTTLE_MS

1f6af4f

fix up a bunch of tests

7da06c2

fixup

102d382

disable patch until all tests work

dbb4f7b

add delay to all mocks I could find

3c83984

more rendercounts

b84508b

down to one failing useSuspenseQuery test...

d04889f

useSuspenseQuery not failing anymore

cccfae9

add this to a lot more test files

ca0a751

useBackgroundQuery

203aaaa

useQuery

670eafe

fix up async calls

3f1a659

disable act environment for all render stream tests

bcf52df

remove & forbid wrong act calls

852e33e

simplify lint rules

651a3d2

undo for a second

0ae48ce

slow down a few select tests

1d0c877

work around one weird test

f02f1a2

format

4e8253c

use modern version of testing library for React 17

b1af798

remove patch

c7b13af

fix most React 17 tests

8a4738a

phryneas added 11 commits December 2, 2024 15:10

missing actAsync

763d65b

some more type updates

5aa78f1

some more act calls

92a8250

don't patch React

c9d918a

actAsync for React 17

5cf5930

actAsync -> act

eb9b49f

update dep

e29c31d

fix React 17 specific act quirk

09240a7

remove renderToRenderStream

28b705e

enable @typescript-eslint/no-floating-promises lint rule

35e3f7f

some more await/void

c58a07d

phryneas commented Dec 3, 2024

View reviewed changes

phryneas requested a review from jerelmiller December 3, 2024 14:41

phryneas changed the title ~~bump react to 19 rc.1~~ Run tests with React 19 RC.1 and adjust tests accordingly Dec 3, 2024

phryneas marked this pull request as ready for review December 3, 2024 14:41

jerelmiller reviewed Dec 4, 2024

View reviewed changes

jerelmiller approved these changes Dec 4, 2024

View reviewed changes

github-actions bot added the auto-cleanup 🤖 label Dec 4, 2024

phryneas and others added 9 commits December 4, 2024 10:50

update rrstl dependency

56b1bb9

remove unneccessary await - oops

4087349

PR feedback

a81e42e

Update src/testing/internal/scenarios/index.ts

1e5fdea

Co-authored-by: Jerel Miller <[email protected]>

Update src/testing/internal/rtl/actAsync.ts

6d308a7

Co-authored-by: Jerel Miller <[email protected]>

Update src/testing/internal/rtl/renderAsync.ts

a3d4455

Co-authored-by: Jerel Miller <[email protected]>

fix typo

0247ac7

Merge branch 'main' into pr/react-19-rc.1

143609b

make overriding intentional via an argument

1507630

phryneas merged commit a923b06 into main Dec 4, 2024
45 checks passed

phryneas deleted the pr/react-19-rc.1 branch December 4, 2024 10:18

jerelmiller mentioned this pull request Dec 4, 2024

Update data masking tests in React hooks to account for changes in render stream library #12166

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Run tests with React 19 RC.1 and adjust tests accordingly #12140

Run tests with React 19 RC.1 and adjust tests accordingly #12140

phryneas commented Nov 18, 2024 •

edited

Loading

svc-apollo-docs commented Nov 18, 2024 •

edited

Loading

changeset-bot bot commented Nov 18, 2024 •

edited

Loading

pkg-pr-new bot commented Nov 18, 2024 •

edited

Loading

github-actions bot commented Nov 18, 2024 •

edited

Loading

phryneas Dec 3, 2024

jerelmiller Dec 4, 2024

jerelmiller left a comment

jerelmiller Dec 4, 2024

phryneas Dec 4, 2024

jerelmiller Dec 4, 2024

phryneas Dec 4, 2024

	export function slowDownMocks<T extends MockedResponse<unknown>[]>(
	export function addDelayToMocks<T extends MockedResponse<unknown>[]>(

Run tests with React 19 RC.1 and adjust tests accordingly #12140

Run tests with React 19 RC.1 and adjust tests accordingly #12140

Conversation

phryneas commented Nov 18, 2024 • edited Loading

svc-apollo-docs commented Nov 18, 2024 • edited Loading

✅ Docs Preview Ready

changeset-bot bot commented Nov 18, 2024 • edited Loading

⚠️ No Changeset found

pkg-pr-new bot commented Nov 18, 2024 • edited Loading

github-actions bot commented Nov 18, 2024 • edited Loading

size-limit report 📦

phryneas Dec 3, 2024

Choose a reason for hiding this comment

jerelmiller Dec 4, 2024

Choose a reason for hiding this comment

jerelmiller left a comment

Choose a reason for hiding this comment

jerelmiller Dec 4, 2024

Choose a reason for hiding this comment

phryneas Dec 4, 2024

Choose a reason for hiding this comment

jerelmiller Dec 4, 2024

Choose a reason for hiding this comment

phryneas Dec 4, 2024

Choose a reason for hiding this comment

phryneas commented Nov 18, 2024 •

edited

Loading

svc-apollo-docs commented Nov 18, 2024 •

edited

Loading

changeset-bot bot commented Nov 18, 2024 •

edited

Loading

pkg-pr-new bot commented Nov 18, 2024 •

edited

Loading

github-actions bot commented Nov 18, 2024 •

edited

Loading