Update to Jest 29 #26088

ymqy · 2023-02-01T06:24:46Z

Summary

yarn.lock diff +-6249, small pr
use jest-environment-jsdom by default
uncaught error from jsdom is an error object instead of strings
abortSignal.reason is read-only in jsdom and node, https://developer.mozilla.org/en-US/docs/Web/API/AbortSignal/reason

How did you test this change?

ci green

react-sizebot · 2023-02-01T06:32:16Z

Comparing: 28fcae0...3f8db9b

Critical size changes

Includes critical production bundles, as well as any change greater than 2%:

Name	+/-	Base	Current	+/- gzip	Base gzip	Current gzip
oss-stable/react-dom/cjs/react-dom.production.min.js	=	154.83 kB	154.83 kB	=	49.12 kB	49.12 kB
oss-experimental/react-dom/cjs/react-dom.production.min.js	=	156.83 kB	156.83 kB	=	49.73 kB	49.73 kB
facebook-www/ReactDOM-prod.classic.js	=	533.54 kB	533.54 kB	=	94.99 kB	94.99 kB
facebook-www/ReactDOM-prod.modern.js	=	518.81 kB	518.81 kB	=	92.84 kB	92.84 kB

Significant size changes

Includes any change greater than 0.2%:

(No significant changes)

Generated by 🚫 dangerJS against 3f8db9b

ymqy · 2023-02-01T10:30:45Z

