Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Prefer JSX in ReactNoop assertions (to combat out-of-memory test runs) #26127

Merged
merged 1 commit into from
Feb 9, 2023

Conversation

eps1lon
Copy link
Collaborator

@eps1lon eps1lon commented Feb 8, 2023

Summary

Prefer getChildrenAsJSX or toMatchRenderedOutput over getChildren. Use dangerouslyGetChildren if you really need to (e.g. for toBe assertions).

Prefer getPendingChildrenAsJSX over getPendingChildren. Use dangerouslyGetPendingChildren if you really need to (e.g. for toBe assertions).

ReactNoop.getChildren contains the fibers as non-enumerable properties. If you pass the children to toEqual and have a mismatch, Jest performance is very poor (to the point of causing out-of-memory crashes e.g. https://app.circleci.com/pipelines/github/facebook/react/38084/workflows/02ca0cbb-bab4-4c19-8d7d-ada814eeebb9/jobs/624297/parallel-runs/5?filterBy=ALL&invite=true#step-106-27).
Mismatches can sometimes be intended e.g. on gated tests.

Instead, I converted almost all of the toEqual assertions to toMatchRenderedOutput assertions or compare the JSX instead. For ReactNoopPersistent we still use getChildren since we have assertions on referential equality. toMatchRenderedOutput is more accurate in some instances anyway. I highlighted some of those more accurate assertions in review-comments.

How did you test this change?

@facebook-github-bot facebook-github-bot added CLA Signed React Core Team Opened by a member of the React Core Team labels Feb 8, 2023
@@ -47,7 +32,7 @@ describe('ReactFragment', () => {
ReactNoop.render(element);
expect(Scheduler).toFlushWithoutYielding();

expect(ReactNoop.getChildren()).toEqual([span()]);
expect(ReactNoop).toMatchRenderedOutput(<span>foo</span>);
Copy link
Collaborator Author

@eps1lon eps1lon Feb 8, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Unclear why this assertion ever worked. New assertion is accurate

@react-sizebot
Copy link

react-sizebot commented Feb 8, 2023

Comparing: 758fc7f...5e27588

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.84 kB 154.84 kB = 49.12 kB 49.12 kB
oss-experimental/react-dom/cjs/react-dom.production.min.js = 156.85 kB 156.85 kB = 49.78 kB 49.78 kB
facebook-www/ReactDOM-prod.classic.js = 533.79 kB 533.79 kB = 95.06 kB 95.06 kB
facebook-www/ReactDOM-prod.modern.js = 518.81 kB 518.81 kB = 92.82 kB 92.82 kB
oss-experimental/react-noop-renderer/cjs/react-noop-renderer.production.min.js +5.64% 12.53 kB 13.24 kB +4.95% 3.74 kB 3.93 kB
oss-stable-semver/react-noop-renderer/cjs/react-noop-renderer.production.min.js +5.64% 12.53 kB 13.24 kB +4.95% 3.74 kB 3.93 kB
oss-stable/react-noop-renderer/cjs/react-noop-renderer.production.min.js +5.64% 12.53 kB 13.24 kB +4.95% 3.74 kB 3.93 kB
oss-experimental/react-noop-renderer/cjs/react-noop-renderer-persistent.production.min.js +5.61% 12.60 kB 13.31 kB +4.95% 3.76 kB 3.94 kB
oss-stable-semver/react-noop-renderer/cjs/react-noop-renderer-persistent.production.min.js +5.61% 12.60 kB 13.31 kB +4.95% 3.76 kB 3.94 kB
oss-stable/react-noop-renderer/cjs/react-noop-renderer-persistent.production.min.js +5.61% 12.60 kB 13.31 kB +4.95% 3.76 kB 3.94 kB
oss-experimental/react-noop-renderer/cjs/react-noop-renderer.development.js +4.64% 34.72 kB 36.33 kB +4.32% 7.83 kB 8.17 kB
oss-stable-semver/react-noop-renderer/cjs/react-noop-renderer.development.js +4.64% 34.72 kB 36.33 kB +4.32% 7.83 kB 8.17 kB
oss-stable/react-noop-renderer/cjs/react-noop-renderer.development.js +4.64% 34.72 kB 36.33 kB +4.32% 7.83 kB 8.17 kB
oss-experimental/react-noop-renderer/cjs/react-noop-renderer-persistent.development.js +4.62% 34.85 kB 36.46 kB +4.31% 7.85 kB 8.19 kB
oss-stable-semver/react-noop-renderer/cjs/react-noop-renderer-persistent.development.js +4.62% 34.85 kB 36.46 kB +4.31% 7.85 kB 8.19 kB
oss-stable/react-noop-renderer/cjs/react-noop-renderer-persistent.development.js +4.62% 34.85 kB 36.46 kB +4.31% 7.85 kB 8.19 kB

Significant size changes

Includes any change greater than 0.2%:

Expand to show
Name +/- Base Current +/- gzip Base gzip Current gzip
oss-experimental/react-noop-renderer/cjs/react-noop-renderer.production.min.js +5.64% 12.53 kB 13.24 kB +4.95% 3.74 kB 3.93 kB
oss-stable-semver/react-noop-renderer/cjs/react-noop-renderer.production.min.js +5.64% 12.53 kB 13.24 kB +4.95% 3.74 kB 3.93 kB
oss-stable/react-noop-renderer/cjs/react-noop-renderer.production.min.js +5.64% 12.53 kB 13.24 kB +4.95% 3.74 kB 3.93 kB
oss-experimental/react-noop-renderer/cjs/react-noop-renderer-persistent.production.min.js +5.61% 12.60 kB 13.31 kB +4.95% 3.76 kB 3.94 kB
oss-stable-semver/react-noop-renderer/cjs/react-noop-renderer-persistent.production.min.js +5.61% 12.60 kB 13.31 kB +4.95% 3.76 kB 3.94 kB
oss-stable/react-noop-renderer/cjs/react-noop-renderer-persistent.production.min.js +5.61% 12.60 kB 13.31 kB +4.95% 3.76 kB 3.94 kB
oss-experimental/react-noop-renderer/cjs/react-noop-renderer.development.js +4.64% 34.72 kB 36.33 kB +4.32% 7.83 kB 8.17 kB
oss-stable-semver/react-noop-renderer/cjs/react-noop-renderer.development.js +4.64% 34.72 kB 36.33 kB +4.32% 7.83 kB 8.17 kB
oss-stable/react-noop-renderer/cjs/react-noop-renderer.development.js +4.64% 34.72 kB 36.33 kB +4.32% 7.83 kB 8.17 kB
oss-experimental/react-noop-renderer/cjs/react-noop-renderer-persistent.development.js +4.62% 34.85 kB 36.46 kB +4.31% 7.85 kB 8.19 kB
oss-stable-semver/react-noop-renderer/cjs/react-noop-renderer-persistent.development.js +4.62% 34.85 kB 36.46 kB +4.31% 7.85 kB 8.19 kB
oss-stable/react-noop-renderer/cjs/react-noop-renderer-persistent.development.js +4.62% 34.85 kB 36.46 kB +4.31% 7.85 kB 8.19 kB

Generated by 🚫 dangerJS against 5e27588

@eps1lon eps1lon force-pushed the test/toMatchRenderedOutput branch from c7efc8b to 5e27588 Compare February 8, 2023 11:25
@eps1lon eps1lon marked this pull request as ready for review February 8, 2023 11:41
Copy link
Contributor

@sammy-SC sammy-SC left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is awesome!

@sammy-SC sammy-SC merged commit 3ff1540 into facebook:main Feb 9, 2023
github-actions bot pushed a commit that referenced this pull request Feb 9, 2023
#26127)

## Summary

Prefer `getChildrenAsJSX` or `toMatchRenderedOutput` over `getChildren`.
Use `dangerouslyGetChildren` if you really need to (e.g. for `toBe`
assertions).

Prefer `getPendingChildrenAsJSX` over `getPendingChildren`. Use
`dangerouslyGetPendingChildren` if you really need to (e.g. for `toBe`
assertions).

`ReactNoop.getChildren` contains the fibers as non-enumerable
properties. If you pass the children to `toEqual` and have a mismatch,
Jest performance is very poor (to the point of causing out-of-memory
crashes e.g.
https://app.circleci.com/pipelines/github/facebook/react/38084/workflows/02ca0cbb-bab4-4c19-8d7d-ada814eeebb9/jobs/624297/parallel-runs/5?filterBy=ALL&invite=true#step-106-27).
Mismatches can sometimes be intended e.g. on gated tests.

Instead, I converted almost all of the `toEqual` assertions to
`toMatchRenderedOutput` assertions or compare the JSX instead. For
ReactNoopPersistent we still use `getChildren` since we have assertions
on referential equality. `toMatchRenderedOutput` is more accurate in
some instances anyway. I highlighted some of those more accurate
assertions in review-comments.

## How did you test this change?

- [x] `CIRCLE_NODE_TOTAL=20 CIRCLE_NODE_INDEX=5 yarn test
-r=experimental --env=development --ci`: Can take up to 350s (and use up
to 7GB of memory) on `main` but 11s on this branch
- [x] No more slow `yarn test` parallel runs of `yarn_test` jobs (the
steps in these runs should take <1min but sometimes they take 3min and
end with OOM like
https://app.circleci.com/pipelines/github/facebook/react/38084/workflows/02ca0cbb-bab4-4c19-8d7d-ada814eeebb9/jobs/624258/parallel-runs/5?filterBy=ALL:
Looks good with a sample size of 1
https://app.circleci.com/pipelines/github/facebook/react/38110/workflows/745109a2-b86b-429f-8c01-9b23a245417a/jobs/624651

DiffTrain build for [3ff1540](3ff1540)
[View git log for this commit](https://github.com/facebook/react/commits/3ff1540e9bbe30aae52e2c9ab61c843bd0c94237)
@eps1lon eps1lon deleted the test/toMatchRenderedOutput branch February 9, 2023 12:07
facebook-github-bot pushed a commit to facebook/react-native that referenced this pull request Feb 15, 2023
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
OlimpiaZurek pushed a commit to OlimpiaZurek/react-native that referenced this pull request May 22, 2023
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
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed React Core Team Opened by a member of the React Core Team
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants