Skip to content

Commit a3e4ff9

Browse files
committed
Fix asserts caused by OffscreenComponent rendering in React Native with passChildrenWhenCloningPersistedNodes (#32528)
<!-- Thanks for submitting a pull request! We appreciate you spending the time to work on these changes. Please provide enough information so that others can review your pull request. The three fields below are mandatory. Before submitting a pull request, please make sure the following is done: 1. Fork [the repository](https://github.com/facebook/react) and create your branch from `main`. 2. Run `yarn` in the repository root. 3. If you've fixed a bug or added code that should be tested, add tests! 4. Ensure the test suite passes (`yarn test`). Tip: `yarn test --watch TestName` is helpful in development. 5. Run `yarn test --prod` to test in the production environment. It supports the same options as `yarn test`. 6. If you need a debugger, run `yarn test --debug --watch TestName`, open `chrome://inspect`, and press "Inspect". 7. Format your code with [prettier](https://github.com/prettier/prettier) (`yarn prettier`). 8. Make sure your code lints (`yarn lint`). Tip: `yarn linc` to only check changed files. 9. Run the [Flow](https://flowtype.org/) type checks (`yarn flow`). 10. If you haven't already, complete the CLA. Learn more about contributing: https://reactjs.org/docs/how-to-contribute.html --> ## Summary <!-- Explain the **motivation** for making this change. What existing problem does the pull request solve? --> This PR fixes asserts when `passChildrenWhenCloningPersistedNodes` is enabled for React Native and OffscreenComponent child rendering unhides host components. Discussions around possible fixes for the asserts seen in React Native suggested changing the way we handle hiding/unhiding host components by updating the fiber state with the hidden host component instead of submitting a hidden clone Fabric and keeping the original as the current fiber. Implementing this fix would require holding onto the original styling of the hidden host component. The reconciler updates the styling by adding `display: none` to hide the contents. If the original host component was already hidden, the renderer would lose that information and remove the styling when showing the contents again. To reduce the changes required to make `passChildrenWhenCloningPersistedNodes` work, this PR falls back to the original cloning method when OffscreenComponents are part of the children needed to be added back. This effectively resolve the asserts triggered by the feature in RN and improves overall performance. ## How did you test this change? <!-- Demonstrate the code is solid. Example: The exact commands you ran and their output, screenshots / videos if the pull request changes the user interface. How exactly did you verify that your PR solves the issue you wanted to solve? If you leave this empty, your PR will very likely be closed. --> This fix was tested by enabling `passChildrenWhenCloningPersistedNodes` in an app built with React Native that had a repro for triggering the asserts. The asserts do not occur anymore when using the changes in this PR. --------- Co-authored-by: Nick <[email protected]> DiffTrain build for [cc68006](cc68006)
1 parent e4426d0 commit a3e4ff9

34 files changed

+122
-102
lines changed

compiled/facebook-www/REVISION

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
f9d78089c6ec8dce3a11cdf135d6d27b7a8dc1c5
1+
cc680065c33739cc4c8cd2e8a67312b0c16a6ccc
Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
f9d78089c6ec8dce3a11cdf135d6d27b7a8dc1c5
1+
cc680065c33739cc4c8cd2e8a67312b0c16a6ccc

compiled/facebook-www/React-dev.classic.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1532,7 +1532,7 @@ __DEV__ &&
15321532
exports.useTransition = function () {
15331533
return resolveDispatcher().useTransition();
15341534
};
1535-
exports.version = "19.1.0-www-classic-f9d78089-20250306";
1535+
exports.version = "19.1.0-www-classic-cc680065-20250307";
15361536
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
15371537
"function" ===
15381538
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

compiled/facebook-www/React-dev.modern.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1532,7 +1532,7 @@ __DEV__ &&
15321532
exports.useTransition = function () {
15331533
return resolveDispatcher().useTransition();
15341534
};
1535-
exports.version = "19.1.0-www-modern-f9d78089-20250306";
1535+
exports.version = "19.1.0-www-modern-cc680065-20250307";
15361536
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
15371537
"function" ===
15381538
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

compiled/facebook-www/React-prod.classic.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -641,4 +641,4 @@ exports.useSyncExternalStore = function (
641641
exports.useTransition = function () {
642642
return ReactSharedInternals.H.useTransition();
643643
};
644-
exports.version = "19.1.0-www-classic-f9d78089-20250306";
644+
exports.version = "19.1.0-www-classic-cc680065-20250307";

compiled/facebook-www/React-prod.modern.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -641,4 +641,4 @@ exports.useSyncExternalStore = function (
641641
exports.useTransition = function () {
642642
return ReactSharedInternals.H.useTransition();
643643
};
644-
exports.version = "19.1.0-www-modern-f9d78089-20250306";
644+
exports.version = "19.1.0-www-modern-cc680065-20250307";

compiled/facebook-www/React-profiling.classic.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -645,7 +645,7 @@ exports.useSyncExternalStore = function (
645645
exports.useTransition = function () {
646646
return ReactSharedInternals.H.useTransition();
647647
};
648-
exports.version = "19.1.0-www-classic-f9d78089-20250306";
648+
exports.version = "19.1.0-www-classic-cc680065-20250307";
649649
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
650650
"function" ===
651651
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

compiled/facebook-www/React-profiling.modern.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -645,7 +645,7 @@ exports.useSyncExternalStore = function (
645645
exports.useTransition = function () {
646646
return ReactSharedInternals.H.useTransition();
647647
};
648-
exports.version = "19.1.0-www-modern-f9d78089-20250306";
648+
exports.version = "19.1.0-www-modern-cc680065-20250307";
649649
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
650650
"function" ===
651651
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

compiled/facebook-www/ReactART-dev.classic.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -18486,10 +18486,10 @@ __DEV__ &&
1848618486
(function () {
1848718487
var internals = {
1848818488
bundleType: 1,
18489-
version: "19.1.0-www-classic-f9d78089-20250306",
18489+
version: "19.1.0-www-classic-cc680065-20250307",
1849018490
rendererPackageName: "react-art",
1849118491
currentDispatcherRef: ReactSharedInternals,
18492-
reconcilerVersion: "19.1.0-www-classic-f9d78089-20250306"
18492+
reconcilerVersion: "19.1.0-www-classic-cc680065-20250307"
1849318493
};
1849418494
internals.overrideHookState = overrideHookState;
1849518495
internals.overrideHookStateDeletePath = overrideHookStateDeletePath;
@@ -18523,7 +18523,7 @@ __DEV__ &&
1852318523
exports.Shape = Shape;
1852418524
exports.Surface = Surface;
1852518525
exports.Text = Text;
18526-
exports.version = "19.1.0-www-classic-f9d78089-20250306";
18526+
exports.version = "19.1.0-www-classic-cc680065-20250307";
1852718527
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
1852818528
"function" ===
1852918529
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

compiled/facebook-www/ReactART-dev.modern.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -18258,10 +18258,10 @@ __DEV__ &&
1825818258
(function () {
1825918259
var internals = {
1826018260
bundleType: 1,
18261-
version: "19.1.0-www-modern-f9d78089-20250306",
18261+
version: "19.1.0-www-modern-cc680065-20250307",
1826218262
rendererPackageName: "react-art",
1826318263
currentDispatcherRef: ReactSharedInternals,
18264-
reconcilerVersion: "19.1.0-www-modern-f9d78089-20250306"
18264+
reconcilerVersion: "19.1.0-www-modern-cc680065-20250307"
1826518265
};
1826618266
internals.overrideHookState = overrideHookState;
1826718267
internals.overrideHookStateDeletePath = overrideHookStateDeletePath;
@@ -18295,7 +18295,7 @@ __DEV__ &&
1829518295
exports.Shape = Shape;
1829618296
exports.Surface = Surface;
1829718297
exports.Text = Text;
18298-
exports.version = "19.1.0-www-modern-f9d78089-20250306";
18298+
exports.version = "19.1.0-www-modern-cc680065-20250307";
1829918299
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
1830018300
"function" ===
1830118301
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

0 commit comments

Comments
 (0)