chrome-devtools-frontend 1.0.1697595 → 1.0.1698733

package/front_end/models/ai_assistance/contexts/FileContext.ts

@@ -2,7 +2,7 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-import * as SDK from '../../../core/sdk/sdk.js';
+import type * as SDK from '../../../core/sdk/sdk.js';
 import type * as Bindings from '../../bindings/bindings.js';
 import type * as Workspace from '../../workspace/workspace.js';
 import {type ContextDetail, ConversationContext} from '../agents/AiAgent.js';
@@ -20,20 +20,12 @@ export class FileContext extends ConversationContext<Workspace.UISourceCode.UISo
     this.#debuggerWorkspaceBinding = debuggerWorkspaceBinding;
   }
 
-  /**
-   * Resolves the security origin of a given UISourceCode.
-   * Prefers the project security origin, falling back to the origin of the file URL.
-   */
-  static originForUISourceCode(file: Workspace.UISourceCode.UISourceCode): SDK.SecurityOrigin.SecurityOrigin {
-    return file.project()?.securityOrigin?.() ?? SDK.SecurityOrigin.SecurityOrigin.create(file.url());
-  }
-
   /**
    * Returns the security origin of the project containing the file, falling
    * back to the origin derived from the file URL.
    */
   override getOrigin(): SDK.SecurityOrigin.SecurityOrigin {
-    return FileContext.originForUISourceCode(this.#file);
+    return this.#file.securityOrigin();
   }
 
   override getItem(): Workspace.UISourceCode.UISourceCode {

package/front_end/models/ai_assistance/skills/performance.md

@@ -8,8 +8,8 @@ allowed-tools:
   - getTraceMainThreadSummary
   - getTraceNetworkSummary
   - getDetailedCallTree
-  - getFunctionCode
-  - getResourceContent
+  - getTraceFunctionCode
+  - getTraceResourceContent
   - getInsightDetails
 ---
 You are an expert web performance assistant integrated into Chrome DevTools.
@@ -29,7 +29,8 @@ Your goal is to provide actionable advice about web page performance by analyzin
 3. **Call Tree, Event & Source Inspection**:
    - Use `getDetailedCallTree` to retrieve bottom-up execution trees for expensive main thread tasks.
    - Use `getTraceEventByKey` to inspect timing and payload data for individual events.
-   - Use `getFunctionCode` or `getResourceContent` to inspect the source code and identify root causes.
+   - Use `getTraceFunctionCode` to inspect a specific function identified in the call tree, including line-by-line CPU profile execution costs.
+   - Use `getTraceResourceContent` to inspect the full text of a script or resource captured within the trace by URL.
 
 4. **UI Selection & Trace Recording**:
    - Use `selectTraceEventByKey` to reveal and select an event in the Performance Flamechart if requested.

package/front_end/models/ai_assistance/tools/GetSourceContent.ts

@@ -65,12 +65,13 @@ export class GetSourceContentTool implements
       args: GetSourceContentArgs,
       context: BaseToolCapability&OriginLockCapability,
       ): Promise<DataHandlerResult<{content: string}>> {
-    const originResult = resolveOriginFromLock(context.getOriginLock());
+    const originLock = context.getOriginLock();
+    const originResult = resolveOriginFromLock(originLock);
     if ('error' in originResult) {
       return originResult;
     }
 
-    const file = ListSourcesTool.getSourceById(args.id, originResult.origin);
+    const file = ListSourcesTool.getSourceById(args.id, originLock);
 
     if (!file) {
       return {

package/front_end/models/ai_assistance/tools/{GetFunctionCode.ts → GetTraceFunctionCode.ts}

@@ -21,54 +21,67 @@ const UIStringsNotTranslate = {
 
 const lockedString = i18n.i18n.lockedString;
 
-export interface GetFunctionCodeArgs extends ToolArgs {
+/**
+ * Arguments for {@link GetTraceFunctionCodeTool}.
+ */
+export interface GetTraceFunctionCodeArgs extends ToolArgs {
+  /** The URL of the script containing the function recorded in the performance trace. */
   scriptUrl: string;
+  /** The line number where the function is defined (0-based, as reported in the call tree). */
   line: number;
+  /** The column number where the function is defined (0-based, as reported in the call tree). */
   column: number;
 }
 
-export class GetFunctionCodeTool implements
-    DataTool<GetFunctionCodeArgs, string, BaseToolCapability&PerformanceTraceCapability> {
-  readonly name: ToolName = ToolName.GET_FUNCTION_CODE;
+/**
+ * Retrieves function code and line-by-line CPU profile execution costs from the performance trace.
+ *
+ * Preconditions:
+ * - Requires an active, freshly recorded trace session (fails on imported traces).
+ * - Requires resource access via the performance trace context.
+ */
+export class GetTraceFunctionCodeTool implements
+    DataTool<GetTraceFunctionCodeArgs, string, BaseToolCapability&PerformanceTraceCapability> {
+  readonly name: ToolName = ToolName.GET_TRACE_FUNCTION_CODE;
   readonly description: string =
-      'Retrieves the code for a function defined at the given location. The result is annotated with the runtime performance of each line of code.';
+      'Retrieves the code for a function recorded in the performance trace at the specified location, annotated with line-by-line CPU runtime profiling execution costs. Do not call this tool unless a performance trace recording is actively loaded.';
 
-  readonly parameters: Host.AidaClient.FunctionObjectParam<keyof GetFunctionCodeArgs> = {
+  readonly parameters: Host.AidaClient.FunctionObjectParam<keyof GetTraceFunctionCodeArgs> = {
     type: Host.AidaClient.ParametersTypes.OBJECT,
-    description: 'Arguments for looking up function code.',
+    description: 'Arguments for looking up function code from the performance trace profile.',
     nullable: false,
     properties: {
       scriptUrl: {
         type: Host.AidaClient.ParametersTypes.STRING,
-        description: 'The url of the function.',
+        description: 'The URL of the script containing the function recorded in the performance trace.',
         nullable: false,
       },
       line: {
         type: Host.AidaClient.ParametersTypes.INTEGER,
-        description: 'The line number where the function is defined.',
+        description: 'The line number where the function is defined (0-based, as reported in the call tree).',
         nullable: false,
       },
       column: {
         type: Host.AidaClient.ParametersTypes.INTEGER,
-        description: 'The column number where the function is defined.',
+        description: 'The column number where the function is defined (0-based, as reported in the call tree).',
         nullable: false,
       },
     },
     required: ['scriptUrl', 'line', 'column'],
   };
 
-  displayInfoFromArgs(params: GetFunctionCodeArgs): {
+  displayInfoFromArgs(params: GetTraceFunctionCodeArgs): {
     title: string,
     action: string,
   } {
     return {
       title: lockedString(UIStringsNotTranslate.lookingUpFunctionCode),
-      action: `getFunctionCode('${params.scriptUrl}', ${params.line}, ${params.column})`,
+      action: `getTraceFunctionCode('${params.scriptUrl}', ${params.line}, ${params.column})`,
     };
   }
 
   async handler(
-      params: GetFunctionCodeArgs,
+      params: GetTraceFunctionCodeArgs,
       capabilities: BaseToolCapability&PerformanceTraceCapability,
       ): Promise<DataHandlerResult<string>> {
     const performanceTraceContext = capabilities.getPerformanceTraceContext();

package/front_end/models/ai_assistance/tools/{GetResourceContent.ts → GetTraceResourceContent.ts}

@@ -25,42 +25,57 @@ const UIStringsNotTranslate = {
 
 const lockedString = i18n.i18n.lockedString;
 
-export interface GetResourceContentArgs extends ToolArgs {
+/**
+ * Arguments for {@link GetTraceResourceContentTool}.
+ */
+export interface GetTraceResourceContentArgs extends ToolArgs {
+  /** The URL of the resource captured in the performance trace to retrieve. */
   url: string;
 }
 
-export class GetResourceContentTool implements DataTool<
-    GetResourceContentArgs, {content: string}, BaseToolCapability&TargetCapability&PerformanceTraceCapability> {
-  readonly name: ToolName = ToolName.GET_RESOURCE_CONTENT;
+/**
+ * Retrieves text content for a resource or script captured in the performance trace.
+ *
+ * Precedence:
+ * 1. Checks trace metadata (`parsedTrace.data.Scripts`) for scripts captured during recording.
+ * 2. Falls back to querying the live page target's `ResourceTreeModel`.
+ *
+ * Preconditions:
+ * - Requires an active, freshly recorded trace session (fails on imported traces).
+ * - Fails if resource is binary/non-text, cross-origin, or a `file://` URL.
+ */
+export class GetTraceResourceContentTool implements DataTool<
+    GetTraceResourceContentArgs, {content: string}, BaseToolCapability&TargetCapability&PerformanceTraceCapability> {
+  readonly name: ToolName = ToolName.GET_TRACE_RESOURCE_CONTENT;
   readonly description: string =
-      'Retrieves the content of the resource with the given url. Only use this for text resource types.';
+      'Retrieves the text content of a script or resource captured within the recorded performance trace by URL. Only use this for text resource types. Do not call this tool on imported traces or for general workspace files (use listSources and getSourceContent instead).';
 
-  readonly parameters: Host.AidaClient.FunctionObjectParam<keyof GetResourceContentArgs> = {
+  readonly parameters: Host.AidaClient.FunctionObjectParam<keyof GetTraceResourceContentArgs> = {
     type: Host.AidaClient.ParametersTypes.OBJECT,
-    description: 'Arguments for looking up resource content.',
+    description: 'Arguments for looking up resource content from the performance trace.',
     nullable: false,
     properties: {
       url: {
         type: Host.AidaClient.ParametersTypes.STRING,
-        description: 'The url for the resource.',
+        description: 'The URL of the resource captured in the performance trace to retrieve.',
         nullable: false,
       },
     },
     required: ['url'],
   };
 
-  displayInfoFromArgs(params: GetResourceContentArgs): {
+  displayInfoFromArgs(params: GetTraceResourceContentArgs): {
     title: string,
     action: string,
   } {
     return {
       title: lockedString(UIStringsNotTranslate.lookingAtResourceContent),
-      action: `getResourceContent('${params.url}')`,
+      action: `getTraceResourceContent('${params.url}')`,
     };
   }
 
   async handler(
-      params: GetResourceContentArgs,
+      params: GetTraceResourceContentArgs,
       capabilities: BaseToolCapability&TargetCapability&PerformanceTraceCapability,
       ): Promise<DataHandlerResult<{content: string}>> {
     const performanceTraceContext = capabilities.getPerformanceTraceContext();
@@ -72,6 +87,10 @@ export class GetResourceContentTool implements DataTool<
       return {error: 'Cannot use this tool on an imported file.'};
     }
 
+    if (!params.url) {
+      return {error: 'Missing arg: url'};
+    }
+
     if (!performanceTraceContext.canAccessResource(params.url)) {
       return {error: 'Resource not found'};
     }
@@ -82,6 +101,7 @@ export class GetResourceContentTool implements DataTool<
     let content: string;
 
     const url = params.url as Platform.DevToolsPath.UrlString;
+    // Check trace metadata for scripts captured during recording before falling back to live page resources.
     const script = parsedTrace.data.Scripts?.scripts.find(script => script.url === params.url);
     if (script?.content !== undefined) {
       content = script.content;

package/front_end/models/ai_assistance/tools/ListSources.ts

@@ -4,9 +4,7 @@
 
 import * as Host from '../../../core/host/host.js';
 import * as i18n from '../../../core/i18n/i18n.js';
-import type * as SDK from '../../../core/sdk/sdk.js';
 import * as Workspace from '../../workspace/workspace.js';
-import {FileContext} from '../contexts/FileContext.js';
 
 import {
   type BaseToolCapability,
@@ -50,23 +48,30 @@ export class ListSourcesTool implements
   }
 
   static getUISourceCodes(
-      establishedOrigin: SDK.SecurityOrigin.SecurityOrigin,
+      originLock: OriginLockState,
       // eslint-disable-next-line @devtools/no-instance-of-migrated-singletons
       workspace: Workspace.Workspace.WorkspaceImpl = Workspace.Workspace.WorkspaceImpl.instance(),
       ): Workspace.UISourceCode.UISourceCode[] {
-    if (establishedOrigin.isOpaque()) {
+    if (originLock.status !== 'ESTABLISHED_ORIGIN' || originLock.origin.isOpaque()) {
       return [];
     }
 
-    const projects =
-        workspace.projects().filter(project => project.type() === Workspace.Workspace.projectTypes.Network);
     const uiSourceCodes = new Map<string, Workspace.UISourceCode.UISourceCode>();
 
-    for (const project of projects) {
+    for (const project of workspace.projectsForType(Workspace.Workspace.projectTypes.Network)) {
+      const projectOrigin = project.securityOrigin?.();
+      if (projectOrigin && !isOriginAllowedByLock(originLock, projectOrigin)) {
+        continue;
+      }
+
       for (const uiSourceCode of project.uiSourceCodes()) {
         if (uiSourceCode.isIgnoreListed()) {
           continue;
         }
+        if (!projectOrigin && !isOriginAllowedByLock(originLock, uiSourceCode.securityOrigin())) {
+          continue;
+        }
+
         const url = uiSourceCode.url();
         if (!uiSourceCodes.get(url) || uiSourceCode.contentType().isFromSourceMap()) {
           uiSourceCodes.set(url, uiSourceCode);
@@ -77,18 +82,19 @@ export class ListSourcesTool implements
       }
     }
 
-    const originLock: OriginLockState = {status: 'ESTABLISHED_ORIGIN', origin: establishedOrigin};
-    return [...uiSourceCodes.values()].filter(
-        file => isOriginAllowedByLock(originLock, FileContext.originForUISourceCode(file)));
+    return Array.from(uiSourceCodes.values());
   }
 
   static getSourceById(
       id: number,
-      establishedOrigin: SDK.SecurityOrigin.SecurityOrigin,
+      originLock: OriginLockState,
       // eslint-disable-next-line @devtools/no-instance-of-migrated-singletons
       workspace: Workspace.Workspace.WorkspaceImpl = Workspace.Workspace.WorkspaceImpl.instance(),
       ): Workspace.UISourceCode.UISourceCode|undefined {
-    return ListSourcesTool.getUISourceCodes(establishedOrigin, workspace)
+    if (!Number.isInteger(id) || id <= 0) {
+      return undefined;
+    }
+    return ListSourcesTool.getUISourceCodes(originLock, workspace)
         .find(file => ListSourcesTool.uiSourceCodeId.get(file) === id);
   }
 
@@ -114,12 +120,13 @@ export class ListSourcesTool implements
       _params: Record<string, never>,
       context: BaseToolCapability&OriginLockCapability,
       ): Promise<DataHandlerResult<{files: SourceSummary[]}>> {
-    const originResult = resolveOriginFromLock(context.getOriginLock());
+    const originLock = context.getOriginLock();
+    const originResult = resolveOriginFromLock(originLock);
     if ('error' in originResult) {
       return originResult;
     }
 
-    const files = ListSourcesTool.getUISourceCodes(originResult.origin);
+    const files = ListSourcesTool.getUISourceCodes(originLock);
 
     return {
       result: {

package/front_end/models/ai_assistance/tools/Tool.ts

@@ -258,8 +258,8 @@ export const enum ToolName {
   GET_TRACE_NETWORK_SUMMARY = 'getTraceNetworkSummary',
   RUN_LIGHTHOUSE = 'runLighthouse',
   GET_DETAILED_CALL_TREE = 'getDetailedCallTree',
-  GET_FUNCTION_CODE = 'getFunctionCode',
-  GET_RESOURCE_CONTENT = 'getResourceContent',
+  GET_TRACE_FUNCTION_CODE = 'getTraceFunctionCode',
+  GET_TRACE_RESOURCE_CONTENT = 'getTraceResourceContent',
   GET_INSIGHT_DETAILS = 'getInsightDetails',
   GET_STORAGE_BREAKDOWN = 'getStorageBreakdown',
 }

package/front_end/models/ai_assistance/tools/ToolRegistry.ts

@@ -6,18 +6,18 @@ import {ExecuteJavaScriptTool} from './ExecuteJavaScript.js';
 import {GetCookieValuesTool} from './GetCookieValues.js';
 import {GetDetailedCallTreeTool} from './GetDetailedCallTree.js';
 import {GetElementAccessibilityDetailsTool} from './GetElementAccessibilityDetails.js';
-import {GetFunctionCodeTool} from './GetFunctionCode.js';
 import {GetInsightDetailsTool} from './GetInsightDetails.js';
 import {GetLighthouseAuditsTool} from './GetLighthouseAudits.js';
 import {GetNetworkRequestDetailsTool} from './GetNetworkRequestDetails.js';
-import {GetResourceContentTool} from './GetResourceContent.js';
 import {GetSourceContentTool} from './GetSourceContent.js';
 import {GetStorageBreakdownTool} from './GetStorageBreakdown.js';
 import {GetStorageValuesTool} from './GetStorageValues.js';
 import {GetStylesTool} from './GetStyles.js';
 import {GetTraceEventByKeyTool} from './GetTraceEventByKey.js';
+import {GetTraceFunctionCodeTool} from './GetTraceFunctionCode.js';
 import {GetTraceMainThreadSummaryTool} from './GetTraceMainThreadSummary.js';
 import {GetTraceNetworkSummaryTool} from './GetTraceNetworkSummary.js';
+import {GetTraceResourceContentTool} from './GetTraceResourceContent.js';
 import {ListCookiesTool} from './ListCookies.js';
 import {ListNetworkRequestsTool} from './ListNetworkRequests.js';
 import {ListPageOriginsTool} from './ListPageOrigins.js';
@@ -51,8 +51,8 @@ export interface BaseToolsRegistryMap {
   [ToolName.GET_TRACE_NETWORK_SUMMARY]: GetTraceNetworkSummaryTool;
   [ToolName.RUN_LIGHTHOUSE]: RunLighthouseTool;
   [ToolName.GET_DETAILED_CALL_TREE]: GetDetailedCallTreeTool;
-  [ToolName.GET_FUNCTION_CODE]: GetFunctionCodeTool;
-  [ToolName.GET_RESOURCE_CONTENT]: GetResourceContentTool;
+  [ToolName.GET_TRACE_FUNCTION_CODE]: GetTraceFunctionCodeTool;
+  [ToolName.GET_TRACE_RESOURCE_CONTENT]: GetTraceResourceContentTool;
   [ToolName.GET_INSIGHT_DETAILS]: GetInsightDetailsTool;
   [ToolName.GET_STORAGE_BREAKDOWN]: GetStorageBreakdownTool;
 }
@@ -86,8 +86,8 @@ export const TOOLS: BaseToolsRegistryMap = {
   [ToolName.GET_TRACE_NETWORK_SUMMARY]: new GetTraceNetworkSummaryTool(),
   [ToolName.RUN_LIGHTHOUSE]: new RunLighthouseTool(),
   [ToolName.GET_DETAILED_CALL_TREE]: new GetDetailedCallTreeTool(),
-  [ToolName.GET_FUNCTION_CODE]: new GetFunctionCodeTool(),
-  [ToolName.GET_RESOURCE_CONTENT]: new GetResourceContentTool(),
+  [ToolName.GET_TRACE_FUNCTION_CODE]: new GetTraceFunctionCodeTool(),
+  [ToolName.GET_TRACE_RESOURCE_CONTENT]: new GetTraceResourceContentTool(),
   [ToolName.GET_INSIGHT_DETAILS]: new GetInsightDetailsTool(),
   [ToolName.GET_STORAGE_BREAKDOWN]: new GetStorageBreakdownTool(),
 };

package/front_end/models/bindings/CompilerScriptMapping.ts

@@ -458,16 +458,9 @@ export class CompilerScriptMapping implements DebuggerSourceMapping {
     this.removeStubUISourceCode(script);
 
     const target = script.target();
-    const embedderName = script.embedderName();
-    let securityOrigin: SDK.SecurityOrigin.SecurityOrigin|undefined;
-    if (embedderName) {
-      const extractedOrigin = Common.ParsedURL.ParsedURL.extractOrigin(embedderName);
-      if (extractedOrigin && extractedOrigin !== 'null') {
-        securityOrigin = SDK.SecurityOrigin.SecurityOrigin.create(extractedOrigin);
-      }
-    }
-    const parsedOrigin = securityOrigin ? `:${securityOrigin.siteId()}` : '';
-    const projectId = `jsSourceMaps:${script.isContentScript() ? 'extensions' : ''}:${target.id()}${parsedOrigin}`;
+    const securityOrigin = script.securityOrigin();
+    const originPart = securityOrigin.isOpaque() ? '' : `:${securityOrigin.siteId()}`;
+    const projectId = `jsSourceMaps:${script.isContentScript() ? 'extensions' : ''}:${target.id()}${originPart}`;
     let project = this.#projects.get(projectId);
     if (!project) {
       const projectType = script.isContentScript() ? Workspace.Workspace.projectTypes.ContentScripts :

package/front_end/models/bindings/DebuggerLanguagePlugins.ts

@@ -593,11 +593,11 @@ export class DebuggerLanguagePluginManager implements
     return {rawModuleId, plugin: null};
   }
 
-  uiSourceCodeForURL(debuggerModel: SDK.DebuggerModel.DebuggerModel, url: Platform.DevToolsPath.UrlString):
-      Workspace.UISourceCode.UISourceCode|null {
+  uiSourceCodeForURL(debuggerModel: SDK.DebuggerModel.DebuggerModel, url: Platform.DevToolsPath.UrlString,
+                     script?: SDK.Script.Script): Workspace.UISourceCode.UISourceCode|null {
     const modelData = this.#debuggerModelToData.get(debuggerModel);
     if (modelData) {
-      return modelData.getProject().uiSourceCodeForURL(url);
+      return modelData.uiSourceCodeForURL(url, script);
     }
     return null;
   }
@@ -625,7 +625,7 @@ export class DebuggerLanguagePluginManager implements
       const sourceLocations = await plugin.rawLocationToSourceLocation(pluginLocation);
       for (const sourceLocation of sourceLocations) {
         const uiSourceCode = this.uiSourceCodeForURL(
-            script.debuggerModel, sourceLocation.sourceFileURL as Platform.DevToolsPath.UrlString);
+            script.debuggerModel, sourceLocation.sourceFileURL as Platform.DevToolsPath.UrlString, script);
         if (!uiSourceCode) {
           continue;
         }
@@ -1097,23 +1097,41 @@ export class DebuggerLanguagePluginManager implements
 }
 
 class ModelData {
-  project: ContentProviderBasedProject;
+  readonly #debuggerModel: SDK.DebuggerModel.DebuggerModel;
+  readonly #workspace: Workspace.Workspace.WorkspaceImpl;
+  readonly #projects = new Map<string, ContentProviderBasedProject>();
   readonly uiSourceCodeToScripts: Map<Workspace.UISourceCode.UISourceCode, SDK.Script.Script[]>;
   constructor(debuggerModel: SDK.DebuggerModel.DebuggerModel, workspace: Workspace.Workspace.WorkspaceImpl) {
-    this.project =
-        new ContentProviderBasedProject(workspace, 'language_plugins::' + debuggerModel.target().id(),
-                                        Workspace.Workspace.projectTypes.Network, '', false /* isServiceProject */);
-    NetworkProject.setTargetForProject(this.project, debuggerModel.target());
-
+    this.#debuggerModel = debuggerModel;
+    this.#workspace = workspace;
     this.uiSourceCodeToScripts = new Map();
   }
 
+  #projectIdForScript(script: SDK.Script.Script): string {
+    const securityOrigin = script.securityOrigin();
+    const originPart = securityOrigin.isOpaque() ? '' : `:${securityOrigin.siteId()}`;
+    return `language_plugins::${this.#debuggerModel.target().id()}${originPart}`;
+  }
+
+  #projectForScript(script: SDK.Script.Script): ContentProviderBasedProject {
+    const projectId = this.#projectIdForScript(script);
+    let project = this.#projects.get(projectId);
+    if (!project) {
+      project = new ContentProviderBasedProject(this.#workspace, projectId, Workspace.Workspace.projectTypes.Network,
+                                                '', false /* isServiceProject */, script.securityOrigin());
+      NetworkProject.setTargetForProject(project, this.#debuggerModel.target());
+      this.#projects.set(projectId, project);
+    }
+    return project;
+  }
+
   addSourceFiles(script: SDK.Script.Script, urls: Platform.DevToolsPath.UrlString[]): void {
+    const project = this.#projectForScript(script);
     const initiator = script.createPageResourceLoadInitiator();
     for (const url of urls) {
-      let uiSourceCode = this.project.uiSourceCodeForURL(url);
+      let uiSourceCode = project.uiSourceCodeForURL(url);
       if (!uiSourceCode) {
-        uiSourceCode = this.project.createUISourceCode(url, Common.ResourceType.resourceTypes.SourceMapScript);
+        uiSourceCode = project.createUISourceCode(url, Common.ResourceType.resourceTypes.SourceMapScript);
         NetworkProject.setInitialFrameAttribution(uiSourceCode, script.frameId);
 
         // Bind the uiSourceCode to the script first before we add the
@@ -1129,7 +1147,7 @@ class ModelData {
             url, Common.ResourceType.resourceTypes.SourceMapScript, initiator,
             script.target().targetManager().getPageResourceLoader());
         const mimeType = Common.ResourceType.ResourceType.mimeFromURL(url) || 'text/javascript';
-        this.project.addUISourceCodeWithProvider(uiSourceCode, contentProvider, null, mimeType);
+        project.addUISourceCodeWithProvider(uiSourceCode, contentProvider, null, mimeType);
       } else {
         // The same uiSourceCode can be provided by different scripts,
         // but we don't expect that to happen frequently.
@@ -1146,7 +1164,7 @@ class ModelData {
       scripts = scripts.filter(s => s !== script);
       if (scripts.length === 0) {
         this.uiSourceCodeToScripts.delete(uiSourceCode);
-        this.project.removeUISourceCode(uiSourceCode.url());
+        uiSourceCode.project().removeUISourceCode(uiSourceCode.url());
       } else {
         this.uiSourceCodeToScripts.set(uiSourceCode, scripts);
       }
@@ -1154,11 +1172,24 @@ class ModelData {
   }
 
   dispose(): void {
-    this.project.dispose();
+    for (const project of this.#projects.values()) {
+      project.dispose();
+    }
+    this.#projects.clear();
   }
 
-  getProject(): ContentProviderBasedProject {
-    return this.project;
+  uiSourceCodeForURL(url: Platform.DevToolsPath.UrlString,
+                     script?: SDK.Script.Script): Workspace.UISourceCode.UISourceCode|null {
+    if (script) {
+      return this.#projects.get(this.#projectIdForScript(script))?.uiSourceCodeForURL(url) ?? null;
+    }
+    for (const project of this.#projects.values()) {
+      const uiSourceCode = project.uiSourceCodeForURL(url);
+      if (uiSourceCode) {
+        return uiSourceCode;
+      }
+    }
+    return null;
   }
 }
 

package/front_end/models/bindings/ResourceScriptMapping.ts

@@ -312,11 +312,11 @@ export class ResourceScriptFile {
     this.script = this.uiSourceCode.contentType().isScript() ? script : null;
   }
 
-  addSourceMapURL(sourceMapURL: Platform.DevToolsPath.UrlString): void {
+  addSourceMapURL(sourceMapURL: Platform.DevToolsPath.UrlString, provenance: SDK.SourceMap.SourceMapProvenance): void {
     if (!this.script) {
       return;
     }
-    this.script.debuggerModel.setSourceMapURL(this.script, sourceMapURL);
+    this.script.debuggerModel.setSourceMapURL(this.script, sourceMapURL, provenance);
   }
 
   addDebugInfoURL(debugInfoURL: Platform.DevToolsPath.UrlString): void {

package/front_end/models/bindings/StylesSourceMapping.ts

@@ -310,7 +310,7 @@ export class StyleFile implements TextUtils.ContentProvider.ContentProvider {
     const sourceMapManager = this.#cssModel.sourceMapManager();
     this.headers.forEach(header => {
       sourceMapManager.detachSourceMap(header);
-      sourceMapManager.attachSourceMap(header, sourceUrl, sourceMapUrl);
+      sourceMapManager.attachSourceMap(header, sourceUrl, sourceMapUrl, SDK.SourceMap.SourceMapProvenance.USER);
     });
   }
 }

package/front_end/models/comment_manager/CD4ABridge.ts

@@ -14,13 +14,12 @@ export interface CommentThread {
   id: string;
   text: string;
   networkRequestId?: string;
-  backendNodeId?: number;
-  editor?: CommentManager.EditorAnchorSignature;
+  node?: CommentManager.DOMNodeAnchorSignature;
 }
 
 export interface RevealTarget {
   networkRequestId?: string;
-  backendNodeId?: number;
+  node?: CommentManager.DOMNodeAnchorSignature;
 }
 
 export const enum Events {
@@ -69,21 +68,65 @@ export class CD4ABridge extends Common.ObjectWrapper.ObjectWrapper<EventTypes> {
     Common.EventTarget.removeEventListeners(this.#eventListeners);
   }
 
+  #getDOMNode(nodeSignature: CommentManager.DOMNodeAnchorSignature): SDK.DOMModel.DOMNode|undefined {
+    if (!this.#targetManager) {
+      return undefined;
+    }
+    const target = this.#targetManager.targetById(nodeSignature.targetId) ?? this.#targetManager.primaryPageTarget();
+    const domModel = target?.model(SDK.DOMModel.DOMModel);
+    if (!domModel) {
+      return undefined;
+    }
+    for (const node of domModel.idToDOMNode.values()) {
+      if (node.backendNodeId() === nodeSignature.backendNodeId) {
+        return node;
+      }
+    }
+    return undefined;
+  }
+
+  #formatCommentText(thread: CommentManager.CommentThread): string {
+    const rawText = thread.comments[0]?.text ?? '';
+    const details: string[] = [];
+
+    if (thread.anchor.textSignature) {
+      details.push(`- DevTools element: ${thread.anchor.textSignature}`);
+    }
+
+    if (thread.anchor.node) {
+      const domNode = this.#getDOMNode(thread.anchor.node);
+      const simpleSelector = domNode?.simpleSelector();
+      if (simpleSelector) {
+        details.push(`- DOM node selector: ${simpleSelector}`);
+      }
+    }
+
+    if (thread.anchor.editor) {
+      const editorInfo = thread.anchor.editor.filePath ?
+          `${thread.anchor.editor.filePath}:${thread.anchor.editor.lineNumber}` :
+          `line ${thread.anchor.editor.lineNumber}`;
+      details.push(`- Editor: ${editorInfo}`);
+    }
+
+    if (details.length === 0) {
+      return rawText;
+    }
+
+    return rawText ? `${rawText}\n\n${details.join('\n')}` : details.join('\n');
+  }
+
   getCommentThreads(): CommentThread[] {
     const threads = this.#commentManager.takeComments();
     return threads.map(thread => {
       const threadPayload: CommentThread = {
         id: thread.id,
-        text: thread.comments[0]?.text ?? '',
+        text: this.#formatCommentText(thread),
       };
       if (thread.anchor.networkRequestId) {
         threadPayload.networkRequestId = thread.anchor.networkRequestId;
       }
       if (thread.anchor.node) {
-        threadPayload.backendNodeId = thread.anchor.node.backendNodeId;
-      }
-      if (thread.anchor.editor) {
-        threadPayload.editor = thread.anchor.editor;
+        threadPayload.node = {...thread.anchor.node};
       }
       return threadPayload;
     });
@@ -112,11 +155,11 @@ export class CD4ABridge extends Common.ObjectWrapper.ObjectWrapper<EventTypes> {
       }
     }
 
-    if (target?.backendNodeId !== undefined && this.#targetManager) {
-      const primaryTarget = this.#targetManager.primaryPageTarget();
-      const domModel = primaryTarget?.model(SDK.DOMModel.DOMModel);
+    if (target?.node && this.#targetManager) {
+      const sdkTarget = this.#targetManager.targetById(target.node.targetId) ?? this.#targetManager.primaryPageTarget();
+      const domModel = sdkTarget?.model(SDK.DOMModel.DOMModel);
       if (domModel) {
-        const cdpNodeId = target.backendNodeId as Protocol.DOM.BackendNodeId;
+        const cdpNodeId = target.node.backendNodeId as Protocol.DOM.BackendNodeId;
         const nodeMap = await domModel.pushNodesByBackendIdsToFrontend(new Set([cdpNodeId]));
         const node = nodeMap?.get(cdpNodeId);
         if (node) {