Skip to content

Commit f47b316

Browse files
committed
Throw a better error when Lazy/Promise is used in React.Children (#28280)
We could in theory actually support this case by throwing a Promise when it's used inside a render. Allowing it to be synchronously unwrapped. However, it's a bit sketchy because we officially only support this in the render's child position or in `use()`. Another alternative could be to actually pass the Promise/Lazy to the callback so that you can reason about it and just return it again or even unwrapping with `use()` - at least for the forEach case maybe. DiffTrain build for commit e41ee9e.
1 parent f655b67 commit f47b316

File tree

7 files changed

+63
-32
lines changed

7 files changed

+63
-32
lines changed

compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react-test-renderer/cjs/ReactTestRenderer-dev.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25670,7 +25670,7 @@ if (__DEV__) {
2567025670
return root;
2567125671
}
2567225672

25673-
var ReactVersion = "18.3.0-canary-cd63ef792-20240208";
25673+
var ReactVersion = "18.3.0-canary-e41ee9ea7-20240208";
2567425674

2567525675
// Might add PROFILE later.
2567625676

compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react-test-renderer/cjs/ReactTestRenderer-prod.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9152,7 +9152,7 @@ var devToolsConfig$jscomp$inline_1011 = {
91529152
throw Error("TestRenderer does not support findFiberByHostInstance()");
91539153
},
91549154
bundleType: 0,
9155-
version: "18.3.0-canary-cd63ef792-20240208",
9155+
version: "18.3.0-canary-e41ee9ea7-20240208",
91569156
rendererPackageName: "react-test-renderer"
91579157
};
91589158
var internals$jscomp$inline_1189 = {
@@ -9183,7 +9183,7 @@ var internals$jscomp$inline_1189 = {
91839183
scheduleRoot: null,
91849184
setRefreshHandler: null,
91859185
getCurrentFiber: null,
9186-
reconcilerVersion: "18.3.0-canary-cd63ef792-20240208"
9186+
reconcilerVersion: "18.3.0-canary-e41ee9ea7-20240208"
91879187
};
91889188
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
91899189
var hook$jscomp$inline_1190 = __REACT_DEVTOOLS_GLOBAL_HOOK__;

compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react-test-renderer/cjs/ReactTestRenderer-profiling.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9580,7 +9580,7 @@ var devToolsConfig$jscomp$inline_1053 = {
95809580
throw Error("TestRenderer does not support findFiberByHostInstance()");
95819581
},
95829582
bundleType: 0,
9583-
version: "18.3.0-canary-cd63ef792-20240208",
9583+
version: "18.3.0-canary-e41ee9ea7-20240208",
95849584
rendererPackageName: "react-test-renderer"
95859585
};
95869586
var internals$jscomp$inline_1230 = {
@@ -9611,7 +9611,7 @@ var internals$jscomp$inline_1230 = {
96119611
scheduleRoot: null,
96129612
setRefreshHandler: null,
96139613
getCurrentFiber: null,
9614-
reconcilerVersion: "18.3.0-canary-cd63ef792-20240208"
9614+
reconcilerVersion: "18.3.0-canary-e41ee9ea7-20240208"
96159615
};
96169616
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
96179617
var hook$jscomp$inline_1231 = __REACT_DEVTOOLS_GLOBAL_HOOK__;

compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/cjs/React-dev.js

Lines changed: 17 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<0dd9a827f64fd255297b65cbaecd6c33>>
10+
* @generated SignedSource<<46e4507c5c03b4e9b651f29123272054>>
1111
*/
1212

1313
"use strict";
@@ -24,7 +24,7 @@ if (__DEV__) {
2424
) {
2525
__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error());
2626
}
27-
var ReactVersion = "18.3.0-canary-cd63ef792-20240208";
27+
var ReactVersion = "18.3.0-canary-e41ee9ea7-20240208";
2828

