Skip to content

Commit 43adf5d

Browse files
committed
[Fiber] Use Owner/JSX Stack When Appending Stacks to Console (#29206)
This one should be fully behind the `enableOwnerStacks` flag. Instead of printing the parent Component stack all the way to the root, this now prints the owner stack of every JSX callsite. It also includes intermediate callsites between the Component and the JSX call so it has potentially more frames. Mainly it provides the line number of the JSX callsite. In terms of the number of components is a subset of the parent component stack so it's less information in that regard. This is usually better since it's more focused on components that might affect the output but if it's contextual based on rendering it's still good to have parent stack. Therefore, I still use the parent stack when printing DOM nesting warnings but I plan on switching that format to a diff view format instead (Next.js already reformats the parent stack like this). __Follow ups__ - Server Components show up in the owner stack for client logs but logs done by Server Components don't yet get their owner stack printed as they're replayed. They're also not yet printed in the server logs of the RSC server. - Server Component stack frames are formatted as the server and added to the end but this might be a different format than the browser. E.g. if server is running V8 and browser is running JSC or vice versa. Ideally we can reformat them in terms of the client formatting. - This doesn't yet update Fizz or DevTools. Those will be follow ups. Fizz still prints parent stacks in the server side logs. The stacks added to user space `console.error` calls by DevTools still get the parent stacks instead. - It also doesn't yet expose these to user space so there's no way to get them inside `onCaughtError` for example or inside a custom `console.error` override. - In another follow up I'll use `console.createTask` instead and completely remove these stacks if it's available. DiffTrain build for commit d6cfa0f.
1 parent fc578ff commit 43adf5d

File tree

13 files changed

+318
-167
lines changed

13 files changed

+318
-167
lines changed

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

Lines changed: 79 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<8b9b9798442c5728adfabb7cd8ca5f24>>
10+
* @generated SignedSource<<955b120cad9193034a86d0bde3df7d2a>>
1111
*/
1212

1313
'use strict';
@@ -949,6 +949,32 @@ function describeFunctionComponentFrame(fn) {
949949
}
950950
}
951951

