Facebook/react
1
0
Fork 0
mirror of https://github.com/facebook/react.git synced 2025-11-01 09:12:30 +00:00
Code Issues Packages Projects Releases Wiki Activity

Include the function name for context on invalid function child (#28362)

Browse Source 
Also warn for symbols.

It's weird because for objects we throw a hard error but functions we do
a dev only check. Mainly because we have an object branch anyway.

In the object branch we have some built-ins that have bad errors like
forwardRef and memo but since they're going to become functions later, I
didn't bother updating those. Once they're functions those names will be
part of this.

DiffTrain build for commit https://github.com/facebook/react/commit/c1fd2a91b1042c137d750be85e5998f699a54d2a.
This commit is contained in:
sebmarkbage
2024-02-17 21:46:43 +00:00
parent c2e732f814
commit 9452c20ca0
9 changed files with 248 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files
compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react-test-renderer/cjs/ReactTestRenderer-dev.js
Vendored
+80 -16
View File
@@ -7,7 +7,7 @@
* @noflow
* @nolint
* @preventMunge
* @generated SignedSource<<2bd76364e49975f7447df4d717144b25>>
* @generated SignedSource<<825f43f1ef38b03ee1f23d7689105b33>>
*/
"use strict";
@@ -4972,6 +4972,7 @@ if (__DEV__) {
var didWarnAboutStringRefs;
var ownerHasKeyUseWarning;
var ownerHasFunctionTypeWarning;
var ownerHasSymbolTypeWarning;
var warnForMissingKey = function (child, returnFiber) {};
@@ -4987,6 +4988,7 @@ if (__DEV__) {
ownerHasKeyUseWarning = {};
ownerHasFunctionTypeWarning = {};
ownerHasSymbolTypeWarning = {};
warnForMissingKey = function (child, returnFiber) {
if (child === null || typeof child !== "object") {
@@ -5169,22 +5171,68 @@ if (__DEV__) {
);
}
function warnOnFunctionType(returnFiber) {
function warnOnFunctionType(returnFiber, invalidChild) {
{
var componentName =
getComponentNameFromFiber(returnFiber) || "Component";
var parentName = getComponentNameFromFiber(returnFiber) || "Component";
if (ownerHasFunctionTypeWarning[componentName]) {
if (ownerHasFunctionTypeWarning[parentName]) {
return;
}
ownerHasFunctionTypeWarning[componentName] = true;
ownerHasFunctionTypeWarning[parentName] = true;
var name = invalidChild.displayName || invalidChild.name || "Component";
error(
"Functions are not valid as a React child. This may happen if " +
"you return a Component instead of <Component /> from render. " +
"Or maybe you meant to call this function rather than return it."
);
if (returnFiber.tag === HostRoot) {
error(
"Functions are not valid as a React child. This may happen if " +
"you return %s instead of <%s /> from render. " +
"Or maybe you meant to call this function rather than return it.\n" +
" root.render(%s)",
name,
name,
name
);
} else {
error(
"Functions are not valid as a React child. This may happen if " +
"you return %s instead of <%s /> from render. " +
"Or maybe you meant to call this function rather than return it.\n" +
" <%s>{%s}</%s>",
name,
name,
parentName,
name,
parentName
);
}
}
}
function warnOnSymbolType(returnFiber, invalidChild) {
{
var parentName = getComponentNameFromFiber(returnFiber) || "Component";
if (ownerHasSymbolTypeWarning[parentName]) {
return;
}
ownerHasSymbolTypeWarning[parentName] = true; // eslint-disable-next-line react-internal/safe-string-coercion
var name = String(invalidChild);
if (returnFiber.tag === HostRoot) {
error(
"Symbols are not valid as a React child.\n" + " root.render(%s)",
name
);
} else {
error(
"Symbols are not valid as a React child.\n" + " <%s>%s</%s>",
parentName,
name,
parentName
);
}
}
}
@@ -5569,7 +5617,11 @@ if (__DEV__) {
{
if (typeof newChild === "function") {
warnOnFunctionType(returnFiber);
warnOnFunctionType(returnFiber, newChild);
}
if (typeof newChild === "symbol") {
warnOnSymbolType(returnFiber, newChild);
}
}
@@ -5687,7 +5739,11 @@ if (__DEV__) {
{
if (typeof newChild === "function") {
warnOnFunctionType(returnFiber);
warnOnFunctionType(returnFiber, newChild);
}
if (typeof newChild === "symbol") {
warnOnSymbolType(returnFiber, newChild);
}
}
@@ -5807,7 +5863,11 @@ if (__DEV__) {
{
if (typeof newChild === "function") {
warnOnFunctionType(returnFiber);
warnOnFunctionType(returnFiber, newChild);
}
if (typeof newChild === "symbol") {
warnOnSymbolType(returnFiber, newChild);
}
}
@@ -6562,7 +6622,11 @@ if (__DEV__) {
{
if (typeof newChild === "function") {
warnOnFunctionType(returnFiber);
warnOnFunctionType(returnFiber, newChild);
}
if (typeof newChild === "symbol") {
warnOnSymbolType(returnFiber, newChild);
}
} // Remaining cases are all treated as empty.
@@ -25633,7 +25697,7 @@ if (__DEV__) {
return root;
}
var ReactVersion = "18.3.0-canary-fef30c2e0-20240217";
var ReactVersion = "18.3.0-canary-c1fd2a91b-20240217";
// Might add PROFILE later.
compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react-test-renderer/cjs/ReactTestRenderer-prod.js
Vendored
+2 -2
View File
@@ -9179,7 +9179,7 @@ var devToolsConfig$jscomp$inline_1018 = {
throw Error("TestRenderer does not support findFiberByHostInstance()");
},
bundleType: 0,
version: "18.3.0-canary-fef30c2e0-20240217",
version: "18.3.0-canary-c1fd2a91b-20240217",
rendererPackageName: "react-test-renderer"
};
var internals$jscomp$inline_1199 = {
@@ -9210,7 +9210,7 @@ var internals$jscomp$inline_1199 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "18.3.0-canary-fef30c2e0-20240217"
reconcilerVersion: "18.3.0-canary-c1fd2a91b-20240217"
};
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
var hook$jscomp$inline_1200 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react-test-renderer/cjs/ReactTestRenderer-profiling.js
Vendored
+2 -2
View File
@@ -9607,7 +9607,7 @@ var devToolsConfig$jscomp$inline_1060 = {
throw Error("TestRenderer does not support findFiberByHostInstance()");
},
bundleType: 0,
version: "18.3.0-canary-fef30c2e0-20240217",
version: "18.3.0-canary-c1fd2a91b-20240217",
rendererPackageName: "react-test-renderer"
};
var internals$jscomp$inline_1240 = {
@@ -9638,7 +9638,7 @@ var internals$jscomp$inline_1240 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "18.3.0-canary-fef30c2e0-20240217"
reconcilerVersion: "18.3.0-canary-c1fd2a91b-20240217"
};
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
var hook$jscomp$inline_1241 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/cjs/React-dev.js
Vendored
+1 -1
View File
@@ -24,7 +24,7 @@ if (__DEV__) {
) {
__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error());
}
var ReactVersion = "18.3.0-canary-fef30c2e0-20240217";
var ReactVersion = "18.3.0-canary-c1fd2a91b-20240217";
// ATTENTION
// When adding new symbols to this file,
compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/cjs/React-prod.js
Vendored
+1 -1
View File
@@ -590,4 +590,4 @@ exports.useSyncExternalStore = function (
exports.useTransition = function () {
return ReactCurrentDispatcher.current.useTransition();
};
exports.version = "18.3.0-canary-fef30c2e0-20240217";
exports.version = "18.3.0-canary-c1fd2a91b-20240217";
compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/cjs/React-profiling.js
Vendored
+1 -1
View File
@@ -586,7 +586,7 @@ exports.useSyncExternalStore = function (
exports.useTransition = function () {
return ReactCurrentDispatcher.current.useTransition();
};
exports.version = "18.3.0-canary-fef30c2e0-20240217";
exports.version = "18.3.0-canary-c1fd2a91b-20240217";
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
"function" ===
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
compiled-rn/facebook-fbsource/xplat/js/react-native-github/Libraries/Renderer/REVISION
+1 -1
View File
@@ -1 +1 @@
fef30c2e0403e0c6986904be89fcd01e665866ee
c1fd2a91b1042c137d750be85e5998f699a54d2a
compiled-rn/facebook-fbsource/xplat/js/react-native-github/Libraries/Renderer/implementations/ReactFabric-dev.fb.js
+80 -16
View File
@@ -7,7 +7,7 @@
* @noflow
* @nolint
* @preventMunge
* @generated SignedSource<<eafe6f8c93c68ef414c9c5d3e0c8f7dd>>
* @generated SignedSource<<f0e56e2fe67e9208d392fd3e30b44313>>
*/
"use strict";
@@ -8611,6 +8611,7 @@ to return true:wantsResponderID| |
var didWarnAboutStringRefs;
var ownerHasKeyUseWarning;
var ownerHasFunctionTypeWarning;
var ownerHasSymbolTypeWarning;
var warnForMissingKey = function (child, returnFiber) {};
@@ -8626,6 +8627,7 @@ to return true:wantsResponderID| |
ownerHasKeyUseWarning = {};
ownerHasFunctionTypeWarning = {};
ownerHasSymbolTypeWarning = {};
warnForMissingKey = function (child, returnFiber) {
if (child === null || typeof child !== "object") {
@@ -8808,22 +8810,68 @@ to return true:wantsResponderID| |
);
}
function warnOnFunctionType(returnFiber) {
function warnOnFunctionType(returnFiber, invalidChild) {
{
var componentName =
getComponentNameFromFiber(returnFiber) || "Component";
var parentName = getComponentNameFromFiber(returnFiber) || "Component";
if (ownerHasFunctionTypeWarning[componentName]) {
if (ownerHasFunctionTypeWarning[parentName]) {
return;
}
ownerHasFunctionTypeWarning[componentName] = true;
ownerHasFunctionTypeWarning[parentName] = true;
var name = invalidChild.displayName || invalidChild.name || "Component";
error(
"Functions are not valid as a React child. This may happen if " +
"you return a Component instead of <Component /> from render. " +
"Or maybe you meant to call this function rather than return it."
);
if (returnFiber.tag === HostRoot) {
error(
"Functions are not valid as a React child. This may happen if " +
"you return %s instead of <%s /> from render. " +
"Or maybe you meant to call this function rather than return it.\n" +
" root.render(%s)",
name,
name,
name
);
} else {
error(
"Functions are not valid as a React child. This may happen if " +
"you return %s instead of <%s /> from render. " +
"Or maybe you meant to call this function rather than return it.\n" +
" <%s>{%s}</%s>",
name,
name,
parentName,
name,
parentName
);
}
}
}
function warnOnSymbolType(returnFiber, invalidChild) {
{
var parentName = getComponentNameFromFiber(returnFiber) || "Component";
if (ownerHasSymbolTypeWarning[parentName]) {
return;
}
ownerHasSymbolTypeWarning[parentName] = true; // eslint-disable-next-line react-internal/safe-string-coercion
var name = String(invalidChild);
if (returnFiber.tag === HostRoot) {
error(
"Symbols are not valid as a React child.\n" + " root.render(%s)",
name
);
} else {
error(
"Symbols are not valid as a React child.\n" + " <%s>%s</%s>",
parentName,
name,
parentName
);
}
}
}
@@ -9208,7 +9256,11 @@ to return true:wantsResponderID| |
{
if (typeof newChild === "function") {
warnOnFunctionType(returnFiber);
warnOnFunctionType(returnFiber, newChild);
}
if (typeof newChild === "symbol") {
warnOnSymbolType(returnFiber, newChild);
}
}
@@ -9326,7 +9378,11 @@ to return true:wantsResponderID| |
{
if (typeof newChild === "function") {
warnOnFunctionType(returnFiber);
warnOnFunctionType(returnFiber, newChild);
}
if (typeof newChild === "symbol") {
warnOnSymbolType(returnFiber, newChild);
}
}
@@ -9446,7 +9502,11 @@ to return true:wantsResponderID| |
{
if (typeof newChild === "function") {
warnOnFunctionType(returnFiber);
warnOnFunctionType(returnFiber, newChild);
}
if (typeof newChild === "symbol") {
warnOnSymbolType(returnFiber, newChild);
}
}
@@ -10201,7 +10261,11 @@ to return true:wantsResponderID| |
{
if (typeof newChild === "function") {
warnOnFunctionType(returnFiber);
warnOnFunctionType(returnFiber, newChild);
}
if (typeof newChild === "symbol") {
warnOnSymbolType(returnFiber, newChild);
}
} // Remaining cases are all treated as empty.
@@ -27672,7 +27736,7 @@ to return true:wantsResponderID| |
return root;
}
var ReactVersion = "18.3.0-canary-f6a619c0";
var ReactVersion = "18.3.0-canary-d5b088bd";
function createPortal$1(
children,
compiled-rn/facebook-fbsource/xplat/js/react-native-github/Libraries/Renderer/implementations/ReactNativeRenderer-dev.fb.js
+80 -16
View File
@@ -7,7 +7,7 @@
* @noflow
* @nolint
* @preventMunge
* @generated SignedSource<<3dc9ab97890b41f48d6f4539b4ecde3d>>
* @generated SignedSource<<e35fcd9ae95927cef47f7bb2f68249cf>>
*/
"use strict";
@@ -8883,6 +8883,7 @@ to return true:wantsResponderID| |
var didWarnAboutStringRefs;
var ownerHasKeyUseWarning;
var ownerHasFunctionTypeWarning;
var ownerHasSymbolTypeWarning;
var warnForMissingKey = function (child, returnFiber) {};
@@ -8898,6 +8899,7 @@ to return true:wantsResponderID| |
ownerHasKeyUseWarning = {};
ownerHasFunctionTypeWarning = {};
ownerHasSymbolTypeWarning = {};
warnForMissingKey = function (child, returnFiber) {
if (child === null || typeof child !== "object") {
@@ -9080,22 +9082,68 @@ to return true:wantsResponderID| |
);
}
function warnOnFunctionType(returnFiber) {
function warnOnFunctionType(returnFiber, invalidChild) {
{
var componentName =
getComponentNameFromFiber(returnFiber) || "Component";
var parentName = getComponentNameFromFiber(returnFiber) || "Component";
if (ownerHasFunctionTypeWarning[componentName]) {
if (ownerHasFunctionTypeWarning[parentName]) {
return;
}
ownerHasFunctionTypeWarning[componentName] = true;
ownerHasFunctionTypeWarning[parentName] = true;
var name = invalidChild.displayName || invalidChild.name || "Component";
error(
"Functions are not valid as a React child. This may happen if " +
"you return a Component instead of <Component /> from render. " +
"Or maybe you meant to call this function rather than return it."
);
if (returnFiber.tag === HostRoot) {
error(
"Functions are not valid as a React child. This may happen if " +
"you return %s instead of <%s /> from render. " +
"Or maybe you meant to call this function rather than return it.\n" +
" root.render(%s)",
name,
name,
name
);
} else {
error(
"Functions are not valid as a React child. This may happen if " +
"you return %s instead of <%s /> from render. " +
"Or maybe you meant to call this function rather than return it.\n" +
" <%s>{%s}</%s>",
name,
name,
parentName,
name,
parentName
);
}
}
}
function warnOnSymbolType(returnFiber, invalidChild) {
{
var parentName = getComponentNameFromFiber(returnFiber) || "Component";
if (ownerHasSymbolTypeWarning[parentName]) {
return;
}
ownerHasSymbolTypeWarning[parentName] = true; // eslint-disable-next-line react-internal/safe-string-coercion
var name = String(invalidChild);
if (returnFiber.tag === HostRoot) {
error(
"Symbols are not valid as a React child.\n" + " root.render(%s)",
name
);
} else {
error(
"Symbols are not valid as a React child.\n" + " <%s>%s</%s>",
parentName,
name,
parentName
);
}
}
}
@@ -9480,7 +9528,11 @@ to return true:wantsResponderID| |
{
if (typeof newChild === "function") {
warnOnFunctionType(returnFiber);
warnOnFunctionType(returnFiber, newChild);
}
if (typeof newChild === "symbol") {
warnOnSymbolType(returnFiber, newChild);
}
}
@@ -9598,7 +9650,11 @@ to return true:wantsResponderID| |
{
if (typeof newChild === "function") {
warnOnFunctionType(returnFiber);
warnOnFunctionType(returnFiber, newChild);
}
if (typeof newChild === "symbol") {
warnOnSymbolType(returnFiber, newChild);
}
}
@@ -9718,7 +9774,11 @@ to return true:wantsResponderID| |
{
if (typeof newChild === "function") {
warnOnFunctionType(returnFiber);
warnOnFunctionType(returnFiber, newChild);
}
if (typeof newChild === "symbol") {
warnOnSymbolType(returnFiber, newChild);
}
}
@@ -10473,7 +10533,11 @@ to return true:wantsResponderID| |
{
if (typeof newChild === "function") {
warnOnFunctionType(returnFiber);
warnOnFunctionType(returnFiber, newChild);
}
if (typeof newChild === "symbol") {
warnOnSymbolType(returnFiber, newChild);
}
} // Remaining cases are all treated as empty.
@@ -28113,7 +28177,7 @@ to return true:wantsResponderID| |
return root;
}
var ReactVersion = "18.3.0-canary-b3071bed";
var ReactVersion = "18.3.0-canary-602d6f04";
function createPortal$1(
children,