Skip to content

Commit

Permalink
Track owner of console logs
Browse files Browse the repository at this point in the history
That way we can also restore owner stack traces for those logs and
associate the log with a particular component in DevTools.
  • Loading branch information
sebmarkbage committed Apr 5, 2024
1 parent d8e167a commit 79901a4
Show file tree
Hide file tree
Showing 2 changed files with 9 additions and 5 deletions.
8 changes: 5 additions & 3 deletions packages/react-client/src/ReactFlightClient.js
Original file line number Diff line number Diff line change
Expand Up @@ -1138,12 +1138,14 @@ function resolveConsoleEntry(
);
}

const payload: [string, string, string, mixed] = parseModel(response, value);
const payload: [string, string, null | ReactComponentInfo, string, mixed] =
parseModel(response, value);
const methodName = payload[0];
// TODO: Restore the fake stack before logging.
// const stackTrace = payload[1];
const env = payload[2];
const args = payload.slice(3);
// const owner = payload[2];
const env = payload[3];
const args = payload.slice(4);
printToConsole(methodName, args, env);
}

Expand Down
6 changes: 4 additions & 2 deletions packages/react-server/src/ReactFlightServer.js
Original file line number Diff line number Diff line change
Expand Up @@ -154,7 +154,8 @@ function patchConsole(consoleInst: typeof console, methodName: string) {
// We don't currently use this id for anything but we emit it so that we can later
// refer to previous logs in debug info to associate them with a component.
const id = request.nextChunkId++;
emitConsoleChunk(request, id, methodName, stack, arguments);
const owner: null | ReactComponentInfo = ReactCurrentOwner.current;
emitConsoleChunk(request, id, methodName, owner, stack, arguments);
}
// $FlowFixMe[prop-missing]
return originalMethod.apply(this, arguments);
Expand Down Expand Up @@ -2272,6 +2273,7 @@ function emitConsoleChunk(
request: Request,
id: number,
methodName: string,
owner: null | ReactComponentInfo,
stackTrace: string,
args: Array<any>,
): void {
Expand Down Expand Up @@ -2306,7 +2308,7 @@ function emitConsoleChunk(

// TODO: Don't double badge if this log came from another Flight Client.
const env = request.environmentName;
const payload = [methodName, stackTrace, env];
const payload = [methodName, stackTrace, owner, env];
// $FlowFixMe[method-unbinding]
payload.push.apply(payload, args);
// $FlowFixMe[incompatible-type] stringify can return null
Expand Down

0 comments on commit 79901a4

Please sign in to comment.