[RPP] Add ScriptsHandler for content and source maps

Bug: 394373632, 394373852
Change-Id: If57823fcae581a0788a9339dc1cf1db2c9521412
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6253620
Auto-Submit: Connor Clark <[email protected]>
Commit-Queue: Adam Raine <[email protected]>
Reviewed-by: Adam Raine <[email protected]>

Author: Connor Clark

config/gni/devtools_grd_files.gni

@@ -1101,6 +1101,7 @@ grd_files_debug_sources = [
   "front_end/models/trace/handlers/RendererHandler.js",
   "front_end/models/trace/handlers/SamplesHandler.js",
   "front_end/models/trace/handlers/ScreenshotsHandler.js",
+  "front_end/models/trace/handlers/ScriptsHandler.js",
   "front_end/models/trace/handlers/SelectorStatsHandler.js",
   "front_end/models/trace/handlers/ServerTimingsHandler.js",
   "front_end/models/trace/handlers/Threads.js",

front_end/core/sdk/EnhancedTracesParser.test.ts

@@ -73,7 +73,7 @@ describe('EnhancedTracesParser', () => {
     isModule: false,
     url: 'http://localhost:8080/index.html',
     hasSourceUrl: false,
-    sourceMapUrl: 'http://localhost:8080/source',
+    sourceMapUrl: 'http://localhost:8080/source.map.json',
     length: 13,
     sourceText: 'source text 1',
     auxData: {

front_end/models/trace/handlers/BUILD.gn

@@ -34,6 +34,7 @@ devtools_module("handlers") {
     "RendererHandler.ts",
     "SamplesHandler.ts",
     "ScreenshotsHandler.ts",
+    "ScriptsHandler.ts",
     "SelectorStatsHandler.ts",
     "ServerTimingsHandler.ts",
     "Threads.ts",
@@ -94,6 +95,7 @@ ts_library("unittests") {
     "RendererHandler.test.ts",
     "SamplesHandler.test.ts",
     "ScreenshotsHandler.test.ts",
+    "ScriptsHandler.test.ts",
     "SelectorStatsHandler.test.ts",
     "ServerTimingsHandler.test.ts",
     "Threads.test.ts",

front_end/models/trace/handlers/FramesHandler.test.ts

@@ -27,7 +27,7 @@ async function processTrace(events: readonly Trace.Types.Events.Event[]): Promis
   }
   for (const handlerName of handlersInOrder) {
     const handler = Trace.Handlers.ModelHandlers[handlerName];
-    await handler.finalize();
+    await handler.finalize({});
   }
 }
 

front_end/models/trace/handlers/ModelHandlers.ts

@@ -26,6 +26,7 @@ export * as PageLoadMetrics from './PageLoadMetricsHandler.js';
 export * as Renderer from './RendererHandler.js';
 export * as Samples from './SamplesHandler.js';
 export * as Screenshots from './ScreenshotsHandler.js';
+export * as Scripts from './ScriptsHandler.js';
 export * as SelectorStats from './SelectorStatsHandler.js';
 export * as ServerTimings from './ServerTimingsHandler.js';
 export * as UserInteractions from './UserInteractionsHandler.js';

front_end/models/trace/handlers/ScriptsHandler.test.ts

@@ -0,0 +1,43 @@
+// Copyright 2025 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+// eslint-disable-next-line rulesdir/no-imports-in-directory
+import type * as SDK from '../../../core/sdk/sdk.js';
+import {TraceLoader} from '../../../testing/TraceLoader.js';
+import * as Trace from '../trace.js';
+
+describe('ScriptsHandler', () => {
+  beforeEach(async function() {
+    Trace.Handlers.ModelHandlers.Scripts.reset();
+    const events = await TraceLoader.rawEvents(this, 'enhanced-traces.json.gz');
+    for (const event of events) {
+      Trace.Handlers.ModelHandlers.Scripts.handleEvent(event);
+    }
+    await Trace.Handlers.ModelHandlers.Scripts.finalize({
+      async resolveSourceMap(url: string): Promise<SDK.SourceMap.SourceMapV3> {
+        // Don't need to actually make a source map.
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        return {test: url} as any;
+      }
+    });
+  });
+
+  afterEach(() => {
+    Trace.Handlers.ModelHandlers.Scripts.reset();
+  });
+
+  it('collects scripts contents', async function() {
+    const data = Trace.Handlers.ModelHandlers.Scripts.data();
+    assert.deepEqual([...data.scripts.values()], [
+      {
+        scriptId: '1',
+        url: 'http://localhost:8080/index.html',
+        content: ' text ',
+        sourceMapUrl: 'http://localhost:8080/source.map.json',
+        sourceMap: {test: 'http://localhost:8080/source.map.json'}
+      },
+      {scriptId: '2', url: 'http://localhost:8080/index.html', content: 'source text 2'},
+    ]);
+  });
+});

front_end/models/trace/handlers/ScriptsHandler.ts

@@ -0,0 +1,71 @@
+// Copyright 2025 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import * as Platform from '../../../core/platform/platform.js';
+// eslint-disable-next-line rulesdir/no-imports-in-directory
+import type * as SDK from '../../../core/sdk/sdk.js';
+import type * as Protocol from '../../../generated/protocol.js';
+import * as Types from '../types/types.js';
+
+export interface ScriptsData {
+  /** Note: this is only populated when the "Enhanced Traces" feature is enabled. */
+  scripts: Map<Protocol.Runtime.ScriptId, {}>;
+}
+
+interface Script {
+  scriptId: Protocol.Runtime.ScriptId;
+  url?: string;
+  content?: string;
+  sourceMapUrl?: string;
+  sourceMap?: SDK.SourceMap.SourceMapV3;
+}
+
+const scriptById = new Map<Protocol.Runtime.ScriptId, Script>();
+
+export function reset(): void {
+  scriptById.clear();
+}
+
+export function handleEvent(event: Types.Events.Event): void {
+  if (Types.Events.isScriptRundownEvent(event)) {
+    const {scriptId, url, sourceMapUrl} = event.args.data;
+    const script = Platform.MapUtilities.getWithDefault(scriptById, scriptId, () => ({scriptId} as Script));
+    script.url = url;
+    // Ignore nonsense values, which is what this was when initially implemented.
+    // TODO(cjamcl): https://g-issues.chromium.org/issues/337909145#comment15
+    if (sourceMapUrl && sourceMapUrl !== url && sourceMapUrl.endsWith('.json')) {
+      script.sourceMapUrl = sourceMapUrl;
+    }
+    return;
+  }
+
+  if (Types.Events.isScriptSourceRundownEvent(event)) {
+    const {scriptId, sourceText} = event.args.data;
+    const script = Platform.MapUtilities.getWithDefault(scriptById, scriptId, () => ({scriptId} as Script));
+    script.content = sourceText;
+    return;
+  }
+}
+
+export async function finalize(options: Types.Configuration.ParseOptions): Promise<void> {
+  if (!options.resolveSourceMap) {
+    return;
+  }
+
+  const promises = [];
+  for (const script of scriptById.values()) {
+    if (script.sourceMapUrl) {
+      promises.push(options.resolveSourceMap(script.sourceMapUrl).then(sourceMap => {
+        script.sourceMap = sourceMap;
+      }));
+    }
+  }
+  await Promise.all(promises);
+}
+
+export function data(): ScriptsData {
+  return {
+    scripts: scriptById,
+  };
+}

front_end/models/trace/types/Configuration.ts

@@ -2,6 +2,8 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+import type * as SDK from '../../../core/sdk/sdk.js';
+
 import type * as File from './File.js';
 
 export interface Configuration {
@@ -64,4 +66,5 @@ export interface ParseOptions {
    */
   isCPUProfile?: boolean;
   metadata?: File.MetaData;
+  resolveSourceMap?: (url: string) => Promise<SDK.SourceMap.SourceMapV3>;
 }

front_end/models/trace/types/TraceEvents.ts

@@ -3073,3 +3073,43 @@ export interface LegacyLayerPaintEventPicture {
   rect: Array<number>;
   serializedPicture: string;
 }
+
+export interface ScriptRundownEvent extends Event {
+  cat: 'disabled-by-default-devtools.v8-source-rundown';
+  args: Args&{
+    data: {
+      isolate: string,
+      executionContextId: Protocol.Runtime.ExecutionContextId,
+      scriptId: Protocol.Runtime.ScriptId,
+      startLine: number,
+      startColumn: number,
+      endLine: number,
+      endColumn: number,
+      url: string,
+      hash: string,
+      isModule: boolean,
+      hasSourceUrl: boolean,
+      sourceMapUrl?: string,
+    },
+  };
+}
+
+export function isScriptRundownEvent(event: Event): event is ScriptRundownEvent {
+  return event.cat === 'disabled-by-default-devtools.v8-source-rundown';
+}
+
+export interface ScriptSourceRundownEvent extends Event {
+  cat: 'disabled-by-default-devtools.v8-source-rundown-sources';
+  args: Args&{
+    data: {
+      isolate: string,
+      scriptId: Protocol.Runtime.ScriptId,
+      length?: number,
+      sourceText?: string,
+    },
+  };
+}
+
+export function isScriptSourceRundownEvent(event: Event): event is ScriptSourceRundownEvent {
+  return event.cat === 'disabled-by-default-devtools.v8-source-rundown-sources';
+}

front_end/panels/timeline/fixtures/traces/README.md

@@ -258,3 +258,7 @@ Trace containing a cross-origin navigation where DOM size events from the pre-na
 ### lcp-fetchpriority-high
 
 A page that loads an image as the LCP resource with fetchpriority=high set.
+
+### enhanced-traces
+
+(faked) script contents and source map urls, from the new "enhanced traces" feature. See http://crbug.com/337909145