2929
// ATTENTION
3030
// When adding new symbols to this file,
@@ -1791,6 +1791,13 @@ if (__DEV__) {
17911791
case REACT_ELEMENT_TYPE:
17921792
case REACT_PORTAL_TYPE:
17931793
invokeCallback = true;
1794+
break;
1795+
1796+
case REACT_LAZY_TYPE:
1797+
throw new Error(
1798+
"Cannot render an Async Component, Promise or React.Lazy inside React.Children. " +
1799+
"We recommend not iterating over children and just rendering them plain."
1800+
);
17941801
}
17951802
}
17961803
}
@@ -1904,6 +1911,14 @@ if (__DEV__) {
19041911
} else if (type === "object") {
19051912
// eslint-disable-next-line react-internal/safe-string-coercion
19061913
var childrenString = String(children);
1914+
1915+
if (typeof children.then === "function") {
1916+
throw new Error(
1917+
"Cannot render an Async Component, Promise or React.Lazy inside React.Children. " +
1918+
"We recommend not iterating over children and just rendering them plain."
1919+
);
1920+
}
1921+
19071922
throw new Error(
19081923
"Objects are not valid as a React child (found: " +
19091924
(childrenString === "[object Object]"

compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/cjs/React-prod.js

Lines changed: 20 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<bfea370d77b8a2763632472a0306ca34>>
10+
* @generated SignedSource<<16d58eb8536d00d4c5865c8269806ef1>>
1111
*/
1212

1313
"use strict";
@@ -177,6 +177,11 @@ function mapIntoArray(children, array, escapedPrefix, nameSoFar, callback) {
177177
case REACT_ELEMENT_TYPE:
178178
case REACT_PORTAL_TYPE:
179179
invokeCallback = !0;
180+
break;
181+
case REACT_LAZY_TYPE:
182+
throw Error(
183+
"Cannot render an Async Component, Promise or React.Lazy inside React.Children. We recommend not iterating over children and just rendering them plain."
184+
);
180185
}
181186
}
182187
if (invokeCallback)
@@ -241,17 +246,20 @@ function mapIntoArray(children, array, escapedPrefix, nameSoFar, callback) {
241246
nextName,
242247
callback
243248
));
244-
else if ("object" === type)
245-
throw (
246-
((array = String(children)),
247-
Error(
248-
"Objects are not valid as a React child (found: " +
249-
("[object Object]" === array
250-
? "object with keys {" + Object.keys(children).join(", ") + "}"
251-
: array) +
252-
"). If you meant to render a collection of children, use an array instead."
253-
))
249+
else if ("object" === type) {
250+
array = String(children);
251+
if ("function" === typeof children.then)
252+
throw Error(
253+
"Cannot render an Async Component, Promise or React.Lazy inside React.Children. We recommend not iterating over children and just rendering them plain."
254+
);
255+
throw Error(
256+
"Objects are not valid as a React child (found: " +
257+
("[object Object]" === array
258+
? "object with keys {" + Object.keys(children).join(", ") + "}"
259+
: array) +
260+
"). If you meant to render a collection of children, use an array instead."
254261
);
262+
}
255263
return invokeCallback;
256264
}
257265
function mapChildren(children, func, context) {
@@ -543,4 +551,4 @@ exports.useSyncExternalStore = function (
543551
exports.useTransition = function () {
544552
return ReactCurrentDispatcher.current.useTransition();
545553
};
546-
exports.version = "18.3.0-canary-cd63ef792-20240208";
554+
exports.version = "18.3.0-canary-e41ee9ea7-20240208";

compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/cjs/React-profiling.js

Lines changed: 20 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<ed24a17f92681cf29d086121949cb6ee>>
10+
* @generated SignedSource<<b8b76608b94e652bed210d7cb704af18>>
1111
*/
1212

1313
"use strict";
@@ -152,6 +152,11 @@ function mapIntoArray(children, array, escapedPrefix, nameSoFar, callback) {
152152
case REACT_ELEMENT_TYPE:
153153
case REACT_PORTAL_TYPE:
154154
invokeCallback = !0;
155+
break;
156+
case REACT_LAZY_TYPE:
157+
throw Error(
158+
"Cannot render an Async Component, Promise or React.Lazy inside React.Children. We recommend not iterating over children and just rendering them plain."
159+
);
155160
}
156161
}
157162
if (invokeCallback)
@@ -216,17 +221,20 @@ function mapIntoArray(children, array, escapedPrefix, nameSoFar, callback) {
216221
nextName,
217222
callback
218223
));
219-
else if ("object" === type)
220-
throw (
221-
((array = String(children)),
222-
Error(
223-
"Objects are not valid as a React child (found: " +
224-
("[object Object]" === array
225-
? "object with keys {" + Object.keys(children).join(", ") + "}"
226-
: array) +
227-
"). If you meant to render a collection of children, use an array instead."
228-
))
224+
else if ("object" === type) {
225+
array = String(children);
226+
if ("function" === typeof children.then)
227+
throw Error(
228+
"Cannot render an Async Component, Promise or React.Lazy inside React.Children. We recommend not iterating over children and just rendering them plain."
229+
);
230+
throw Error(
231+
"Objects are not valid as a React child (found: " +
232+
("[object Object]" === array
233+
? "object with keys {" + Object.keys(children).join(", ") + "}"
234+
: array) +
235+
"). If you meant to render a collection of children, use an array instead."
229236
);
237+
}
230238
return invokeCallback;
231239
}
232240
function mapChildren(children, func, context) {
@@ -539,7 +547,7 @@ exports.useSyncExternalStore = function (
539547
exports.useTransition = function () {
540548
return ReactCurrentDispatcher.current.useTransition();
541549
};
542-
exports.version = "18.3.0-canary-cd63ef792-20240208";
550+
exports.version = "18.3.0-canary-e41ee9ea7-20240208";
543551
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
544552
"function" ===
545553
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
cd63ef79218a1d53c8739da75b154014f3b7cc73
1+
e41ee9ea70f8998144fdd959ac11fd7a40e4ee20

0 commit comments

Comments
 (0)