Format DOM Nesting Warning as Diff View + An Additional Log for Stack Trace (#30302)

Currently we're printing parent stacks at the end of DOM nesting even
with owner stacks enabled. That's because the context of parent tree is
relevant for determining why two things are nested. It might not be
sufficient to see the owner stack alone.

I'm trying to get rid of parent stacks and rely on more of the plain
owner stacks or ideally console.createTask. These are generally better
anyway since the exact line for creating the JSX is available. It also
lets you find a parent stack frame that is most relevant e.g. if it's
hidden inside internals.

For DOM nesting there's really only two stacks that are relevant. The
creation of the parent and the creation of the child. Sometimes they're
close enough to be the same thing. Such as for parents that can't have
text children or when the ancestor is the direct parent created at the
same place (same owner).

Sometimes they're far apart. In this case I add a second console.error
within the context of the ancestor. That way the second stack trace can
be used to read the stack trace for where it was created.

To preserve some parent context I now print the parent stack in a diff
view format using the logic from hydration diffs. This includes some
siblings and props for context.

<img width="756" alt="Screenshot 2024-07-10 at 12 21 38 AM"
src="https://github.com/facebook/react/assets/63648/0843133d-cc7a-4ecc-91c0-f46ae8e99f20">

Text Nodes:

<img width="749" alt="Screenshot 2024-07-10 at 12 37 40 AM"
src="https://github.com/facebook/react/assets/63648/ee377d82-54ee-450a-99d1-fcc3ef290d59">

---------

Co-authored-by: tjallingt <tjallingt@gmail.com>

DiffTrain build for [2d3f81bb6a](https://github.com/facebook/react/commit/2d3f81bb6a650386832d885d7b63a7d0d517ba15)
This commit is contained in:
sebmarkbage
2024-07-10 16:22:14 +00:00
co-authored by tjallingt
parent c8b941f8d2
commit f4ccb1f263
35 changed files with 2277 additions and 1984 deletions
+1 -1
View File
@@ -1 +1 @@
378b305958eb7259cacfce8ad0e66eec07e07074
2d3f81bb6a650386832d885d7b63a7d0d517ba15
+1 -1
View File
@@ -1 +1 @@
378b305958eb7259cacfce8ad0e66eec07e07074
2d3f81bb6a650386832d885d7b63a7d0d517ba15
+1 -1
View File
@@ -1998,7 +1998,7 @@ __DEV__ &&
exports.useTransition = function () {
return resolveDispatcher().useTransition();
};
exports.version = "19.0.0-www-classic-378b305958-20240710";
exports.version = "19.0.0-www-classic-2d3f81bb6a-20240710";
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
"function" ===
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
+1 -1
View File
@@ -1978,7 +1978,7 @@ __DEV__ &&
exports.useTransition = function () {
return resolveDispatcher().useTransition();
};
exports.version = "19.0.0-www-modern-378b305958-20240710";
exports.version = "19.0.0-www-modern-2d3f81bb6a-20240710";
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
"function" ===
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
+1 -1
View File
@@ -669,4 +669,4 @@ exports.useSyncExternalStore = function (
exports.useTransition = function () {
return ReactSharedInternals.H.useTransition();
};
exports.version = "19.0.0-www-classic-378b305958-20240710";
exports.version = "19.0.0-www-classic-2d3f81bb6a-20240710";
+1 -1
View File
@@ -669,4 +669,4 @@ exports.useSyncExternalStore = function (
exports.useTransition = function () {
return ReactSharedInternals.H.useTransition();
};
exports.version = "19.0.0-www-modern-378b305958-20240710";
exports.version = "19.0.0-www-modern-2d3f81bb6a-20240710";
@@ -673,7 +673,7 @@ exports.useSyncExternalStore = function (
exports.useTransition = function () {
return ReactSharedInternals.H.useTransition();
};
exports.version = "19.0.0-www-classic-378b305958-20240710";
exports.version = "19.0.0-www-classic-2d3f81bb6a-20240710";
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
"function" ===
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
@@ -673,7 +673,7 @@ exports.useSyncExternalStore = function (
exports.useTransition = function () {
return ReactSharedInternals.H.useTransition();
};
exports.version = "19.0.0-www-modern-378b305958-20240710";
exports.version = "19.0.0-www-modern-2d3f81bb6a-20240710";
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
"function" ===
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
+22 -10
View File
@@ -1991,7 +1991,10 @@ __DEV__ &&
"number" === typeof clientProps ||
"bigint" === typeof clientProps
)
content += describeTextDiff("" + clientProps, void 0, indent + 1);
content =
null == type
? content + describeTextDiff("" + clientProps, null, indent + 1)
: content + describeTextDiff("" + clientProps, void 0, indent + 1);
return content;
}
function describeSiblingFiber(fiber, indent) {
@@ -2027,7 +2030,7 @@ __DEV__ &&
debugInfo = "";
i = node.fiber.pendingProps;
if (6 === node.fiber.tag)
debugInfo = describeTextDiff(i, node.serverProps, indent);
(debugInfo = describeTextDiff(i, node.serverProps, indent)), indent++;
else if (
((serverComponentName = describeFiberType(node.fiber)),
null !== serverComponentName)
@@ -2055,11 +2058,12 @@ __DEV__ &&
indent++;
} else
null === node.serverProps
? (debugInfo = describeExpandedElement(
? ((debugInfo = describeExpandedElement(
serverComponentName,
i,
added(indent)
))
)),
indent++)
: "string" === typeof node.serverProps
? error$jscomp$0(
"Should not have matched a non HostText fiber to a Text node. This is a bug in React."
@@ -2087,9 +2091,10 @@ __DEV__ &&
i &&
0 < node.children.length &&
(propName += indentation(indent) + "...\n");
node = node.serverTail;
for (i = 0; i < node.length; i++)
(serverComponentName = node[i]),
i = node.serverTail;
null === node.serverProps && indent--;
for (node = 0; node < i.length; node++)
(serverComponentName = i[node]),
(propName =
"string" === typeof serverComponentName
? propName +
@@ -2982,6 +2987,7 @@ __DEV__ &&
lanes
)),
(current.return = returnFiber),
(current._debugOwner = returnFiber),
(current._debugInfo = currentDebugInfo),
current
);
@@ -3055,6 +3061,7 @@ __DEV__ &&
key
)),
(current.return = returnFiber),
(current._debugOwner = returnFiber),
(current._debugInfo = currentDebugInfo),
current
);
@@ -3076,6 +3083,7 @@ __DEV__ &&
lanes
)),
(newChild.return = returnFiber),
(newChild._debugOwner = returnFiber),
(newChild._debugInfo = currentDebugInfo),
newChild
);
@@ -3122,6 +3130,7 @@ __DEV__ &&
null
)),
(lanes.return = returnFiber),
(lanes._debugOwner = returnFiber),
(returnFiber = pushDebugInfo(newChild._debugInfo)),
(lanes._debugInfo = currentDebugInfo),
(currentDebugInfo = returnFiber),
@@ -3654,6 +3663,7 @@ __DEV__ &&
newChild.key
)),
(currentFirstChild.return = returnFiber),
(currentFirstChild._debugOwner = returnFiber),
(currentFirstChild._debugInfo = currentDebugInfo),
validateFragmentProps(
newChild,
@@ -3825,6 +3835,8 @@ __DEV__ &&
lanes
)),
(currentFirstChild.return = returnFiber),
(currentFirstChild._debugOwner = returnFiber),
(currentFirstChild._debugInfo = currentDebugInfo),
(returnFiber = currentFirstChild)),
placeSingleChild(returnFiber)
);
@@ -15050,7 +15062,7 @@ __DEV__ &&
_currentValue2: null,
_threadCount: 0
},
needsEscaping = /["'&<>\n\t]/,
needsEscaping = /["'&<>\n\t]|^\s|\s$/,
hydrationDiffRootDEV = null,
hydrationErrors = null,
concurrentQueues = [],
@@ -16962,14 +16974,14 @@ __DEV__ &&
scheduleRoot: scheduleRoot,
setRefreshHandler: setRefreshHandler,
getCurrentFiber: getCurrentFiberForDevTools,
reconcilerVersion: "19.0.0-www-classic-378b305958-20240710"
reconcilerVersion: "19.0.0-www-classic-2d3f81bb6a-20240710"
});
})({
findFiberByHostInstance: function () {
return null;
},
bundleType: 1,
version: "19.0.0-www-classic-378b305958-20240710",
version: "19.0.0-www-classic-2d3f81bb6a-20240710",
rendererPackageName: "react-art"
});
var ClippingRectangle = TYPES.CLIPPING_RECTANGLE,
+22 -10
View File
@@ -1894,7 +1894,10 @@ __DEV__ &&
"number" === typeof clientProps ||
"bigint" === typeof clientProps
)
content += describeTextDiff("" + clientProps, void 0, indent + 1);
content =
null == type
? content + describeTextDiff("" + clientProps, null, indent + 1)
: content + describeTextDiff("" + clientProps, void 0, indent + 1);
return content;
}
function describeSiblingFiber(fiber, indent) {
@@ -1930,7 +1933,7 @@ __DEV__ &&
debugInfo = "";
i = node.fiber.pendingProps;
if (6 === node.fiber.tag)
debugInfo = describeTextDiff(i, node.serverProps, indent);
(debugInfo = describeTextDiff(i, node.serverProps, indent)), indent++;
else if (
((serverComponentName = describeFiberType(node.fiber)),
null !== serverComponentName)
@@ -1958,11 +1961,12 @@ __DEV__ &&
indent++;
} else
null === node.serverProps
? (debugInfo = describeExpandedElement(
? ((debugInfo = describeExpandedElement(
serverComponentName,
i,
added(indent)
))
)),
indent++)
: "string" === typeof node.serverProps
? error$jscomp$0(
"Should not have matched a non HostText fiber to a Text node. This is a bug in React."
@@ -1990,9 +1994,10 @@ __DEV__ &&
i &&
0 < node.children.length &&
(propName += indentation(indent) + "...\n");
node = node.serverTail;
for (i = 0; i < node.length; i++)
(serverComponentName = node[i]),
i = node.serverTail;
null === node.serverProps && indent--;
for (node = 0; node < i.length; node++)
(serverComponentName = i[node]),
(propName =
"string" === typeof serverComponentName
? propName +
@@ -2881,6 +2886,7 @@ __DEV__ &&
lanes
)),
(current.return = returnFiber),
(current._debugOwner = returnFiber),
(current._debugInfo = currentDebugInfo),
current
);
@@ -2954,6 +2960,7 @@ __DEV__ &&
key
)),
(current.return = returnFiber),
(current._debugOwner = returnFiber),
(current._debugInfo = currentDebugInfo),
current
);
@@ -2975,6 +2982,7 @@ __DEV__ &&
lanes
)),
(newChild.return = returnFiber),
(newChild._debugOwner = returnFiber),
(newChild._debugInfo = currentDebugInfo),
newChild
);
@@ -3021,6 +3029,7 @@ __DEV__ &&
null
)),
(lanes.return = returnFiber),
(lanes._debugOwner = returnFiber),
(returnFiber = pushDebugInfo(newChild._debugInfo)),
(lanes._debugInfo = currentDebugInfo),
(currentDebugInfo = returnFiber),
@@ -3553,6 +3562,7 @@ __DEV__ &&
newChild.key
)),
(currentFirstChild.return = returnFiber),
(currentFirstChild._debugOwner = returnFiber),
(currentFirstChild._debugInfo = currentDebugInfo),
validateFragmentProps(
newChild,
@@ -3724,6 +3734,8 @@ __DEV__ &&
lanes
)),
(currentFirstChild.return = returnFiber),
(currentFirstChild._debugOwner = returnFiber),
(currentFirstChild._debugInfo = currentDebugInfo),
(returnFiber = currentFirstChild)),
placeSingleChild(returnFiber)
);
@@ -14467,7 +14479,7 @@ __DEV__ &&
_currentValue2: null,
_threadCount: 0
},
needsEscaping = /["'&<>\n\t]/,
needsEscaping = /["'&<>\n\t]|^\s|\s$/,
hydrationDiffRootDEV = null,
hydrationErrors = null,
concurrentQueues = [],
@@ -16377,14 +16389,14 @@ __DEV__ &&
scheduleRoot: scheduleRoot,
setRefreshHandler: setRefreshHandler,
getCurrentFiber: getCurrentFiberForDevTools,
reconcilerVersion: "19.0.0-www-modern-378b305958-20240710"
reconcilerVersion: "19.0.0-www-modern-2d3f81bb6a-20240710"
});
})({
findFiberByHostInstance: function () {
return null;
},
bundleType: 1,
version: "19.0.0-www-modern-378b305958-20240710",
version: "19.0.0-www-modern-2d3f81bb6a-20240710",
rendererPackageName: "react-art"
});
var ClippingRectangle = TYPES.CLIPPING_RECTANGLE,
@@ -10718,7 +10718,7 @@ var slice = Array.prototype.slice,
return null;
},
bundleType: 0,
version: "19.0.0-www-classic-378b305958-20240710",
version: "19.0.0-www-classic-2d3f81bb6a-20240710",
rendererPackageName: "react-art"
};
var internals$jscomp$inline_1386 = {
@@ -10749,7 +10749,7 @@ var internals$jscomp$inline_1386 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "19.0.0-www-classic-378b305958-20240710"
reconcilerVersion: "19.0.0-www-classic-2d3f81bb6a-20240710"
};
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
var hook$jscomp$inline_1387 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -10171,7 +10171,7 @@ var slice = Array.prototype.slice,
return null;
},
bundleType: 0,
version: "19.0.0-www-modern-378b305958-20240710",
version: "19.0.0-www-modern-2d3f81bb6a-20240710",
rendererPackageName: "react-art"
};
var internals$jscomp$inline_1372 = {
@@ -10202,7 +10202,7 @@ var internals$jscomp$inline_1372 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "19.0.0-www-modern-378b305958-20240710"
reconcilerVersion: "19.0.0-www-modern-2d3f81bb6a-20240710"
};
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
var hook$jscomp$inline_1373 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
File diff suppressed because it is too large Load Diff
File diff suppressed because it is too large Load Diff
@@ -17163,14 +17163,14 @@ function getCrossOriginStringAs(as, input) {
}
var isomorphicReactPackageVersion$jscomp$inline_1769 = React.version;
if (
"19.0.0-www-classic-378b305958-20240710" !==
"19.0.0-www-classic-2d3f81bb6a-20240710" !==
isomorphicReactPackageVersion$jscomp$inline_1769
)
throw Error(
formatProdErrorMessage(
527,
isomorphicReactPackageVersion$jscomp$inline_1769,
"19.0.0-www-classic-378b305958-20240710"
"19.0.0-www-classic-2d3f81bb6a-20240710"
)
);
function flushSyncFromReconciler(fn) {
@@ -17216,7 +17216,7 @@ Internals.Events = [
var devToolsConfig$jscomp$inline_1776 = {
findFiberByHostInstance: getClosestInstanceFromNode,
bundleType: 0,
version: "19.0.0-www-classic-378b305958-20240710",
version: "19.0.0-www-classic-2d3f81bb6a-20240710",
rendererPackageName: "react-dom"
};
var internals$jscomp$inline_2220 = {
@@ -17246,7 +17246,7 @@ var internals$jscomp$inline_2220 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "19.0.0-www-classic-378b305958-20240710"
reconcilerVersion: "19.0.0-www-classic-2d3f81bb6a-20240710"
};
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
var hook$jscomp$inline_2221 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -17710,4 +17710,4 @@ exports.useFormState = function (action, initialState, permalink) {
exports.useFormStatus = function () {
return ReactSharedInternals.H.useHostTransitionStatus();
};
exports.version = "19.0.0-www-classic-378b305958-20240710";
exports.version = "19.0.0-www-classic-2d3f81bb6a-20240710";
@@ -16478,14 +16478,14 @@ function getCrossOriginStringAs(as, input) {
}
var isomorphicReactPackageVersion$jscomp$inline_1740 = React.version;
if (
"19.0.0-www-modern-378b305958-20240710" !==
"19.0.0-www-modern-2d3f81bb6a-20240710" !==
isomorphicReactPackageVersion$jscomp$inline_1740
)
throw Error(
formatProdErrorMessage(
527,
isomorphicReactPackageVersion$jscomp$inline_1740,
"19.0.0-www-modern-378b305958-20240710"
"19.0.0-www-modern-2d3f81bb6a-20240710"
)
);
Internals.findDOMNode = function (componentOrElement) {
@@ -16504,7 +16504,7 @@ Internals.Events = [
var devToolsConfig$jscomp$inline_1742 = {
findFiberByHostInstance: getClosestInstanceFromNode,
bundleType: 0,
version: "19.0.0-www-modern-378b305958-20240710",
version: "19.0.0-www-modern-2d3f81bb6a-20240710",
rendererPackageName: "react-dom"
};
var internals$jscomp$inline_2211 = {
@@ -16534,7 +16534,7 @@ var internals$jscomp$inline_2211 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "19.0.0-www-modern-378b305958-20240710"
reconcilerVersion: "19.0.0-www-modern-2d3f81bb6a-20240710"
};
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
var hook$jscomp$inline_2212 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -16905,4 +16905,4 @@ exports.useFormState = function (action, initialState, permalink) {
exports.useFormStatus = function () {
return ReactSharedInternals.H.useHostTransitionStatus();
};
exports.version = "19.0.0-www-modern-378b305958-20240710";
exports.version = "19.0.0-www-modern-2d3f81bb6a-20240710";
@@ -17930,14 +17930,14 @@ function getCrossOriginStringAs(as, input) {
}
var isomorphicReactPackageVersion$jscomp$inline_1856 = React.version;
if (
"19.0.0-www-classic-378b305958-20240710" !==
"19.0.0-www-classic-2d3f81bb6a-20240710" !==
isomorphicReactPackageVersion$jscomp$inline_1856
)
throw Error(
formatProdErrorMessage(
527,
isomorphicReactPackageVersion$jscomp$inline_1856,
"19.0.0-www-classic-378b305958-20240710"
"19.0.0-www-classic-2d3f81bb6a-20240710"
)
);
function flushSyncFromReconciler(fn) {
@@ -17983,7 +17983,7 @@ Internals.Events = [
var devToolsConfig$jscomp$inline_1863 = {
findFiberByHostInstance: getClosestInstanceFromNode,
bundleType: 0,
version: "19.0.0-www-classic-378b305958-20240710",
version: "19.0.0-www-classic-2d3f81bb6a-20240710",
rendererPackageName: "react-dom"
};
(function (internals) {
@@ -18027,7 +18027,7 @@ var devToolsConfig$jscomp$inline_1863 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "19.0.0-www-classic-378b305958-20240710"
reconcilerVersion: "19.0.0-www-classic-2d3f81bb6a-20240710"
});
function ReactDOMRoot(internalRoot) {
this._internalRoot = internalRoot;
@@ -18478,7 +18478,7 @@ exports.useFormState = function (action, initialState, permalink) {
exports.useFormStatus = function () {
return ReactSharedInternals.H.useHostTransitionStatus();
};
exports.version = "19.0.0-www-classic-378b305958-20240710";
exports.version = "19.0.0-www-classic-2d3f81bb6a-20240710";
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
"function" ===
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
@@ -17228,14 +17228,14 @@ function getCrossOriginStringAs(as, input) {
}
var isomorphicReactPackageVersion$jscomp$inline_1827 = React.version;
if (
"19.0.0-www-modern-378b305958-20240710" !==
"19.0.0-www-modern-2d3f81bb6a-20240710" !==
isomorphicReactPackageVersion$jscomp$inline_1827
)
throw Error(
formatProdErrorMessage(
527,
isomorphicReactPackageVersion$jscomp$inline_1827,
"19.0.0-www-modern-378b305958-20240710"
"19.0.0-www-modern-2d3f81bb6a-20240710"
)
);
Internals.findDOMNode = function (componentOrElement) {
@@ -17254,7 +17254,7 @@ Internals.Events = [
var devToolsConfig$jscomp$inline_1829 = {
findFiberByHostInstance: getClosestInstanceFromNode,
bundleType: 0,
version: "19.0.0-www-modern-378b305958-20240710",
version: "19.0.0-www-modern-2d3f81bb6a-20240710",
rendererPackageName: "react-dom"
};
(function (internals) {
@@ -17298,7 +17298,7 @@ var devToolsConfig$jscomp$inline_1829 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "19.0.0-www-modern-378b305958-20240710"
reconcilerVersion: "19.0.0-www-modern-2d3f81bb6a-20240710"
});
function ReactDOMRoot(internalRoot) {
this._internalRoot = internalRoot;
@@ -17656,7 +17656,7 @@ exports.useFormState = function (action, initialState, permalink) {
exports.useFormStatus = function () {
return ReactSharedInternals.H.useHostTransitionStatus();
};
exports.version = "19.0.0-www-modern-378b305958-20240710";
exports.version = "19.0.0-www-modern-2d3f81bb6a-20240710";
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
"function" ===
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
@@ -8842,5 +8842,5 @@ __DEV__ &&
'The server used "renderToString" which does not support Suspense. If you intended for this Suspense boundary to render the fallback content on the server consider throwing an Error somewhere within the Suspense boundary. If you intended to have the server wait for the suspended component please switch to "renderToReadableStream" which supports Suspense on the server'
);
};
exports.version = "19.0.0-www-classic-378b305958-20240710";
exports.version = "19.0.0-www-classic-2d3f81bb6a-20240710";
})();
@@ -8671,5 +8671,5 @@ __DEV__ &&
'The server used "renderToString" which does not support Suspense. If you intended for this Suspense boundary to render the fallback content on the server consider throwing an Error somewhere within the Suspense boundary. If you intended to have the server wait for the suspended component please switch to "renderToReadableStream" which supports Suspense on the server'
);
};
exports.version = "19.0.0-www-modern-378b305958-20240710";
exports.version = "19.0.0-www-modern-2d3f81bb6a-20240710";
})();
@@ -5799,4 +5799,4 @@ exports.renderToString = function (children, options) {
'The server used "renderToString" which does not support Suspense. If you intended for this Suspense boundary to render the fallback content on the server consider throwing an Error somewhere within the Suspense boundary. If you intended to have the server wait for the suspended component please switch to "renderToReadableStream" which supports Suspense on the server'
);
};
exports.version = "19.0.0-www-classic-378b305958-20240710";
exports.version = "19.0.0-www-classic-2d3f81bb6a-20240710";
@@ -5722,4 +5722,4 @@ exports.renderToString = function (children, options) {
'The server used "renderToString" which does not support Suspense. If you intended for this Suspense boundary to render the fallback content on the server consider throwing an Error somewhere within the Suspense boundary. If you intended to have the server wait for the suspended component please switch to "renderToReadableStream" which supports Suspense on the server'
);
};
exports.version = "19.0.0-www-modern-378b305958-20240710";
exports.version = "19.0.0-www-modern-2d3f81bb6a-20240710";
File diff suppressed because it is too large Load Diff
File diff suppressed because it is too large Load Diff
@@ -17492,14 +17492,14 @@ function getCrossOriginStringAs(as, input) {
}
var isomorphicReactPackageVersion$jscomp$inline_1799 = React.version;
if (
"19.0.0-www-classic-378b305958-20240710" !==
"19.0.0-www-classic-2d3f81bb6a-20240710" !==
isomorphicReactPackageVersion$jscomp$inline_1799
)
throw Error(
formatProdErrorMessage(
527,
isomorphicReactPackageVersion$jscomp$inline_1799,
"19.0.0-www-classic-378b305958-20240710"
"19.0.0-www-classic-2d3f81bb6a-20240710"
)
);
function flushSyncFromReconciler(fn) {
@@ -17545,7 +17545,7 @@ Internals.Events = [
var devToolsConfig$jscomp$inline_1806 = {
findFiberByHostInstance: getClosestInstanceFromNode,
bundleType: 0,
version: "19.0.0-www-classic-378b305958-20240710",
version: "19.0.0-www-classic-2d3f81bb6a-20240710",
rendererPackageName: "react-dom"
};
var internals$jscomp$inline_2255 = {
@@ -17575,7 +17575,7 @@ var internals$jscomp$inline_2255 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "19.0.0-www-classic-378b305958-20240710"
reconcilerVersion: "19.0.0-www-classic-2d3f81bb6a-20240710"
};
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
var hook$jscomp$inline_2256 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -18190,4 +18190,4 @@ exports.useFormState = function (action, initialState, permalink) {
exports.useFormStatus = function () {
return ReactSharedInternals.H.useHostTransitionStatus();
};
exports.version = "19.0.0-www-classic-378b305958-20240710";
exports.version = "19.0.0-www-classic-2d3f81bb6a-20240710";
@@ -16866,14 +16866,14 @@ function getCrossOriginStringAs(as, input) {
}
var isomorphicReactPackageVersion$jscomp$inline_1770 = React.version;
if (
"19.0.0-www-modern-378b305958-20240710" !==
"19.0.0-www-modern-2d3f81bb6a-20240710" !==
isomorphicReactPackageVersion$jscomp$inline_1770
)
throw Error(
formatProdErrorMessage(
527,
isomorphicReactPackageVersion$jscomp$inline_1770,
"19.0.0-www-modern-378b305958-20240710"
"19.0.0-www-modern-2d3f81bb6a-20240710"
)
);
Internals.findDOMNode = function (componentOrElement) {
@@ -16892,7 +16892,7 @@ Internals.Events = [
var devToolsConfig$jscomp$inline_1772 = {
findFiberByHostInstance: getClosestInstanceFromNode,
bundleType: 0,
version: "19.0.0-www-modern-378b305958-20240710",
version: "19.0.0-www-modern-2d3f81bb6a-20240710",
rendererPackageName: "react-dom"
};
var internals$jscomp$inline_2246 = {
@@ -16922,7 +16922,7 @@ var internals$jscomp$inline_2246 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "19.0.0-www-modern-378b305958-20240710"
reconcilerVersion: "19.0.0-www-modern-2d3f81bb6a-20240710"
};
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
var hook$jscomp$inline_2247 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -17444,4 +17444,4 @@ exports.useFormState = function (action, initialState, permalink) {
exports.useFormStatus = function () {
return ReactSharedInternals.H.useHostTransitionStatus();
};
exports.version = "19.0.0-www-modern-378b305958-20240710";
exports.version = "19.0.0-www-modern-2d3f81bb6a-20240710";
@@ -1853,7 +1853,10 @@ __DEV__ &&
"number" === typeof clientProps ||
"bigint" === typeof clientProps
)
content += describeTextDiff("" + clientProps, void 0, indent + 1);
content =
null == type
? content + describeTextDiff("" + clientProps, null, indent + 1)
: content + describeTextDiff("" + clientProps, void 0, indent + 1);
return content;
}
function describeSiblingFiber(fiber, indent) {
@@ -1889,7 +1892,7 @@ __DEV__ &&
debugInfo = "";
i = node.fiber.pendingProps;
if (6 === node.fiber.tag)
debugInfo = describeTextDiff(i, node.serverProps, indent);
(debugInfo = describeTextDiff(i, node.serverProps, indent)), indent++;
else if (
((serverComponentName = describeFiberType(node.fiber)),
null !== serverComponentName)
@@ -1917,11 +1920,12 @@ __DEV__ &&
indent++;
} else
null === node.serverProps
? (debugInfo = describeExpandedElement(
? ((debugInfo = describeExpandedElement(
serverComponentName,
i,
added(indent)
))
)),
indent++)
: "string" === typeof node.serverProps
? error$jscomp$0(
"Should not have matched a non HostText fiber to a Text node. This is a bug in React."
@@ -1949,9 +1953,10 @@ __DEV__ &&
i &&
0 < node.children.length &&
(propName += indentation(indent) + "...\n");
node = node.serverTail;
for (i = 0; i < node.length; i++)
(serverComponentName = node[i]),
i = node.serverTail;
null === node.serverProps && indent--;
for (node = 0; node < i.length; node++)
(serverComponentName = i[node]),
(propName =
"string" === typeof serverComponentName
? propName +
@@ -3028,6 +3033,7 @@ __DEV__ &&
lanes
)),
(current.return = returnFiber),
(current._debugOwner = returnFiber),
(current._debugInfo = currentDebugInfo),
current
);
@@ -3101,6 +3107,7 @@ __DEV__ &&
key
)),
(current.return = returnFiber),
(current._debugOwner = returnFiber),
(current._debugInfo = currentDebugInfo),
current
);
@@ -3122,6 +3129,7 @@ __DEV__ &&
lanes
)),
(newChild.return = returnFiber),
(newChild._debugOwner = returnFiber),
(newChild._debugInfo = currentDebugInfo),
newChild
);
@@ -3168,6 +3176,7 @@ __DEV__ &&
null
)),
(lanes.return = returnFiber),
(lanes._debugOwner = returnFiber),
(returnFiber = pushDebugInfo(newChild._debugInfo)),
(lanes._debugInfo = currentDebugInfo),
(currentDebugInfo = returnFiber),
@@ -3708,6 +3717,7 @@ __DEV__ &&
newChild.key
)),
(currentFirstChild.return = returnFiber),
(currentFirstChild._debugOwner = returnFiber),
(currentFirstChild._debugInfo = currentDebugInfo),
validateFragmentProps(
newChild,
@@ -3879,6 +3889,8 @@ __DEV__ &&
lanes
)),
(currentFirstChild.return = returnFiber),
(currentFirstChild._debugOwner = returnFiber),
(currentFirstChild._debugInfo = currentDebugInfo),
(returnFiber = currentFirstChild)),
placeSingleChild(returnFiber)
);
@@ -16725,7 +16737,7 @@ __DEV__ &&
_currentValue2: null,
_threadCount: 0
},
needsEscaping = /["'&<>\n\t]/,
needsEscaping = /["'&<>\n\t]|^\s|\s$/,
hydrationParentFiber = null,
nextHydratableInstance = null,
isHydrating = !1,
@@ -19046,7 +19058,7 @@ __DEV__ &&
scheduleRoot: scheduleRoot,
setRefreshHandler: setRefreshHandler,
getCurrentFiber: getCurrentFiberForDevTools,
reconcilerVersion: "19.0.0-www-classic-378b305958-20240710"
reconcilerVersion: "19.0.0-www-classic-2d3f81bb6a-20240710"
});
};
exports.isAlreadyRendering = function () {
@@ -1756,7 +1756,10 @@ __DEV__ &&
"number" === typeof clientProps ||
"bigint" === typeof clientProps
)
content += describeTextDiff("" + clientProps, void 0, indent + 1);
content =
null == type
? content + describeTextDiff("" + clientProps, null, indent + 1)
: content + describeTextDiff("" + clientProps, void 0, indent + 1);
return content;
}
function describeSiblingFiber(fiber, indent) {
@@ -1792,7 +1795,7 @@ __DEV__ &&
debugInfo = "";
i = node.fiber.pendingProps;
if (6 === node.fiber.tag)
debugInfo = describeTextDiff(i, node.serverProps, indent);
(debugInfo = describeTextDiff(i, node.serverProps, indent)), indent++;
else if (
((serverComponentName = describeFiberType(node.fiber)),
null !== serverComponentName)
@@ -1820,11 +1823,12 @@ __DEV__ &&
indent++;
} else
null === node.serverProps
? (debugInfo = describeExpandedElement(
? ((debugInfo = describeExpandedElement(
serverComponentName,
i,
added(indent)
))
)),
indent++)
: "string" === typeof node.serverProps
? error$jscomp$0(
"Should not have matched a non HostText fiber to a Text node. This is a bug in React."
@@ -1852,9 +1856,10 @@ __DEV__ &&
i &&
0 < node.children.length &&
(propName += indentation(indent) + "...\n");
node = node.serverTail;
for (i = 0; i < node.length; i++)
(serverComponentName = node[i]),
i = node.serverTail;
null === node.serverProps && indent--;
for (node = 0; node < i.length; node++)
(serverComponentName = i[node]),
(propName =
"string" === typeof serverComponentName
? propName +
@@ -2927,6 +2932,7 @@ __DEV__ &&
lanes
)),
(current.return = returnFiber),
(current._debugOwner = returnFiber),
(current._debugInfo = currentDebugInfo),
current
);
@@ -3000,6 +3006,7 @@ __DEV__ &&
key
)),
(current.return = returnFiber),
(current._debugOwner = returnFiber),
(current._debugInfo = currentDebugInfo),
current
);
@@ -3021,6 +3028,7 @@ __DEV__ &&
lanes
)),
(newChild.return = returnFiber),
(newChild._debugOwner = returnFiber),
(newChild._debugInfo = currentDebugInfo),
newChild
);
@@ -3067,6 +3075,7 @@ __DEV__ &&
null
)),
(lanes.return = returnFiber),
(lanes._debugOwner = returnFiber),
(returnFiber = pushDebugInfo(newChild._debugInfo)),
(lanes._debugInfo = currentDebugInfo),
(currentDebugInfo = returnFiber),
@@ -3607,6 +3616,7 @@ __DEV__ &&
newChild.key
)),
(currentFirstChild.return = returnFiber),
(currentFirstChild._debugOwner = returnFiber),
(currentFirstChild._debugInfo = currentDebugInfo),
validateFragmentProps(
newChild,
@@ -3778,6 +3788,8 @@ __DEV__ &&
lanes
)),
(currentFirstChild.return = returnFiber),
(currentFirstChild._debugOwner = returnFiber),
(currentFirstChild._debugInfo = currentDebugInfo),
(returnFiber = currentFirstChild)),
placeSingleChild(returnFiber)
);
@@ -16103,7 +16115,7 @@ __DEV__ &&
_currentValue2: null,
_threadCount: 0
},
needsEscaping = /["'&<>\n\t]/,
needsEscaping = /["'&<>\n\t]|^\s|\s$/,
hydrationParentFiber = null,
nextHydratableInstance = null,
isHydrating = !1,
@@ -18410,7 +18422,7 @@ __DEV__ &&
scheduleRoot: scheduleRoot,
setRefreshHandler: setRefreshHandler,
getCurrentFiber: getCurrentFiberForDevTools,
reconcilerVersion: "19.0.0-www-modern-378b305958-20240710"
reconcilerVersion: "19.0.0-www-modern-2d3f81bb6a-20240710"
});
};
exports.isAlreadyRendering = function () {
@@ -12705,7 +12705,7 @@ module.exports = function ($$$config) {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "19.0.0-www-classic-378b305958-20240710"
reconcilerVersion: "19.0.0-www-classic-2d3f81bb6a-20240710"
};
if ("undefined" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__)
devToolsConfig = !1;
@@ -12197,7 +12197,7 @@ module.exports = function ($$$config) {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
reconcilerVersion: "19.0.0-www-modern-378b305958-20240710"
reconcilerVersion: "19.0.0-www-modern-2d3f81bb6a-20240710"
};
if ("undefined" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__)
devToolsConfig = !1;
@@ -1572,7 +1572,10 @@ __DEV__ &&
"number" === typeof clientProps ||
"bigint" === typeof clientProps
)
content += describeTextDiff("" + clientProps, void 0, indent + 1);
content =
null == type
? content + describeTextDiff("" + clientProps, null, indent + 1)
: content + describeTextDiff("" + clientProps, void 0, indent + 1);
return content;
}
function describeSiblingFiber(fiber, indent) {
@@ -1608,7 +1611,7 @@ __DEV__ &&
debugInfo = "";
i = node.fiber.pendingProps;
if (6 === node.fiber.tag)
debugInfo = describeTextDiff(i, node.serverProps, indent);
(debugInfo = describeTextDiff(i, node.serverProps, indent)), indent++;
else if (
((serverComponentName = describeFiberType(node.fiber)),
null !== serverComponentName)
@@ -1636,11 +1639,12 @@ __DEV__ &&
indent++;
} else
null === node.serverProps
? (debugInfo = describeExpandedElement(
? ((debugInfo = describeExpandedElement(
serverComponentName,
i,
added(indent)
))
)),
indent++)
: "string" === typeof node.serverProps
? error$jscomp$0(
"Should not have matched a non HostText fiber to a Text node. This is a bug in React."
@@ -1668,9 +1672,10 @@ __DEV__ &&
i &&
0 < node.children.length &&
(propName += indentation(indent) + "...\n");
node = node.serverTail;
for (i = 0; i < node.length; i++)
(serverComponentName = node[i]),
i = node.serverTail;
null === node.serverProps && indent--;
for (node = 0; node < i.length; node++)
(serverComponentName = i[node]),
(propName =
"string" === typeof serverComponentName
? propName +
@@ -2544,6 +2549,7 @@ __DEV__ &&
lanes
)),
(current.return = returnFiber),
(current._debugOwner = returnFiber),
(current._debugInfo = currentDebugInfo),
current
);
@@ -2617,6 +2623,7 @@ __DEV__ &&
key
)),
(current.return = returnFiber),
(current._debugOwner = returnFiber),
(current._debugInfo = currentDebugInfo),
current
);
@@ -2638,6 +2645,7 @@ __DEV__ &&
lanes
)),
(newChild.return = returnFiber),
(newChild._debugOwner = returnFiber),
(newChild._debugInfo = currentDebugInfo),
newChild
);
@@ -2684,6 +2692,7 @@ __DEV__ &&
null
)),
(lanes.return = returnFiber),
(lanes._debugOwner = returnFiber),
(returnFiber = pushDebugInfo(newChild._debugInfo)),
(lanes._debugInfo = currentDebugInfo),
(currentDebugInfo = returnFiber),
@@ -3216,6 +3225,7 @@ __DEV__ &&
newChild.key
)),
(currentFirstChild.return = returnFiber),
(currentFirstChild._debugOwner = returnFiber),
(currentFirstChild._debugInfo = currentDebugInfo),
validateFragmentProps(
newChild,
@@ -3387,6 +3397,8 @@ __DEV__ &&
lanes
)),
(currentFirstChild.return = returnFiber),
(currentFirstChild._debugOwner = returnFiber),
(currentFirstChild._debugInfo = currentDebugInfo),
(returnFiber = currentFirstChild)),
placeSingleChild(returnFiber)
);
@@ -12959,7 +12971,7 @@ __DEV__ &&
_currentValue2: null,
_threadCount: 0
},
needsEscaping = /["'&<>\n\t]/,
needsEscaping = /["'&<>\n\t]|^\s|\s$/,
hydrationDiffRootDEV = null,
hydrationErrors = null,
concurrentQueues = [],
@@ -14792,14 +14804,14 @@ __DEV__ &&
scheduleRoot: scheduleRoot,
setRefreshHandler: setRefreshHandler,
getCurrentFiber: getCurrentFiberForDevTools,
reconcilerVersion: "19.0.0-www-classic-378b305958-20240710"
reconcilerVersion: "19.0.0-www-classic-2d3f81bb6a-20240710"
});
})({
findFiberByHostInstance: function () {
throw Error("TestRenderer does not support findFiberByHostInstance()");
},
bundleType: 1,
version: "19.0.0-www-classic-378b305958-20240710",
version: "19.0.0-www-classic-2d3f81bb6a-20240710",
rendererPackageName: "react-test-renderer"
});
exports._Scheduler = Scheduler;
@@ -1572,7 +1572,10 @@ __DEV__ &&
"number" === typeof clientProps ||
"bigint" === typeof clientProps
)
content += describeTextDiff("" + clientProps, void 0, indent + 1);
content =
null == type
? content + describeTextDiff("" + clientProps, null, indent + 1)
: content + describeTextDiff("" + clientProps, void 0, indent + 1);
return content;
}
function describeSiblingFiber(fiber, indent) {
@@ -1608,7 +1611,7 @@ __DEV__ &&
debugInfo = "";
i = node.fiber.pendingProps;
if (6 === node.fiber.tag)
debugInfo = describeTextDiff(i, node.serverProps, indent);
(debugInfo = describeTextDiff(i, node.serverProps, indent)), indent++;
else if (
((serverComponentName = describeFiberType(node.fiber)),
null !== serverComponentName)
@@ -1636,11 +1639,12 @@ __DEV__ &&
indent++;
} else
null === node.serverProps
? (debugInfo = describeExpandedElement(
? ((debugInfo = describeExpandedElement(
serverComponentName,
i,
added(indent)
))
)),
indent++)
: "string" === typeof node.serverProps
? error$jscomp$0(
"Should not have matched a non HostText fiber to a Text node. This is a bug in React."
@@ -1668,9 +1672,10 @@ __DEV__ &&
i &&
0 < node.children.length &&
(propName += indentation(indent) + "...\n");
node = node.serverTail;
for (i = 0; i < node.length; i++)
(serverComponentName = node[i]),
i = node.serverTail;
null === node.serverProps && indent--;
for (node = 0; node < i.length; node++)
(serverComponentName = i[node]),
(propName =
"string" === typeof serverComponentName
? propName +
@@ -2544,6 +2549,7 @@ __DEV__ &&
lanes
)),
(current.return = returnFiber),
(current._debugOwner = returnFiber),
(current._debugInfo = currentDebugInfo),
current
);
@@ -2617,6 +2623,7 @@ __DEV__ &&
key
)),
(current.return = returnFiber),
(current._debugOwner = returnFiber),
(current._debugInfo = currentDebugInfo),
current
);
@@ -2638,6 +2645,7 @@ __DEV__ &&
lanes
)),
(newChild.return = returnFiber),
(newChild._debugOwner = returnFiber),
(newChild._debugInfo = currentDebugInfo),
newChild
);
@@ -2684,6 +2692,7 @@ __DEV__ &&
null
)),
(lanes.return = returnFiber),
(lanes._debugOwner = returnFiber),
(returnFiber = pushDebugInfo(newChild._debugInfo)),
(lanes._debugInfo = currentDebugInfo),
(currentDebugInfo = returnFiber),
@@ -3216,6 +3225,7 @@ __DEV__ &&
newChild.key
)),
(currentFirstChild.return = returnFiber),
(currentFirstChild._debugOwner = returnFiber),
(currentFirstChild._debugInfo = currentDebugInfo),
validateFragmentProps(
newChild,
@@ -3387,6 +3397,8 @@ __DEV__ &&
lanes
)),
(currentFirstChild.return = returnFiber),
(currentFirstChild._debugOwner = returnFiber),
(currentFirstChild._debugInfo = currentDebugInfo),
(returnFiber = currentFirstChild)),
placeSingleChild(returnFiber)
);
@@ -12959,7 +12971,7 @@ __DEV__ &&
_currentValue2: null,
_threadCount: 0
},
needsEscaping = /["'&<>\n\t]/,
needsEscaping = /["'&<>\n\t]|^\s|\s$/,
hydrationDiffRootDEV = null,
hydrationErrors = null,
concurrentQueues = [],
@@ -14792,14 +14804,14 @@ __DEV__ &&
scheduleRoot: scheduleRoot,
setRefreshHandler: setRefreshHandler,
getCurrentFiber: getCurrentFiberForDevTools,
reconcilerVersion: "19.0.0-www-modern-378b305958-20240710"
reconcilerVersion: "19.0.0-www-modern-2d3f81bb6a-20240710"
});
})({
findFiberByHostInstance: function () {
throw Error("TestRenderer does not support findFiberByHostInstance()");
},
bundleType: 1,
version: "19.0.0-www-modern-378b305958-20240710",
version: "19.0.0-www-modern-2d3f81bb6a-20240710",
rendererPackageName: "react-test-renderer"
});
exports._Scheduler = Scheduler;
+1 -1
View File
@@ -1 +1 @@
19.0.0-www-classic-378b305958-20240710
19.0.0-www-classic-2d3f81bb6a-20240710
+1 -1
View File
@@ -1 +1 @@
19.0.0-www-modern-378b305958-20240710
19.0.0-www-modern-2d3f81bb6a-20240710
@@ -68,6 +68,7 @@ export default [
"%s: getSnapshotBeforeUpdate() is defined as a static method and will be ignored. Instead, declare it as an instance method.",
"%s: getSnapshotBeforeUpdate() should be used with componentDidUpdate(). This component defines getSnapshotBeforeUpdate() only.",
"<%s /> is using incorrect casing. Use PascalCase for React components, or lowercase for HTML elements.",
"<%s> cannot contain a nested %s.\nSee this log for the ancestor stack trace.",
"<SuspenseList tail=\"%s\" /> is only valid if revealOrder is \"forwards\" or \"backwards\". Did you mean to specify revealOrder=\"forwards\"?",
"A button can only specify a formAction along with type=\"submit\" or no type.",
"A cache instance was released after it was already freed. This likely indicates a bug in React.",
@@ -169,6 +170,10 @@ export default [
"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.",
"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>",
"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)",
"In HTML, %s cannot be a child of <%s>.%s\nThis will cause a hydration error.%s",
"In HTML, %s cannot be a descendant of <%s>.\nThis will cause a hydration error.%s",
"In HTML, text nodes cannot be a child of <%s>.\nThis will cause a hydration error.%s",
"In HTML, whitespace text nodes cannot be a child of <%s>. Make sure you don't have any extra whitespace between tags on each line of your source code.\nThis will cause a hydration error.%s",
"Injected module is missing getNodeFromInstance or getInstanceFromNode.",
"Internal React Error: React expected bootstrap script or module with src \"%s\" to not have been preloaded already. please file an issue",
"Internal React error: A listener was unexpectedly attached to a \"noop\" thenable. This is a bug in React. Please file an issue.",