[DevTools] Source Map Stack Traces such in await locations (#34094)

Stacked on #34093.

Instead of using the original `ReactStackTrace` that has the call sites
on the server, this parses the `Error` object which has the virtual call
sites on the client. We'll need this technique for things stack traces
suspending on the client anyway like `use()`.

We can then use these callsites to source map in the front end.

We currently don't source map function names but might be useful for
this use case as well as getting original component names from prod.

One thing this doesn't do yet is that it doesn't ignore list the stack
traces on the client using the source map's ignore list setting. It's
not super important since we expect to have already ignore listed on the
server but this will become important for client stack traces like
`use()`.
This commit is contained in:
Sebastian Markbåge 2025-08-06 13:45:06 -04:00 committed by GitHub
parent 66f09bd054
commit b080063331
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 4 additions and 2 deletions

View File

@ -401,7 +401,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
exports.f = f;
function f() { }
//# sourceMappingURL=`;
const result = ['', 'http://test/a.mts', 1, 16];
const result = ['', 'http://test/a.mts', 1, 17];
const fs = {
'http://test/a.mts': `export function f() {}`,
'http://test/a.mjs.map': `{"version":3,"file":"a.mjs","sourceRoot":"","sources":["a.mts"],"names":[],"mappings":";;AAAA,cAAsB;AAAtB,SAAgB,CAAC,KAAI,CAAC"}`,

View File

@ -82,12 +82,14 @@ export async function symbolicateSource(
const {
sourceURL: possiblyURL,
line,
column,
column: columnZeroBased,
} = consumer.originalPositionFor({
lineNumber, // 1-based
columnNumber, // 1-based
});
const column = columnZeroBased + 1;
if (possiblyURL === null) {
return null;
}