952+
// TODO: Consider marking the whole bundle instead of these boundaries.
953+
954+
/** @noinline */
955+
956+
function callComponentInDEV(Component, props, secondArg) {
957+
setIsRendering(true);
958+
var result = Component(props, secondArg);
959+
setIsRendering(false);
960+
return result;
961+
}
962+
/** @noinline */
963+
964+
function callRenderInDEV(instance) {
965+
setIsRendering(true);
966+
var result = instance.render();
967+
setIsRendering(false);
968+
return result;
969+
}
970+
/** @noinline */
971+
972+
function callLazyInitInDEV(lazy) {
973+
var payload = lazy._payload;
974+
var init = lazy._init;
975+
return init(payload);
976+
}
977+
952978
function describeFiber(fiber) {
953979
switch (fiber.tag) {
954980
case HostHoistable:
@@ -1021,8 +1047,6 @@ function getCurrentFiberStackInDev() {
10211047
if (current === null) {
10221048
return '';
10231049
} // Safe because if current fiber exists, we are reconciling,
1024-
// and it is guaranteed to be the work-in-progress version.
1025-
10261050

10271051
return getStackByFiberInDevAndProd(current);
10281052
}
@@ -5812,9 +5836,9 @@ function warnOnSymbolType(returnFiber, invalidChild) {
58125836
}
58135837

58145838
function resolveLazy(lazyType) {
5815-
var payload = lazyType._payload;
5816-
var init = lazyType._init;
5817-
return init(payload);
5839+
{
5840+
return callLazyInitInDEV(lazyType);
5841+
}
58185842
} // This wrapper function exists because I expect to clone the code in each path
58195843
// to be able to optimize each path individually by branching early. This needs
58205844
// a compiler or we can do it manually. Helpers that don't need this branching
@@ -6086,9 +6110,13 @@ function createChildReconciler(shouldTrackSideEffects) {
60866110

60876111
case REACT_LAZY_TYPE:
60886112
{
6089-
var payload = newChild._payload;
6090-
var init = newChild._init;
6091-
return createChild(returnFiber, init(payload), lanes, mergeDebugInfo(debugInfo, newChild._debugInfo) // call merge after init
6113+
var resolvedChild;
6114+
6115+
{
6116+
resolvedChild = callLazyInitInDEV(newChild);
6117+
}
6118+
6119+
return createChild(returnFiber, resolvedChild, lanes, mergeDebugInfo(debugInfo, newChild._debugInfo) // call merge after init
60926120
);
60936121
}
60946122
}
@@ -6172,9 +6200,13 @@ function createChildReconciler(shouldTrackSideEffects) {
61726200

61736201
case REACT_LAZY_TYPE:
61746202
{
6175-
var payload = newChild._payload;
6176-
var init = newChild._init;
6177-
return updateSlot(returnFiber, oldFiber, init(payload), lanes, mergeDebugInfo(debugInfo, newChild._debugInfo));
6203+
var resolvedChild;
6204+
6205+
{
6206+
resolvedChild = callLazyInitInDEV(newChild);
6207+
}
6208+
6209+
return updateSlot(returnFiber, oldFiber, resolvedChild, lanes, mergeDebugInfo(debugInfo, newChild._debugInfo));
61786210
}
61796211
}
61806212

@@ -6241,9 +6273,15 @@ function createChildReconciler(shouldTrackSideEffects) {
62416273
}
62426274

62436275
case REACT_LAZY_TYPE:
6244-
var payload = newChild._payload;
6245-
var init = newChild._init;
6246-
return updateFromMap(existingChildren, returnFiber, newIdx, init(payload), lanes, mergeDebugInfo(debugInfo, newChild._debugInfo));
6276+
{
6277+
var resolvedChild;
6278+
6279+
{
6280+
resolvedChild = callLazyInitInDEV(newChild);
6281+
}
6282+
6283+
return updateFromMap(existingChildren, returnFiber, newIdx, resolvedChild, lanes, mergeDebugInfo(debugInfo, newChild._debugInfo));
6284+
}
62476285
}
62486286

62496287
if (isArray(newChild) || getIteratorFn(newChild) || enableAsyncIterableChildren ) {
@@ -6317,10 +6355,16 @@ function createChildReconciler(shouldTrackSideEffects) {
63176355
break;
63186356

63196357
case REACT_LAZY_TYPE:
6320-
var payload = child._payload;
6321-
var init = child._init;
6322-
warnOnInvalidKey(init(payload), knownKeys, returnFiber);
6323-
break;
6358+
{
6359+
var resolvedChild;
6360+
6361+
{
6362+
resolvedChild = callLazyInitInDEV(child);
6363+
}
6364+
6365+
warnOnInvalidKey(resolvedChild, knownKeys, returnFiber);
6366+
break;
6367+
}
63246368
}
63256369
}
63266370

@@ -7444,7 +7488,7 @@ function renderWithHooks(current, workInProgress, Component, props, secondArg, n
74447488

74457489
var shouldDoubleRenderDEV = debugRenderPhaseSideEffectsForStrictMode ;
74467490
shouldDoubleInvokeUserFnsInHooksDEV = shouldDoubleRenderDEV;
7447-
var children = Component(props, secondArg);
7491+
var children = callComponentInDEV(Component, props, secondArg) ;
74487492
shouldDoubleInvokeUserFnsInHooksDEV = false; // Check if there was a render phase update
74497493

74507494
if (didScheduleRenderPhaseUpdateDuringThisPass) {
@@ -7584,7 +7628,7 @@ function renderWithHooksAgain(workInProgress, Component, props, secondArg) {
75847628
}
75857629

75867630
ReactSharedInternals.H = HooksDispatcherOnRerenderInDEV ;
7587-
children = Component(props, secondArg);
7631+
children = callComponentInDEV(Component, props, secondArg) ;
75887632
} while (didScheduleRenderPhaseUpdateDuringThisPass);
75897633

75907634
return children;
@@ -12300,9 +12344,7 @@ function updateForwardRef(current, workInProgress, Component, nextProps, renderL
1230012344
}
1230112345

1230212346
{
12303-
setIsRendering(true);
1230412347
nextChildren = renderWithHooks(current, workInProgress, render, propsWithoutRef, ref, renderLanes);
12305-
setIsRendering(false);
1230612348
}
1230712349

1230812350
{
@@ -12769,9 +12811,7 @@ function updateFunctionComponent(current, workInProgress, Component, nextProps,
1276912811
}
1277012812

1277112813
{
12772-
setIsRendering(true);
1277312814
nextChildren = renderWithHooks(current, workInProgress, Component, nextProps, context, renderLanes);
12774-
setIsRendering(false);
1277512815
}
1277612816

1277712817
{
@@ -12942,10 +12982,7 @@ function finishClassComponent(current, workInProgress, Component, shouldUpdate,
1294212982
}
1294312983

1294412984
{
12945-
setIsRendering(true);
12946-
nextChildren = instance.render();
12947-
12948-
setIsRendering(false);
12985+
nextChildren = callRenderInDEV(instance);
1294912986
}
1295012987

1295112988
{
@@ -13106,9 +13143,12 @@ function mountLazyComponent(_current, workInProgress, elementType, renderLanes)
1310613143
resetSuspendedCurrentOnMountInLegacyMode(_current, workInProgress);
1310713144
var props = workInProgress.pendingProps;
1310813145
var lazyComponent = elementType;
13109-
var payload = lazyComponent._payload;
13110-
var init = lazyComponent._init;
13111-
var Component = init(payload); // Store the unwrapped component in the type.
13146+
var Component;
13147+
13148+
{
13149+
Component = callLazyInitInDEV(lazyComponent);
13150+
} // Store the unwrapped component in the type.
13151+
1311213152

1311313153
workInProgress.type = Component;
1311413154

@@ -14216,9 +14256,7 @@ function updateContextConsumer(current, workInProgress, renderLanes) {
1421614256
var newChildren;
1421714257

1421814258
{
14219-
setIsRendering(true);
14220-
newChildren = render(newValue);
14221-
setIsRendering(false);
14259+
newChildren = callComponentInDEV(render, newValue, undefined);
1422214260
}
1422314261

1422414262
{
@@ -14558,7 +14596,9 @@ function beginWork(current, workInProgress, renderLanes) {
1455814596
{
1455914597
if (workInProgress._debugNeedsRemount && current !== null) {
1456014598
// This will restart the begin phase with a new fiber.
14561-
return remountFiber(current, workInProgress, createFiberFromTypeAndProps(workInProgress.type, workInProgress.key, workInProgress.pendingProps, workInProgress._debugOwner || null, workInProgress.mode, workInProgress.lanes));
14599+
var copiedFiber = createFiberFromTypeAndProps(workInProgress.type, workInProgress.key, workInProgress.pendingProps, workInProgress._debugOwner || null, workInProgress.mode, workInProgress.lanes);
14600+
14601+
return remountFiber(current, workInProgress, copiedFiber);
1456214602
}
1456314603
}
1456414604

@@ -22900,6 +22940,7 @@ function FiberNode(tag, pendingProps, key, mode) {
2290022940
// This isn't directly used but is handy for debugging internals:
2290122941
this._debugInfo = null;
2290222942
this._debugOwner = null;
22943+
2290322944
this._debugNeedsRemount = false;
2290422945
this._debugHookTypes = null;
2290522946

@@ -22956,6 +22997,7 @@ function createWorkInProgress(current, pendingProps) {
2295622997
{
2295722998
// DEV-only fields
2295822999
workInProgress._debugOwner = current._debugOwner;
23000+
2295923001
workInProgress._debugHookTypes = current._debugHookTypes;
2296023002
}
2296123003

@@ -23463,7 +23505,7 @@ identifierPrefix, onUncaughtError, onCaughtError, onRecoverableError, transition
2346323505
return root;
2346423506
}
2346523507

23466-
var ReactVersion = '19.0.0-rc-5a18a922';
23508+
var ReactVersion = '19.0.0-rc-999503d6';
2346723509

2346823510
/*
2346923511
* The `'' + value` pattern (used in perf-sensitive code) throws for Symbol

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

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<e0bd67bfbe6ced8b6e410eb3974b80d7>>
10+
* @generated SignedSource<<e2dd990512e58f23e127175cf13f6c55>>
1111
*/
1212

1313
"use strict";
@@ -1723,7 +1723,8 @@ function createChildReconciler(shouldTrackSideEffects) {
17231723
);
17241724
case REACT_LAZY_TYPE:
17251725
var init = newChild._init;
1726-
return createChild(returnFiber, init(newChild._payload), lanes);
1726+
newChild = init(newChild._payload);
1727+
return createChild(returnFiber, newChild, lanes);
17271728
}
17281729
if (isArrayImpl(newChild) || getIteratorFn(newChild))
17291730
return (
@@ -1771,7 +1772,8 @@ function createChildReconciler(shouldTrackSideEffects) {
17711772
case REACT_LAZY_TYPE:
17721773
return (
17731774
(key = newChild._init),
1774-
updateSlot(returnFiber, oldFiber, key(newChild._payload), lanes)
1775+
(newChild = key(newChild._payload)),
1776+
updateSlot(returnFiber, oldFiber, newChild, lanes)
17751777
);
17761778
}
17771779
if (isArrayImpl(newChild) || getIteratorFn(newChild))
@@ -1832,11 +1834,12 @@ function createChildReconciler(shouldTrackSideEffects) {
18321834
);
18331835
case REACT_LAZY_TYPE:
18341836
var init = newChild._init;
1837+
newChild = init(newChild._payload);
18351838
return updateFromMap(
18361839
existingChildren,
18371840
returnFiber,
18381841
newIdx,
1839-
init(newChild._payload),
1842+
newChild,
18401843
lanes
18411844
);
18421845
}
@@ -9300,7 +9303,7 @@ var devToolsConfig$jscomp$inline_1042 = {
93009303
throw Error("TestRenderer does not support findFiberByHostInstance()");
93019304
},
93029305
bundleType: 0,
9303-
version: "19.0.0-rc-9c2862e7",
9306+
version: "19.0.0-rc-c9fc27c4",
93049307
rendererPackageName: "react-test-renderer"
93059308
};
93069309
var internals$jscomp$inline_1229 = {
@@ -9331,7 +9334,7 @@ var internals$jscomp$inline_1229 = {
93319334
scheduleRoot: null,
93329335
setRefreshHandler: null,
93339336
getCurrentFiber: null,
9334-
reconcilerVersion: "19.0.0-rc-9c2862e7"
9337+
reconcilerVersion: "19.0.0-rc-c9fc27c4"
93359338
};
93369339
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
93379340
var hook$jscomp$inline_1230 = __REACT_DEVTOOLS_GLOBAL_HOOK__;

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

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<cd5cd2d51aad2dcc6d485f9a9bc90b90>>
10+
* @generated SignedSource<<f18d6d4dff134392d4dfcaa89af16bb0>>
1111
*/
1212

1313
"use strict";
@@ -1811,7 +1811,8 @@ function createChildReconciler(shouldTrackSideEffects) {
18111811
);
18121812
case REACT_LAZY_TYPE:
18131813
var init = newChild._init;
1814-
return createChild(returnFiber, init(newChild._payload), lanes);
1814+
newChild = init(newChild._payload);
1815+
return createChild(returnFiber, newChild, lanes);
18151816
}
18161817
if (isArrayImpl(newChild) || getIteratorFn(newChild))
18171818
return (
@@ -1859,7 +1860,8 @@ function createChildReconciler(shouldTrackSideEffects) {
18591860
case REACT_LAZY_TYPE:
18601861
return (
18611862
(key = newChild._init),
1862-
updateSlot(returnFiber, oldFiber, key(newChild._payload), lanes)
1863+
(newChild = key(newChild._payload)),
1864+
updateSlot(returnFiber, oldFiber, newChild, lanes)
18631865
);
18641866
}
18651867
if (isArrayImpl(newChild) || getIteratorFn(newChild))
@@ -1920,11 +1922,12 @@ function createChildReconciler(shouldTrackSideEffects) {
19201922
);
19211923
case REACT_LAZY_TYPE:
19221924
var init = newChild._init;
1925+
newChild = init(newChild._payload);
19231926
return updateFromMap(
19241927
existingChildren,
19251928
returnFiber,
19261929
newIdx,
1927-
init(newChild._payload),
1930+
newChild,
19281931
lanes
19291932
);
19301933
}
@@ -9943,7 +9946,7 @@ var devToolsConfig$jscomp$inline_1105 = {
99439946
throw Error("TestRenderer does not support findFiberByHostInstance()");
99449947
},
99459948
bundleType: 0,
9946-
version: "19.0.0-rc-6cf53e9c",
9949+
version: "19.0.0-rc-77c04414",
99479950
rendererPackageName: "react-test-renderer"
99489951
};
99499952
(function (internals) {
@@ -9987,7 +9990,7 @@ var devToolsConfig$jscomp$inline_1105 = {
99879990
scheduleRoot: null,
99889991
setRefreshHandler: null,
99899992
getCurrentFiber: null,
9990-
reconcilerVersion: "19.0.0-rc-6cf53e9c"
9993+
reconcilerVersion: "19.0.0-rc-77c04414"
99919994
});
99929995
exports._Scheduler = Scheduler;
99939996
exports.act = act;

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

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<f3f0a5ed50b6bab3eafa955dec73aece>>
10+
* @generated SignedSource<<498b38ab8fbbf44800642c8dc0009e44>>
1111
*/
1212

1313
'use strict';
@@ -970,6 +970,10 @@ var didWarnAboutKeySpread = {};
970970
*/
971971

972972
function jsxDEV$1(type, config, maybeKey, isStaticChildren, source, self) {
973+
return jsxDEVImpl(type, config, maybeKey, isStaticChildren, source, self);
974+
}
975+
976+
function jsxDEVImpl(type, config, maybeKey, isStaticChildren, source, self, debugStack, debugTask) {
973977
{
974978
if (!isValidElementType(type)) {
975979
// This is an invalid element type.

0 commit comments

Comments
 (0)