chrome-devtools-frontend 1.0.1643855 → 1.0.1646286

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

@@ -0,0 +1,116 @@
+// Copyright 2026 The Chromium Authors
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import * as Common from '../../../core/common/common.js';
+import * as i18n from '../../../core/i18n/i18n.js';
+import type * as Platform from '../../../core/platform/platform.js';
+import type * as SDK from '../../../core/sdk/sdk.js';
+import type * as NetworkTimeCalculator from '../../network_time_calculator/network_time_calculator.js';
+import {
+  type ContextDetail,
+  ConversationContext,
+} from '../agents/AiAgent.js';
+import {extractContextOrigin} from '../AiOrigins.js';
+import {NetworkRequestFormatter} from '../data_formatters/NetworkRequestFormatter.js';
+
+const UIStringsNotTranslate = {
+  request: 'Request',
+  response: 'Response',
+  requestUrl: 'Request URL',
+  timing: 'Timing',
+  requestInitiatorChain: 'Request initiator chain',
+} as const;
+
+const lockedString = i18n.i18n.lockedString;
+
+/**
+ * Returns the origin for a network request in the AI context.
+ *
+ * To prevent cross-origin prompt injection attacks, HAR-imported requests
+ * are isolated from live pages. We assign them a virtual origin
+ * (`imported-har://${domain}`) so they do not share the origin of live pages
+ * (e.g., `https://${domain}`). This forces a conversation reset when transitioning
+ * between imported HAR data and live pages.
+ */
+export function getRequestContextOrigin(request: SDK.NetworkRequest.NetworkRequest): string {
+  const origin = extractContextOrigin(request.documentURL);
+  if (request.isImportedHar()) {
+    const parsed = Common.ParsedURL.ParsedURL.fromString(origin as Platform.DevToolsPath.UrlString);
+    return `imported-har://${parsed ? parsed.domain() : origin}`;
+  }
+  return origin;
+}
+
+export class RequestContext extends ConversationContext<SDK.NetworkRequest.NetworkRequest> {
+  #request: SDK.NetworkRequest.NetworkRequest;
+  #calculator: NetworkTimeCalculator.NetworkTransferTimeCalculator;
+
+  constructor(
+      request: SDK.NetworkRequest.NetworkRequest,
+      calculator: NetworkTimeCalculator.NetworkTransferTimeCalculator,
+  ) {
+    super();
+    this.#request = request;
+    this.#calculator = calculator;
+  }
+
+  /**
+   * Note: this is not the literal origin of the network request. This URL
+   * is used to determine when we should force the user to start a new AI
+   * conversation when the context changes. We allow a single AI conversation to
+   * inspect all network requests that were made for that given target URL.
+   */
+  override getURL(): string {
+    return this.#request.documentURL;
+  }
+
+  override getOrigin(): string {
+    return getRequestContextOrigin(this.#request);
+  }
+
+  override getItem(): SDK.NetworkRequest.NetworkRequest {
+    return this.#request;
+  }
+
+  override getTitle(): string {
+    return this.#request.name();
+  }
+
+  override async getPromptDetails(): Promise<string|null> {
+    const formatter = new NetworkRequestFormatter(this.#request, this.#calculator);
+    return `# Selected network request\n${await formatter.formatNetworkRequest()}`;
+  }
+
+  override async getUserFacingDetails(): Promise<[ContextDetail, ...ContextDetail[]]|null> {
+    const formatter = new NetworkRequestFormatter(this.#request, this.#calculator);
+    const requestContextDetail: ContextDetail = {
+      title: lockedString(UIStringsNotTranslate.request),
+      text: lockedString(UIStringsNotTranslate.requestUrl) + ': ' + this.#request.url() + '\n\n' +
+          formatter.formatRequestHeaders(),
+    };
+    const responseBody = await formatter.formatResponseBody();
+    const responseBodyString = responseBody ? `\n\n${responseBody}` : '';
+
+    const responseContextDetail: ContextDetail = {
+      title: lockedString(UIStringsNotTranslate.response),
+      text: formatter.formatResponseHeaders() + responseBodyString +
+          `\n\n${formatter.formatStatus()}${formatter.formatFailureReasons()}`,
+    };
+    const timingContextDetail: ContextDetail = {
+      title: lockedString(UIStringsNotTranslate.timing),
+      text: formatter.formatNetworkRequestTiming(),
+    };
+    const initiatorChainContextDetail: ContextDetail = {
+      title: lockedString(UIStringsNotTranslate.requestInitiatorChain),
+      text: formatter.formatRequestInitiatorChain(),
+    };
+
+    return [
+      requestContextDetail,
+      responseContextDetail,
+      timingContextDetail,
+      initiatorChainContextDetail,
+    ];
+  }
+}

package/front_end/models/ai_assistance/data_formatters/NetworkRequestFormatter.ts

@@ -92,7 +92,8 @@ export class NetworkRequestFormatter {
   }): string {
     let responseStatus = '';
     if (status.statusCode) {
-      responseStatus = `Response status: ${status.statusCode} ${status.statusText}\n`;
+      const statusText = status.statusText ? ` ${status.statusText}` : '';
+      responseStatus = `Response status: ${status.statusCode}${statusText}\n`;
     }
     const flags = [];
     flags.push(status.finished ? 'finished' : 'pending');

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

@@ -8,9 +8,11 @@ import type {FunctionCallHandlerResult, FunctionHandlerOptions,} from '../agents
 import {JavascriptExecutor} from '../agents/ExecuteJavascript.js';
 
 import {
+  type BaseToolCapability,
+  type PageExecutionCapability,
+  type StyleMutationCapability,
   type Tool,
   type ToolArgs,
-  type ToolContext,
   ToolName,
 } from './Tool.js';
 
@@ -20,7 +22,8 @@ export interface ExecuteJavaScriptArgs extends ToolArgs {
   title: string;
 }
 
-export class ExecuteJavaScriptTool implements Tool<ExecuteJavaScriptArgs, unknown> {
+export class ExecuteJavaScriptTool implements
+    Tool<ExecuteJavaScriptArgs, unknown, BaseToolCapability&PageExecutionCapability&StyleMutationCapability> {
   readonly name = ToolName.EXECUTE_JAVASCRIPT;
 
   readonly description =
@@ -104,10 +107,10 @@ const data = {
 
   async handler(
       params: ExecuteJavaScriptArgs,
-      context: ToolContext,
+      context: BaseToolCapability&PageExecutionCapability&StyleMutationCapability,
       options?: FunctionHandlerOptions,
       ): Promise<FunctionCallHandlerResult<unknown>> {
-    const executionNode = context.getExecutionContextNode?.() ?? null;
+    const executionNode = context.getExecutionContextNode();
     if (!executionNode) {
       return {error: 'Error: Could not find the context node for execution.'};
     }
@@ -115,17 +118,11 @@ const data = {
     const executionMode = Root.Runtime.hostConfig.devToolsFreestyler?.executionMode ??
         Root.Runtime.HostConfigFreestylerExecutionMode.ALL_SCRIPTS;
 
-    const changes = context.changeManager;
-    const createExtensionScope = context.createExtensionScope;
-    if (!changes || !createExtensionScope) {
-      return {error: 'Internal Error: Required change manager or extension scope creator is missing.'};
-    }
-
     const executor = new JavascriptExecutor({
       executionMode,
       getContextNode: () => executionNode,
-      createExtensionScope,
-      changes,
+      createExtensionScope: context.createExtensionScope,
+      changes: context.changeManager,
     },
                                             context.execJs);
 

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

@@ -9,7 +9,14 @@ import type {ComputedStyleAiWidget, FunctionCallHandlerResult, FunctionHandlerOp
 import {DOMNodeContext} from '../contexts/DOMNodeContext.js';
 import {debugLog} from '../debug.js';
 
-import {type Tool, type ToolArgs, type ToolContext, ToolName} from './Tool.js';
+import {
+  type BaseToolCapability,
+  type OriginLockCapability,
+  type TargetCapability,
+  type Tool,
+  type ToolArgs,
+  ToolName,
+} from './Tool.js';
 
 export interface GetStylesArgs extends ToolArgs {
   elements: number[];
@@ -17,7 +24,8 @@ export interface GetStylesArgs extends ToolArgs {
   explanation: string;
 }
 
-export class GetStylesTool implements Tool<GetStylesArgs, unknown> {
+export class GetStylesTool implements
+    Tool<GetStylesArgs, unknown, BaseToolCapability&TargetCapability&OriginLockCapability> {
   readonly name = ToolName.GET_STYLES;
   readonly description =
       `Get computed and source styles for one or multiple elements on the inspected page for multiple elements at once by uid.
@@ -71,34 +79,33 @@ export class GetStylesTool implements Tool<GetStylesArgs, unknown> {
 
   async handler(
       params: GetStylesArgs,
-      context: ToolContext,
+      context: BaseToolCapability&TargetCapability&OriginLockCapability,
       _options?: FunctionHandlerOptions,
       ): Promise<FunctionCallHandlerResult<unknown>> {
     const widgets: ComputedStyleAiWidget[] = [];
     const result:
         Record<string, {computed: Record<string, string|undefined>, authored: Record<string, string|undefined>}> = {};
 
-    const activeContext = context.conversationContext;
-    if (!activeContext || !(activeContext instanceof DOMNodeContext)) {
-      return {error: 'Error: Could not find the currently selected element.'};
+    const target = context.getTarget();
+    if (!target) {
+      return {error: 'Error: Could not find the inspected page.'};
     }
 
-    const selectedNode = activeContext.getItem();
-    if (!selectedNode) {
-      return {error: 'Error: Could not find the currently selected element.'};
+    const establishedOrigin = context.getEstablishedOrigin();
+    if (!establishedOrigin) {
+      return {error: 'Error: Origin lock is not established.'};
     }
 
     for (const uid of params.elements) {
       result[uid] = {computed: {}, authored: {}};
       debugLog(`Action to execute: uid=${uid}`);
-      const node =
-          new SDK.DOMModel.DeferredDOMNode(selectedNode.domModel().target(), uid as Protocol.DOM.BackendNodeId);
+      const node = new SDK.DOMModel.DeferredDOMNode(target, uid as Protocol.DOM.BackendNodeId);
       const resolved = await node.resolvePromise();
       if (!resolved) {
         return {error: 'Error: Could not find the element with uid=' + uid};
       }
       const newContext = new DOMNodeContext(resolved);
-      if (activeContext.getOrigin() !== newContext.getOrigin()) {
+      if (establishedOrigin !== newContext.getOrigin()) {
         return {error: 'Error: Node does not belong to the current origin.'};
       }
       const styles = await resolved.domModel().cssModel().getComputedStyle(resolved.id);

package/front_end/models/ai_assistance/tools/README.md

@@ -0,0 +1,45 @@
+# AI Assistant Tools Architecture
+
+This directory defines the **Tools** used by `AiAgent2` and other AI agents to execute code, read page state, or apply mutations to the inspected page.
+
+## Core Concepts
+
+The architecture relies on three primary concepts to guarantee 100% compile-time type safety for tools:
+1. **BaseTool**: An interface capturing non-generic tool metadata (e.g. `name`, `description`, `parameters`). This allows the agent and DevTools UI to generically store, register, and describe functions to the AIDA client without needing to know their specific types at runtime.
+2. **Capability Interfaces**: Narrow TypeScript interfaces wrapping individual DevTools dependencies (e.g., ChangeManager, executeJsCode). This decouples tools from monolithic agent environments, making them reusable and easier to unit test.
+3. **Tool**: A generic TypeScript interface (`Tool<Args, ReturnType, ContextType>`) binding the execution handler to specific capability requirements. This enforces compile-time safety, ensuring that a tool handler is only invoked by an agent that fulfills all the required capabilities.
+
+## Capability Interfaces
+
+Instead of passing a monolithic "grab-bag" context object to all tool handlers, DevTools AI tools declare exactly the capabilities they require. Available capability interfaces defined in `Tool.ts` include:
+
+- `BaseToolCapability`: Base interface providing access to the top-level conversation context step.
+- `PageExecutionCapability`: For tools executing JavaScript code on the inspected page.
+- `StyleMutationCapability`: For tools managing and applying style mutations via a `ChangeManager`.
+- `TargetCapability`: For tools requiring access to the page's current SDK `Target`.
+- `OriginLockCapability`: For tools enforcing cross-origin security via origin locks. Tools that fetch resources or state from the inspected page (such as styling or source code) must use this capability to verify that the target resource matches the conversation's established origin. This prevents the LLM from executing tools against out-of-origin elements or documents.
+
+### Unified Context
+
+The Agent (e.g., `AiAgent2`) builds the complete dependency union (`AllToolsContext`) and fulfills all capabilities. When the handler is invoked, TypeScript validates that the provided context matches the intersection of capabilities requested by that tool.
+
+## Authoring a New Tool
+
+To author a new tool:
+
+1. **Define the Args interface**: Extend `ToolArgs` to represent the JSON parameter schema expected by the LLM.
+2. **Declare Capability Dependencies**: Determine which capabilities your tool handler needs. Intersect them to define the tool's `ContextType`.
+3. **Implement the `Tool` interface**: Pass the args interface, return type, and intersected ContextType to the generic parameters of `Tool`.
+4. **Instantiate in `ToolRegistry.ts`**: Add the instantiated tool class to the static `TOOLS` registry.
+
+See concrete, production examples of capability-based tools in this directory:
+- [ExecuteJavaScript.ts](ExecuteJavaScript.ts): Demonstrates use of `PageExecutionCapability` and `StyleMutationCapability`.
+- [GetStyles.ts](GetStyles.ts): Demonstrates use of `TargetCapability` and `OriginLockCapability`.
+
+## ToolRegistry Lookup
+
+To retrieve a tool from the registry with 100% type safety, call `ToolRegistry.get()` with the literal `ToolName` key:
+
+```typescript
+const getStylesTool = ToolRegistry.get(ToolName.GET_STYLES); // Returns GetStylesTool class type
+```

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

@@ -9,22 +9,76 @@ import type {executeJsCode} from '../agents/ExecuteJavascript.js';
 import type {ChangeManager} from '../ChangeManager.js';
 
 /**
- * Context provided to the tool's handler execution.
+ * Base capability for all tool contexts, providing access to the conversation context.
  */
-export interface ToolContext {
+export interface BaseToolCapability {
+  /**
+   * The active context for the current conversation step, if any.
+   */
   conversationContext: ConversationContext<unknown>|null;
-  changeManager?: ChangeManager;
-  createExtensionScope?: (changes: ChangeManager) => {
-    install(): Promise<void>, uninstall(): Promise<void>,
-  };
-  execJs?: typeof executeJsCode;
+}
+
+/**
+ * Capability for tools that need to execute JavaScript code on the inspected page.
+ */
+export interface PageExecutionCapability {
+  /**
+   * Function to execute JavaScript code in the page context.
+   */
+  execJs: typeof executeJsCode;
+
   /**
    * Returns the DOM node that acts as the execution context (i.e. `$0` inside the execution context)
    * for running JavaScript.
    */
-  getExecutionContextNode?: () => SDK.DOMModel.DOMNode | null;
+  getExecutionContextNode(): SDK.DOMModel.DOMNode|null;
 }
 
+/**
+ * Capability for tools that need to manage and apply style mutations to the page.
+ */
+export interface StyleMutationCapability {
+  /**
+   * The change manager for tracking and applying style changes.
+   */
+  changeManager: ChangeManager;
+
+  /**
+   * Creates an extension scope for applying changes, ensuring they can be uninstalled when done.
+   */
+  createExtensionScope(changes: ChangeManager): {
+    install(): Promise<void>,
+    uninstall(): Promise<void>,
+  };
+}
+
+/**
+ * Capability for tools that need access to the current SDK Target of the inspected page.
+ */
+export interface TargetCapability {
+  /**
+   * Returns the current SDK Target for the inspected page.
+   */
+  getTarget(): SDK.Target.Target|null;
+}
+
+/**
+ * Capability for tools that need to enforce origin locking for security.
+ */
+export interface OriginLockCapability {
+  /**
+   * Returns the origin that the current conversation is locked to, if any.
+   */
+  getEstablishedOrigin(): string|undefined;
+}
+
+/**
+ * Unified context interface providing all capabilities available in the project.
+ * Used by the agent to pass a complete context to any tool type-safely.
+ */
+export type AllToolsContext =
+    BaseToolCapability&PageExecutionCapability&StyleMutationCapability&TargetCapability&OriginLockCapability;
+
 /**
  * Base argument type for AI Tools.
  */
@@ -50,21 +104,30 @@ export interface BaseTool {
 
 /**
  * Main generic interface for defining a Tool.
- * Binds the parameter schema properties and the handler implementation to a strict `Args` contract.
+ * Binds the parameter schema properties and the handler implementation to a strict `Args` and `ContextType` contract.
  *
  * @template Args - The expected object type for tool arguments. Must be an object type.
  * @template ReturnType - The type of data returned by the handler function.
+ * @template ContextType - The interface defining the capabilities this tool requires. Defaults to `BaseToolCapability`.
  */
-export interface Tool<Args extends ToolArgs = ToolArgs, ReturnType = unknown, > extends BaseTool {
+export interface Tool<Args extends ToolArgs = ToolArgs, ReturnType = unknown,
+                                   ContextType extends BaseToolCapability = BaseToolCapability> extends BaseTool {
   readonly parameters: Host.AidaClient.FunctionObjectParam<keyof Args>;
   readonly displayInfoFromArgs?: (
       args: Args,
       ) => {
     title?: string, thought?: string, action?: string, suggestions?: [string, ...string[]],
   };
+  /**
+   * The implementation function called when the AI invokes this tool.
+   *
+   * @param args The arguments provided by the AI model matching the tool's parameter schema.
+   * @param context The context object providing the capabilities requested by `ContextType`.
+   * @param options Additional runtime options for the handler execution.
+   */
   handler(
       args: Args,
-      context: ToolContext,
+      context: ContextType,
       options?: FunctionHandlerOptions,
       ): Promise<FunctionCallHandlerResult<ReturnType>>;
 }

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

@@ -4,11 +4,15 @@
 
 import {ExecuteJavaScriptTool} from './ExecuteJavaScript.js';
 import {GetStylesTool} from './GetStyles.js';
-import {type Tool, ToolName} from './Tool.js';
+import {type AllToolsContext, type Tool, type ToolArgs, ToolName} from './Tool.js';
 
 /**
  * Plain object registry containing concrete instantiated tools.
- * Keep this type concrete (no type-erasure) to preserve exact tool types.
+ *
+ * This object is deliberately declared as a plain object without an explicit type annotation
+ * (like `Record<ToolName, Tool>`) to preserve the exact concrete type of each registered tool.
+ * This is required to support compile-time type safety and inference in the overloaded
+ * `ToolRegistry.get()` method, which maps a literal `ToolName` key to its specific class type.
  */
 export const TOOLS = {
   [ToolName.EXECUTE_JAVASCRIPT]: new ExecuteJavaScriptTool(),
@@ -23,14 +27,26 @@ export class ToolRegistry {
    * Retrieves a tool by its literal name with 100% type safety.
    *
    * @template K - A key from the `TOOLS` registry.
+   * @param name The literal name of the tool to retrieve.
    * @returns The concrete class type of the requested tool.
    */
   static get<K extends keyof typeof TOOLS>(name: K): typeof TOOLS[K];
   /**
    * Fallback retrieval signature for general or runtime string lookups.
+   *
+   * @param name The string name of the tool to retrieve, used when the tool name is only known at runtime.
+   * @returns The generic Tool interface, or undefined if not found.
    */
-  static get(name: string): Tool|undefined;
-  static get(name: string): Tool|undefined {
-    return Object.prototype.hasOwnProperty.call(TOOLS, name) ? TOOLS[name as keyof typeof TOOLS] as Tool : undefined;
+  static get(name: string): Tool<ToolArgs, unknown, AllToolsContext>|undefined;
+  static get(name: string): Tool<ToolArgs, unknown, AllToolsContext>|undefined {
+    // We use a double assertion (`as unknown as Tool<...>`) here. TypeScript's variance
+    // rules prevent direct casting from specific concrete tools (which have narrowed,
+    // capability-specific contexts) to the generic `Tool` signature that uses `AllToolsContext`.
+    // This cast is runtime-safe because any capability requested by a specific tool is
+    // guaranteed to be satisfied by `AllToolsContext`, and the handler will only access
+    // the capabilities it expects.
+    return Object.prototype.hasOwnProperty.call(TOOLS, name) ?
+        TOOLS[name as keyof typeof TOOLS] as unknown as Tool<ToolArgs, unknown, AllToolsContext>:
+        undefined;
   }
 }

package/front_end/models/heap_snapshot/HeapSnapshotModel.ts

@@ -136,10 +136,16 @@ export class Diff {
   removedCount = 0;
   addedSize = 0;
   removedSize = 0;
-  deletedIndexes: number[] = [];
-  addedIndexes: number[] = [];
   countDelta!: number;
   sizeDelta!: number;
+  // Data about added nodes
+  addedIndexes: number[] = [];
+  addedIds: number[] = [];
+  addedSelfSizes: number[] = [];
+  // Data about deleted nodes
+  deletedIndexes: number[] = [];
+  deletedIds: number[] = [];
+  deletedSelfSizes: number[] = [];
   constructor(name: string) {
     this.name = name;
   }
@@ -287,3 +293,13 @@ export interface RetainingPaths {
     siblings?: boolean,
   };
 }
+
+export interface DominatorNode {
+  nodeId: number;
+  nodeIndex: number;
+  nodeName: string;
+  retainedSize: number;
+  selfSize: number;
+}
+
+export type DominatorChain = DominatorNode[];

package/front_end/models/heap_snapshot/HeapSnapshotProxy.ts

@@ -370,6 +370,10 @@ export class HeapSnapshotProxy extends HeapSnapshotProxyObject {
     return this.callMethodPromise('getRetainingPaths', nodeIndex, maxDepth, maxNodes, maxSiblings);
   }
 
+  getDominatorsOf(nodeIndex: number): Promise<HeapSnapshotModel.DominatorChain> {
+    return this.callMethodPromise('getDominatorsOf', nodeIndex);
+  }
+
   unignoreNodeInRetainersView(nodeIndex: number): Promise<void> {
     return this.callMethodPromise('unignoreNodeInRetainersView', nodeIndex);
   }

package/front_end/models/stack_trace/DetailedErrorStackParser.ts

@@ -10,13 +10,15 @@ import type {RawFrame} from './Trie.js';
 
 const CALL_FRAME_REGEX = /^\s*at\s+/;
 
+export type ResolveURLCallback = (url: Platform.DevToolsPath.UrlString) => Platform.DevToolsPath.UrlString|null;
+
 /**
  * Takes a V8 Error#stack string and extracts structured information.
  *
  * @returns Null if the provided string has an unexpected format. A
  *          populated `RawFrame[]` otherwise.
  */
-export function parseRawFramesFromErrorStack(stack: string): RawFrame[]|null {
+export function parseRawFramesFromErrorStack(stack: string, resolveURL?: ResolveURLCallback): RawFrame[]|null {
   const lines = stack.split('\n');
   const firstAtLineIndex = findFramesStartLine(lines);
   const rawFrames: RawFrame[] = [];
@@ -66,6 +68,8 @@ export function parseRawFramesFromErrorStack(stack: string): RawFrame[]|null {
     if (lineContent.endsWith(')') && openParenIndex !== -1) {
       functionName = lineContent.substring(0, openParenIndex).trim();
       location = lineContent.substring(openParenIndex + 2, lineContent.length - 1);
+    } else if (lineContent.startsWith('(') && lineContent.endsWith(')')) {
+      location = lineContent.substring(1, lineContent.length - 1);
     } else {
       location = lineContent;
     }
@@ -90,9 +94,9 @@ export function parseRawFramesFromErrorStack(stack: string): RawFrame[]|null {
       if (innerOpenParen !== -1) {
         evalFunctionName = evalOriginStr.substring(0, innerOpenParen).trim();
         evalLocation = evalOriginStr.substring(innerOpenParen + 2, evalOriginStr.length - 1);
-        evalOrigin = parseRawFramesFromErrorStack(`    at ${evalFunctionName} (${evalLocation})`)?.[0];
+        evalOrigin = parseRawFramesFromErrorStack(`    at ${evalFunctionName} (${evalLocation})`, resolveURL)?.[0];
       } else {
-        evalOrigin = parseRawFramesFromErrorStack(`    at ${evalFunctionName}`)?.[0];
+        evalOrigin = parseRawFramesFromErrorStack(`    at ${evalFunctionName}`, resolveURL)?.[0];
       }
     }
 
@@ -112,9 +116,18 @@ export function parseRawFramesFromErrorStack(stack: string): RawFrame[]|null {
       }
     } else if (location) {
       const splitResult = Common.ParsedURL.ParsedURL.splitLineAndColumn(location);
-      url = splitResult.url;
       lineNumber = splitResult.lineNumber ?? -1;
       columnNumber = splitResult.columnNumber ?? -1;
+
+      if (resolveURL && splitResult.url !== '<anonymous>' && splitResult.url !== 'native') {
+        const resolved = resolveURL(splitResult.url);
+        if (!resolved) {
+          return null;
+        }
+        url = resolved;
+      } else {
+        url = splitResult.url;
+      }
     }
 
     // Handle "typeName.methodName [as alias]"

package/front_end/models/stack_trace/StackTraceModel.ts

@@ -3,6 +3,7 @@
 // found in the LICENSE file.
 
 import * as Common from '../../core/common/common.js';
+import type * as Platform from '../../core/platform/platform.js';
 import * as SDK from '../../core/sdk/sdk.js';
 import type * as Protocol from '../../generated/protocol.js';
 
@@ -65,7 +66,17 @@ export class StackTraceModel extends SDK.SDKModel.SDKModel<unknown> {
   async createFromErrorStackLikeString(
       stack: string, rawFramesToUIFrames: TranslateRawFrames,
       exceptionDetails?: Protocol.Runtime.ExceptionDetails): Promise<StackTrace.StackTrace.ParsedErrorStackTrace|null> {
-    const rawFrames = parseRawFramesFromErrorStack(stack);
+    const debuggerModel = this.target().model(SDK.DebuggerModel.DebuggerModel) as SDK.DebuggerModel.DebuggerModel;
+    const baseURL = this.target().inspectedURL();
+    const resolveURL = (url: Platform.DevToolsPath.UrlString): Platform.DevToolsPath.UrlString|null => {
+      let urlWithScheme = parseOrScriptMatch(debuggerModel, url);
+      if (!urlWithScheme && Common.ParsedURL.ParsedURL.isRelativeURL(url)) {
+        urlWithScheme = parseOrScriptMatch(debuggerModel, Common.ParsedURL.ParsedURL.completeURL(baseURL, url));
+      }
+      return urlWithScheme;
+    };
+
+    const rawFrames = parseRawFramesFromErrorStack(stack, resolveURL);
     if (!rawFrames) {
       return null;
     }
@@ -267,4 +278,26 @@ async function translateEvalOrigin(
   return new EvalOrigin(frames, parentEvalOrigin);
 }
 
+function parseOrScriptMatch(debuggerModel: SDK.DebuggerModel.DebuggerModel,
+                            url: Platform.DevToolsPath.UrlString|null): Platform.DevToolsPath.UrlString|null {
+  if (!url) {
+    return null;
+  }
+  if (Common.ParsedURL.ParsedURL.isValidUrlString(url)) {
+    return url;
+  }
+  if (debuggerModel.scriptsForSourceURL(url).length) {
+    return url;
+  }
+  // nodejs stack traces contain (absolute) file paths, but v8 reports them as file: urls.
+  try {
+    const fileUrl = new URL(url, 'file://');
+    if (debuggerModel.scriptsForSourceURL(fileUrl.href as Platform.DevToolsPath.UrlString).length) {
+      return fileUrl.href as Platform.DevToolsPath.UrlString;
+    }
+  } catch {
+  }
+  return null;
+}
+
 SDK.SDKModel.SDKModel.register(StackTraceModel, {capabilities: SDK.Target.Capability.NONE, autostart: false});