Skip to content

Commit

Permalink
[Flight] Better error message if you pass a function as a child to a …
Browse files Browse the repository at this point in the history 
…client component (#28367)

Similar to #28362 but if you pass it to a client component.

DiffTrain build for [2e84e16](2e84e16)
  • Loading branch information
@sebmarkbage
sebmarkbage committed Feb 19, 2024
1 parent c456912 commit 3ff23f9
Show file tree
Hide file tree
Showing 9 changed files with 71 additions and 39 deletions.
2 changes: 1 addition & 1 deletion compiled/facebook-www/REVISION
View file
Original file line number Diff line number Diff line change
@@ -1 +1 @@
65a0e2b25ec4642f83c32d7599b5252c3955a60b
2e84e1629924e6cb278638305fa92040f6ef6eb5
2 changes: 1 addition & 1 deletion compiled/facebook-www/React-prod.modern.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -610,4 +610,4 @@ exports.useSyncExternalStore = function (
exports.useTransition = function () {
return ReactCurrentDispatcher.current.useTransition();
};
exports.version = "18.3.0-www-modern-f4161761";
exports.version = "18.3.0-www-modern-cf1f133e";
17 changes: 10 additions & 7 deletions compiled/facebook-www/ReactDOMServer-dev.classic.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ if (__DEV__) {
var React = require("react");
var ReactDOM = require("react-dom");

var ReactVersion = "18.3.0-www-classic-a730f95d";
var ReactVersion = "18.3.0-www-classic-cd3b8d66";

// This refers to a WWW module.
var warningWWW = require("warning");
Expand Down Expand Up @@ -184,12 +184,15 @@ if (__DEV__) {
return name;
}

case "function":
case "function": {
if (value.$$typeof === CLIENT_REFERENCE_TAG) {
return describeClientReference();
}

return "function";
var _name = value.displayName || value.name;

return _name ? "function " + _name : "function";
}

default:
// eslint-disable-next-line react-internal/safe-string-coercion
Expand Down Expand Up @@ -380,9 +383,9 @@ if (__DEV__) {
str += ", ";
}

var _name = _names[_i3];
str += describeKeyForErrorMessage(_name) + ": ";
var _value3 = _object[_name];
var _name2 = _names[_i3];
str += describeKeyForErrorMessage(_name2) + ": ";
var _value3 = _object[_name2];

var _substr3 = void 0;

Expand All @@ -392,7 +395,7 @@ if (__DEV__) {
_substr3 = describeValueForErrorMessage(_value3);
}

if (_name === expandedName) {
if (_name2 === expandedName) {
start = str.length;
length = _substr3.length;
str += _substr3;
Expand Down
17 changes: 10 additions & 7 deletions compiled/facebook-www/ReactDOMServer-dev.modern.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ if (__DEV__) {
var React = require("react");
var ReactDOM = require("react-dom");

var ReactVersion = "18.3.0-www-modern-2b72b29d";
var ReactVersion = "18.3.0-www-modern-06e02b7d";

// This refers to a WWW module.
var warningWWW = require("warning");
Expand Down Expand Up @@ -184,12 +184,15 @@ if (__DEV__) {
return name;
}

case "function":
case "function": {
if (value.$$typeof === CLIENT_REFERENCE_TAG) {
return describeClientReference();
}

return "function";
var _name = value.displayName || value.name;

return _name ? "function " + _name : "function";
}

default:
// eslint-disable-next-line react-internal/safe-string-coercion
Expand Down Expand Up @@ -380,9 +383,9 @@ if (__DEV__) {
str += ", ";
}

var _name = _names[_i3];
str += describeKeyForErrorMessage(_name) + ": ";
var _value3 = _object[_name];
var _name2 = _names[_i3];
str += describeKeyForErrorMessage(_name2) + ": ";
var _value3 = _object[_name2];

var _substr3 = void 0;

Expand All @@ -392,7 +395,7 @@ if (__DEV__) {
_substr3 = describeValueForErrorMessage(_value3);
}

if (_name === expandedName) {
if (_name2 === expandedName) {
start = str.length;
length = _substr3.length;
str += _substr3;
Expand Down
15 changes: 9 additions & 6 deletions compiled/facebook-www/ReactDOMServerStreaming-dev.modern.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -182,12 +182,15 @@ if (__DEV__) {
return name;
}

case "function":
case "function": {
if (value.$$typeof === CLIENT_REFERENCE_TAG) {
return describeClientReference();
}

return "function";
var _name = value.displayName || value.name;

return _name ? "function " + _name : "function";
}

default:
// eslint-disable-next-line react-internal/safe-string-coercion
Expand Down Expand Up @@ -378,9 +381,9 @@ if (__DEV__) {
str += ", ";
}

var _name = _names[_i3];
str += describeKeyForErrorMessage(_name) + ": ";
var _value3 = _object[_name];
var _name2 = _names[_i3];
str += describeKeyForErrorMessage(_name2) + ": ";
var _value3 = _object[_name2];

var _substr3 = void 0;

Expand All @@ -390,7 +393,7 @@ if (__DEV__) {
_substr3 = describeValueForErrorMessage(_value3);
}

if (_name === expandedName) {
if (_name2 === expandedName) {
start = str.length;
length = _substr3.length;
str += _substr3;
Expand Down
6 changes: 3 additions & 3 deletions compiled/facebook-www/ReactDOMTesting-prod.modern.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17085,7 +17085,7 @@ Internals.Events = [
var devToolsConfig$jscomp$inline_1783 = {
findFiberByHostInstance: getClosestInstanceFromNode,
bundleType: 0,
version: "18.3.0-www-modern-448aa5e1",
version: "18.3.0-www-modern-90e18ae7",
rendererPackageName: "react-dom"
};
var internals$jscomp$inline_2154 = {
Expand Down Expand Up @@ -17116,7 +17116,7 @@ var internals$jscomp$inline_2154 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "18.3.0-www-modern-448aa5e1"
reconcilerVersion: "18.3.0-www-modern-90e18ae7"
};
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
var hook$jscomp$inline_2155 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
Expand Down Expand Up @@ -17537,4 +17537,4 @@ exports.useFormState = function (action, initialState, permalink) {
exports.useFormStatus = function () {
return ReactCurrentDispatcher$2.current.useHostTransitionStatus();
};
exports.version = "18.3.0-www-modern-448aa5e1";
exports.version = "18.3.0-www-modern-90e18ae7";
33 changes: 26 additions & 7 deletions compiled/facebook-www/ReactFlightDOMServer-dev.modern.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -842,12 +842,15 @@ if (__DEV__) {
return name;
}

case "function":
case "function": {
if (value.$$typeof === CLIENT_REFERENCE_TAG) {
return describeClientReference();
}

return "function";
var _name = value.displayName || value.name;

return _name ? "function " + _name : "function";
}

default:
// eslint-disable-next-line react-internal/safe-string-coercion
Expand Down Expand Up @@ -1038,9 +1041,9 @@ if (__DEV__) {
str += ", ";
}

var _name = _names[_i3];
str += describeKeyForErrorMessage(_name) + ": ";
var _value3 = _object[_name];
var _name2 = _names[_i3];
str += describeKeyForErrorMessage(_name2) + ": ";
var _value3 = _object[_name2];

var _substr3 = void 0;

Expand All @@ -1050,7 +1053,7 @@ if (__DEV__) {
_substr3 = describeValueForErrorMessage(_value3);
}

if (_name === expandedName) {
if (_name2 === expandedName) {
start = str.length;
length = _substr3.length;
str += _substr3;
Expand Down Expand Up @@ -2263,10 +2266,26 @@ if (__DEV__) {
describeObjectForErrorMessage(parent, parentPropertyName) +
"\nIf you need interactivity, consider converting part of this to a Client Component."
);
} else if (
jsxChildrenParents.has(parent) ||
(jsxPropsParents.has(parent) && parentPropertyName === "children")
) {
var componentName = value.displayName || value.name || "Component";
throw new Error(
"Functions are not valid as a child of Client Components. This may happen if " +
"you return " +
componentName +
" instead of <" +
componentName +
" /> from render. " +
"Or maybe you meant to call this function rather than return it." +
describeObjectForErrorMessage(parent, parentPropertyName)
);
} else {
throw new Error(
"Functions cannot be passed directly to Client Components " +
'unless you explicitly expose it by marking it with "use server".' +
'unless you explicitly expose it by marking it with "use server". ' +
"Or maybe you meant to call this function rather than return it." +
describeObjectForErrorMessage(parent, parentPropertyName)
);
}
Expand Down
16 changes: 10 additions & 6 deletions compiled/facebook-www/ReactFlightDOMServer-prod.modern.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -351,7 +351,11 @@ function describeValueForErrorMessage(value) {
value = objectName(value);
return "Object" === value ? "{...}" : value;
case "function":
return value.$$typeof === CLIENT_REFERENCE_TAG ? "client" : "function";
return value.$$typeof === CLIENT_REFERENCE_TAG
? "client"
: (value = value.displayName || value.name)
? "function " + value
: "function";
default:
return String(value);
}
Expand Down Expand Up @@ -920,18 +924,18 @@ function renderModelDestructive(
}
if ("symbol" === typeof value) {
task = request.writtenSymbols;
var existingId$8 = task.get(value);
if (void 0 !== existingId$8) return serializeByValueID(existingId$8);
existingId$8 = value.description;
if (Symbol.for(existingId$8) !== value)
var existingId$9 = task.get(value);
if (void 0 !== existingId$9) return serializeByValueID(existingId$9);
existingId$9 = value.description;
if (Symbol.for(existingId$9) !== value)
throw Error(
"Only global symbols received from Symbol.for(...) can be passed to Client Components. The symbol Symbol.for(" +
(value.description + ") cannot be found among global symbols.") +
describeObjectForErrorMessage(parent, parentPropertyName)
);
request.pendingChunks++;
parent = request.nextChunkId++;
parentPropertyName = stringify("$S" + existingId$8);
parentPropertyName = stringify("$S" + existingId$9);
parentPropertyName = parent.toString(16) + ":" + parentPropertyName + "\n";
request.completedImportChunks.push(parentPropertyName);
task.set(value, parent);
Expand Down
2 changes: 1 addition & 1 deletion compiled/facebook-www/ReactTestRenderer-dev.modern.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26067,7 +26067,7 @@ if (__DEV__) {
return root;
}

var ReactVersion = "18.3.0-www-modern-f239ff56";
var ReactVersion = "18.3.0-www-modern-c4de807b";

// Might add PROFILE later.

Expand Down

0 comments on commit 3ff23f9

Please sign in to comment.