packages/react-dom/src/__tests__/ReactDOMEventPropagation-test.js

    jest.isolateModules(() => {
+      React = require('react');


Reference #21575 (comment)

ymqy · 2023-02-01T10:38:54Z

packages/scheduler/src/__tests__/SchedulerSetTimeout-test.js

@@ -23,6 +23,7 @@ describe('SchedulerNoDOM', () => {
    jest.resetModules();
    jest.useFakeTimers();
    delete global.setImmediate;
+    delete global.MessageChannel;


Jest v28 add MessageChannel to globals. jestjs/jest#12553

ymqy · 2023-02-02T04:18:35Z

packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js

@@ -5,6 +5,7 @@
 * LICENSE file in the root directory of this source tree.
 *
 * @emails react-core
+ * @jest-environment ./scripts/jest/ReactDOMServerIntegrationEnvironment


In Jest v26, the module path 'react-dom/server' would map to the file path 'packages/react-dom/server.js'.

However, in Jest v29, this mapping rule has changed and it will first look at the exports field of the package.json file, and then decide which file to load based on the testing environment. In jest-environment-jsdom, 'packages/react-dom/server.browser.js' will be loaded, and in jest-environment-node, 'packages/react-dom/server.node.js' will be loaded.

This will cause tests that use node environment methods (such as renderToPipeableStream) to fail. Is it possible to use the module path 'react-dom/server.node'? I see that the problem can also be solved by customizing the testing environment (#21575), adding some jsdom environment variables in the node testing environment.

packages/react-dom/src/__tests__/ReactDOMFizzStaticNode-test.js

ymqy · 2023-02-02T04:30:08Z

packages/react-dom/src/__tests__/ReactDOMFizzServerBrowser-test.js

-    // @TODO this is a hack to work around lack of support for abortSignal.reason in node
-    // The abort call itself should set this property but since we are testing in node we
-    // set it here manually
-    controller.signal.reason = theReason;


abortSignal.reason is read-only in jsdom and node, https://developer.mozilla.org/en-US/docs/Web/API/AbortSignal/reason

ymqy · 2023-02-02T04:33:36Z

packages/react-dom/src/__tests__/ReactDOMServerIntegrationAttributes-test.js

@@ -19,7 +20,7 @@ let ReactDOMServer;

 function initModules() {
  // Reset warning cache.
-  jest.resetModuleRegistry();


"jest.resetModuleRegistry" has been removed in Jest v27 and should be replaced with "jest.resetModules".

ymqy · 2023-02-02T04:36:26Z

packages/react-dom/src/__tests__/ReactDOMServerPartialHydration-test.internal.js

@@ -3119,7 +3120,7 @@ describe('ReactDOMServerPartialHydration', () => {
    // We're now partially hydrated.
    await act(async () => {
      form.dispatchEvent(
-        new Event('submit', {
+        new window.Event('submit', {


Use the Event from jsdom instead of the one from node.

ymqy · 2023-02-02T04:44:43Z

packages/react-reconciler/src/__tests__/ReactSuspenseWithNoopRenderer-test.js

@@ -2428,17 +2440,21 @@ describe('ReactSuspenseWithNoopRenderer', () => {
      'Loading B...',
    ]);
    // Still suspended.
-    expect(ReactNoop.getChildren()).toEqual([span('A')]);


The following diff are sources of the OOM problem.

Interestingly, using 'yarn test' does not cause an OOM problem, but using the following commands does: 'yarn test -r=experimental --env=development --persistent --ci', 'yarn test -r=experimental --env=production --ci', 'yarn test --build -r=experimental --env=development --ci', 'yarn test --build -r=experimental --env=production --ci'.

It is speculated that this may be because the OOM problem is avoided due to mocking of certain modules in the 'scripts/jest/setupTests.www.js' file that is referenced in 'yarn test'.

Why are we only using removeNonEnumerableProperties on some assertions? We have >100 assertions on ReactNoop.getChildren() but only a couple of are now wrapped in removeNonEnumerableProperties.

Thanks for pointing out the issue with the assertions.

I did some further investigation and found that the OOM problem was caused by the tests with the titles "keeps showing an avoided parent fallback if it is already showing" and "do not show placeholder when mounting an avoided boundary with startTransition".

I located the specific lines of code that were causing the problem and initially wrapped them with removeNonEnumerableProperties, but upon further review, I realized that this may not be the best solution.

I think it would be better to further investigate and find the root cause of the problem.

Did you get OOM locally or in CI?

You can remove the removeNonEnumerableProperties function wrapper and reproduce it in your local jestbump branch code with the following ci test command

yarn test -r=experimental --env=development --persistent yarn test -r=experimental --env=development --persistent --ci yarn test -r=experimental --env=production --ci yarn test --build -r=experimental --env=development --ci yarn test --build -r=experimental --env=production --ci

Interestingly, the OOM does not occur with the following test command

yarn test

These links below are about OOM

https://app.circleci.com/pipelines/github/facebook/react/37815/workflows/af2d09e1-48d7-4e29-a33a-f4106c5783cc/jobs/621083

https://app.circleci.com/pipelines/github/facebook/react/37815/workflows/af2d09e1-48d7-4e29-a33a-f4106c5783cc/jobs/621073

https://app.circleci.com/pipelines/github/facebook/react/37815/workflows/af2d09e1-48d7-4e29-a33a-f4106c5783cc/jobs/621072

https://app.circleci.com/pipelines/github/facebook/react/37815/workflows/af2d09e1-48d7-4e29-a33a-f4106c5783cc/jobs/621071

https://app.circleci.com/pipelines/github/facebook/react/37815/workflows/af2d09e1-48d7-4e29-a33a-f4106c5783cc/jobs/621053

@SimenB

$ git clone https://github.com/eps1lon/react.git $ git checkout jestbump-perf-repro $ yarn $ yarn test -r=experimental --env=development --persistent --ci packages/react-reconciler/src/__tests__/ReactSuspenseWithNoopRenderer-test.js --verbose

I'm also getting a lot of deprecation warnings from testcheck which is used by Jasmine. So maybe it's actually a Jasmine issue?

We probably have this problem on main (i.e. Jest 26) already: https://app.circleci.com/pipelines/github/facebook/react/38061/workflows/a2043dd0-df62-49d5-a10e-9b534c33cbdb/jobs/623788/parallel-runs/5?filterBy=ALL

Going to convert expect(ReactNoop.getChildren()).toEqual to expect(ReactNoop).toMatchRenderedOutput in a separate PR. This will hopefully fix issues on main and unblock this PR.

Settled on using toMatchRenderedOutput instead.

Is there a smaller reproduction than react?

I don't have one and I expect it to be quite hard to reproduce. From what I could tell, the doubly linked-list structure of Fiber caused the severe slowdown in expect(somethingHavingFibers).toEqual().

ymqy · 2023-02-03T14:09:30Z

@gaearon This PR is important because Jest v29 has been released and the new version contains a lot of new features and bug fix which is important for our project. It's ready for review and merge.

eps1lon

Can we do fixtures/ in a follow-up? These are not automatically tested and rarely used so I'd rather do some manual testing so we don't accidentally break them.

And that we can use the automated tests in packages/ as a canary.

packages/react-dom/src/__tests__/ReactDOMFizzShellHydration-test.js

packages/react-dom/src/__tests__/ReactDOMFizzStatic-test.js

packages/react-dom/src/__tests__/ReactDOMFizzSuppressHydrationWarning-test.js

packages/react-dom/src/__tests__/ReactDOMFloat-test.js

packages/react-dom/src/__tests__/ReactDOMUseId-test.js

packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js

Keeps git-blame clean

eps1lon

Works like a charm. Much appreciated, thanks!

SimenB · 2023-02-09T16:25:53Z

🎉

kassens · 2023-02-09T18:30:54Z

@ymqy thanks for the huge update and debugging the issues!

gaearon · 2023-02-13T16:54:58Z

amazing work. thank you.

Summary: This sync includes the following changes: - **[86c8c8db7](facebook/react@86c8c8db7 )**: test: Don't retry flushActWork if flushUntilNextPaint threw ([#26121](facebook/react#26121)) //<Sebastian Silbermann>// - **[64acd3918](facebook/react@64acd3918 )**: remove unguarded getRootNode call ([#26152](facebook/react#26152)) //<Josh Story>// - **[71cace4d3](facebook/react@71cace4d3 )**: Migrate testRunner from jasmine2 to jest-circus ([#26144](facebook/react#26144)) //<Ming Ye>// - **[c8510227c](facebook/react@c8510227c )**: Treat displayName as undefined ([#26148](facebook/react#26148)) //<Sebastian Markbåge>// - **[55542bc73](facebook/react@55542bc73 )**: Update jest printBasicPrototype config ([#26142](facebook/react#26142)) //<Ming Ye>// - **[6396b6641](facebook/react@6396b6641 )**: Model Float on Hoistables semantics ([#26106](facebook/react#26106)) //<Josh Story>// - **[ef9f6e77b](facebook/react@ef9f6e77b )**: Enable passing Server References from Server to Client ([#26124](facebook/react#26124)) //<Sebastian Markbåge>// - **[35698311d](facebook/react@35698311d )**: Update jest escapeString config ([#26140](facebook/react#26140)) //<Ming Ye>// - **[6ddcbd4f9](facebook/react@6ddcbd4f9 )**: [flow] enable LTI inference mode ([#26104](facebook/react#26104)) //<Jan Kassens>// - **[53b1f69ba](facebook/react@53b1f69ba )**: Implement unstable_getBoundingClientRect in RN Fabric refs ([#26137](facebook/react#26137)) //<Rubén Norte>// - **[594093496](facebook/react@594093496 )**: Update to Jest 29 ([#26088](facebook/react#26088)) //<Ming Ye>// - **[28fcae062](facebook/react@28fcae062 )**: Add support for SVG `transformOrigin` prop ([#26130](facebook/react#26130)) //<Aravind D>// - **[3ff1540e9](facebook/react@3ff1540e9 )**: Prefer JSX in ReactNoop assertions (to combat out-of-memory test runs) ([#26127](facebook/react#26127)) //<Sebastian Silbermann>// - **[01a0c4e12](facebook/react@01a0c4e12 )**: Add Edge Server Builds for workerd / edge-light ([#26116](facebook/react#26116)) //<Sebastian Markbåge>// - **[f0cf832e1](facebook/react@f0cf832e1 )**: Update Flight Fixture to "use client" instead of .client.js ([#26118](facebook/react#26118)) //<Sebastian Markbåge>// - **[03a216070](facebook/react@03a216070 )**: Rename "dom" fork to "dom-node" and "bun" fork to "dom-bun" ([#26117](facebook/react#26117)) //<Sebastian Markbåge>// - **[4bf2113a1](facebook/react@4bf2113a1 )**: Revert "Move the Webpack manifest config to one level deeper ([#26083](facebook/react#26083))" ([#26111](facebook/react#26111)) //<Sebastian Markbåge>// - **[2ef24145e](facebook/react@2ef24145e )**: [flow] upgrade to 0.199.0 ([#26096](facebook/react#26096)) //<Jan Kassens>// - **[922dd7ba5](facebook/react@922dd7ba5 )**: Revert the outer module object to an object ([#26093](facebook/react#26093)) //<Sebastian Markbåge>// - **[9d111ffdf](facebook/react@9d111ffdf )**: Serialize Promises through Flight ([#26086](facebook/react#26086)) //<Sebastian Markbåge>// - **[0ba4698c7](facebook/react@0ba4698c7 )**: Fix async test in React reconciler ([#26087](facebook/react#26087)) //<Ming Ye>// - **[8c234c0de](facebook/react@8c234c0de )**: Move the Webpack manifest config to one level deeper ([#26083](facebook/react#26083)) //<Sebastian Markbåge>// - **[977bccd24](facebook/react@977bccd24 )**: Refactor Flight Encoding ([#26082](facebook/react#26082)) //<Sebastian Markbåge>// - **[d7bb524ad](facebook/react@d7bb524ad )**: [cleanup] Remove unused package jest-mock-scheduler ([#26084](facebook/react#26084)) //<Ming Ye>// - **[6b3083266](facebook/react@6b3083266 )**: Upgrade prettier ([#26081](facebook/react#26081)) //<Jan Kassens>// - **[1f5ce59dd](facebook/react@1f5ce59dd )**: [cleanup] fully roll out warnAboutSpreadingKeyToJSX ([#26080](facebook/react#26080)) //<Jan Kassens>// Changelog: [General][Changed] - React Native sync for revisions 48b687f...fccf3a9 jest_e2e[run_all_tests] Reviewed By: rubennorte Differential Revision: D43305607 fbshipit-source-id: 8da7567ca2a182f4be27788935c2da30a731f83b

Summary: This sync includes the following changes: - **[86c8c8db7](facebook/react@86c8c8db7 )**: test: Don't retry flushActWork if flushUntilNextPaint threw ([facebook#26121](facebook/react#26121)) //<Sebastian Silbermann>// - **[64acd3918](facebook/react@64acd3918 )**: remove unguarded getRootNode call ([facebook#26152](facebook/react#26152)) //<Josh Story>// - **[71cace4d3](facebook/react@71cace4d3 )**: Migrate testRunner from jasmine2 to jest-circus ([facebook#26144](facebook/react#26144)) //<Ming Ye>// - **[c8510227c](facebook/react@c8510227c )**: Treat displayName as undefined ([facebook#26148](facebook/react#26148)) //<Sebastian Markbåge>// - **[55542bc73](facebook/react@55542bc73 )**: Update jest printBasicPrototype config ([facebook#26142](facebook/react#26142)) //<Ming Ye>// - **[6396b6641](facebook/react@6396b6641 )**: Model Float on Hoistables semantics ([facebook#26106](facebook/react#26106)) //<Josh Story>// - **[ef9f6e77b](facebook/react@ef9f6e77b )**: Enable passing Server References from Server to Client ([facebook#26124](facebook/react#26124)) //<Sebastian Markbåge>// - **[35698311d](facebook/react@35698311d )**: Update jest escapeString config ([facebook#26140](facebook/react#26140)) //<Ming Ye>// - **[6ddcbd4f9](facebook/react@6ddcbd4f9 )**: [flow] enable LTI inference mode ([facebook#26104](facebook/react#26104)) //<Jan Kassens>// - **[53b1f69ba](facebook/react@53b1f69ba )**: Implement unstable_getBoundingClientRect in RN Fabric refs ([facebook#26137](facebook/react#26137)) //<Rubén Norte>// - **[594093496](facebook/react@594093496 )**: Update to Jest 29 ([facebook#26088](facebook/react#26088)) //<Ming Ye>// - **[28fcae062](facebook/react@28fcae062 )**: Add support for SVG `transformOrigin` prop ([facebook#26130](facebook/react#26130)) //<Aravind D>// - **[3ff1540e9](facebook/react@3ff1540e9 )**: Prefer JSX in ReactNoop assertions (to combat out-of-memory test runs) ([facebook#26127](facebook/react#26127)) //<Sebastian Silbermann>// - **[01a0c4e12](facebook/react@01a0c4e12 )**: Add Edge Server Builds for workerd / edge-light ([facebook#26116](facebook/react#26116)) //<Sebastian Markbåge>// - **[f0cf832e1](facebook/react@f0cf832e1 )**: Update Flight Fixture to "use client" instead of .client.js ([facebook#26118](facebook/react#26118)) //<Sebastian Markbåge>// - **[03a216070](facebook/react@03a216070 )**: Rename "dom" fork to "dom-node" and "bun" fork to "dom-bun" ([facebook#26117](facebook/react#26117)) //<Sebastian Markbåge>// - **[4bf2113a1](facebook/react@4bf2113a1 )**: Revert "Move the Webpack manifest config to one level deeper ([facebook#26083](facebook/react#26083))" ([facebook#26111](facebook/react#26111)) //<Sebastian Markbåge>// - **[2ef24145e](facebook/react@2ef24145e )**: [flow] upgrade to 0.199.0 ([facebook#26096](facebook/react#26096)) //<Jan Kassens>// - **[922dd7ba5](facebook/react@922dd7ba5 )**: Revert the outer module object to an object ([facebook#26093](facebook/react#26093)) //<Sebastian Markbåge>// - **[9d111ffdf](facebook/react@9d111ffdf )**: Serialize Promises through Flight ([facebook#26086](facebook/react#26086)) //<Sebastian Markbåge>// - **[0ba4698c7](facebook/react@0ba4698c7 )**: Fix async test in React reconciler ([facebook#26087](facebook/react#26087)) //<Ming Ye>// - **[8c234c0de](facebook/react@8c234c0de )**: Move the Webpack manifest config to one level deeper ([facebook#26083](facebook/react#26083)) //<Sebastian Markbåge>// - **[977bccd24](facebook/react@977bccd24 )**: Refactor Flight Encoding ([facebook#26082](facebook/react#26082)) //<Sebastian Markbåge>// - **[d7bb524ad](facebook/react@d7bb524ad )**: [cleanup] Remove unused package jest-mock-scheduler ([facebook#26084](facebook/react#26084)) //<Ming Ye>// - **[6b3083266](facebook/react@6b3083266 )**: Upgrade prettier ([facebook#26081](facebook/react#26081)) //<Jan Kassens>// - **[1f5ce59dd](facebook/react@1f5ce59dd )**: [cleanup] fully roll out warnAboutSpreadingKeyToJSX ([facebook#26080](facebook/react#26080)) //<Jan Kassens>// Changelog: [General][Changed] - React Native sync for revisions 48b687f...fccf3a9 jest_e2e[run_all_tests] Reviewed By: rubennorte Differential Revision: D43305607 fbshipit-source-id: 8da7567ca2a182f4be27788935c2da30a731f83b

ymqy added 5 commits February 1, 2023 13:45

Update jest

b934d72

use react-dom/server (node)

bf6d55c

AbortController ponyfill

80b989f

expect error object

3124a14

jasmine-check dependency

89273dc

facebook-github-bot added the CLA Signed label Feb 1, 2023

ymqy mentioned this pull request Feb 1, 2023

Upgrading Jest to v29 and optimizing default configuration #26041

Closed

fix oom

6109c51

ymqy mentioned this pull request Feb 1, 2023

Update rollup to v3 #26078

Closed

ymqy changed the title ~~Upgrading Jest to v29~~ Update to Jest 29 Feb 1, 2023

ymqy added 2 commits February 1, 2023 17:54

update jest & jest-diff

cdf7083

Merge branch 'main' into jestbump

95af9ca

ymqy commented Feb 1, 2023

View reviewed changes

ymqy commented Feb 2, 2023

View reviewed changes

packages/react-dom/src/__tests__/ReactDOMFizzStaticNode-test.js Outdated Show resolved Hide resolved

ymqy commented Feb 2, 2023

View reviewed changes

sebmarkbage approved these changes Feb 6, 2023

View reviewed changes

eps1lon reviewed Feb 7, 2023

View reviewed changes

packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js Outdated Show resolved Hide resolved

eps1lon and others added 4 commits February 7, 2023 10:02

Revert stylistic changes

2186c7d

Keeps git-blame clean

Add abortcontroller-polyfill in setupEnvironment

52d5f01

Merge branch 'main' into jestbump

9a949a8

Merge branch 'main' into jestbump

3f8db9b

eps1lon approved these changes Feb 9, 2023

View reviewed changes

eps1lon merged commit 5940934 into facebook:main Feb 9, 2023

eps1lon mentioned this pull request Feb 9, 2023

Upgrade jest to v29 #21575

Closed

1 task

ymqy deleted the jestbump branch February 9, 2023 21:32

kassens mentioned this pull request Feb 10, 2023

Minor Jest upgrade kassens/react#3

Closed

sammy-SC mentioned this pull request Apr 5, 2023

Use native scheduler if defined sammy-SC/react#1

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Update to Jest 29 #26088

Update to Jest 29 #26088

ymqy commented Feb 1, 2023 •

edited

react-sizebot commented Feb 1, 2023 •

edited

ymqy Feb 1, 2023 •

edited

ymqy Feb 1, 2023 •

edited

ymqy Feb 2, 2023 •

edited

ymqy Feb 2, 2023

ymqy Feb 2, 2023

ymqy Feb 2, 2023 •

edited

ymqy Feb 2, 2023 •

edited

eps1lon Feb 7, 2023

ymqy Feb 7, 2023

eps1lon Feb 7, 2023

ymqy Feb 7, 2023 •

edited

eps1lon Feb 7, 2023

eps1lon Feb 7, 2023

eps1lon Feb 9, 2023

SimenB Feb 9, 2023

eps1lon Feb 9, 2023

ymqy commented Feb 3, 2023

eps1lon left a comment

eps1lon left a comment

SimenB commented Feb 9, 2023

kassens commented Feb 9, 2023

gaearon commented Feb 13, 2023

Update to Jest 29 #26088

Update to Jest 29 #26088

Conversation

ymqy commented Feb 1, 2023 • edited

Summary

How did you test this change?

react-sizebot commented Feb 1, 2023 • edited

Critical size changes

Significant size changes

ymqy Feb 1, 2023 • edited

Choose a reason for hiding this comment

ymqy Feb 1, 2023 • edited

Choose a reason for hiding this comment

ymqy Feb 2, 2023 • edited

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ymqy Feb 2, 2023 • edited

Choose a reason for hiding this comment

ymqy Feb 2, 2023 • edited

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ymqy Feb 7, 2023 • edited

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ymqy commented Feb 3, 2023

eps1lon left a comment

Choose a reason for hiding this comment

eps1lon left a comment

Choose a reason for hiding this comment

SimenB commented Feb 9, 2023

kassens commented Feb 9, 2023

gaearon commented Feb 13, 2023

ymqy commented Feb 1, 2023 •

edited

react-sizebot commented Feb 1, 2023 •

edited

ymqy Feb 1, 2023 •

edited

ymqy Feb 1, 2023 •

edited

ymqy Feb 2, 2023 •

edited

ymqy Feb 2, 2023 •

edited

ymqy Feb 2, 2023 •

edited

ymqy Feb 7, 2023 •

edited