chrome-devtools-frontend 1.0.1643855 → 1.0.1646286

package/front_end/panels/console/ConsoleViewMessage.ts

@@ -34,7 +34,6 @@
  * THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-import type {Chrome} from '../../../extension-api/ExtensionAPI.js';
 import * as Common from '../../core/common/common.js';
 import * as Host from '../../core/host/host.js';
 import * as i18n from '../../core/i18n/i18n.js';
@@ -45,7 +44,6 @@ import * as AiAssistanceModel from '../../models/ai_assistance/ai_assistance.js'
 import * as Bindings from '../../models/bindings/bindings.js';
 import type * as IssuesManager from '../../models/issues_manager/issues_manager.js';
 import * as Logs from '../../models/logs/logs.js';
-import * as StackTrace from '../../models/stack_trace/stack_trace.js';
 import * as TextUtils from '../../models/text_utils/text_utils.js';
 import * as Workspace from '../../models/workspace/workspace.js';
 import * as CodeHighlighter from '../../ui/components/code_highlighter/code_highlighter.js';
@@ -66,6 +64,7 @@ import {format, updateStyle} from './ConsoleFormat.js';
 import {ConsoleInsightTeaser} from './ConsoleInsightTeaser.js';
 import consoleViewStyles from './consoleView.css.js';
 import type {ConsoleViewportElement} from './ConsoleViewport.js';
+import {SymbolizedErrorWidget} from './SymbolizedErrorWidget.js';
 
 const UIStrings = {
   /**
@@ -449,7 +448,14 @@ export class ConsoleViewMessage implements ConsoleViewportElement {
           if (this.message.parameters?.length === 1) {
             const parameter = this.message.parameters[0];
             if (typeof parameter !== 'string' && parameter.type === 'string') {
-              messageElement = this.tryFormatAsError((parameter.value as string));
+              const value = parameter.value as string;
+              const runtimeModel = this.message.runtimeModel();
+              if (runtimeModel && Bindings.SymbolizedError.isErrorLike(value)) {
+                const remoteObj = parameter instanceof SDK.RemoteObject.RemoteObject ?
+                    parameter :
+                    runtimeModel.createRemoteObject(parameter);
+                messageElement = this.renderSymbolizedError(remoteObj);
+              }
             }
           }
           const args = this.message.parameters || [messageText];
@@ -570,23 +576,21 @@ export class ConsoleViewMessage implements ConsoleViewportElement {
       const userMetric = this.#getLinkifierMetric();
       if (stackFrameWithBreakpoint) {
         return this.linkifier.maybeLinkifyConsoleCallFrame(runtimeModel.target(), stackFrameWithBreakpoint, {
-          inlineFrameIndex: 0,
           revealBreakpoint: true,
           userMetric,
         });
       }
       if (scriptId) {
-        return this.linkifier.linkifyScriptLocation(
-            runtimeModel.target(), scriptId, url || Platform.DevToolsPath.EmptyUrlString, line,
-            {columnNumber: column, inlineFrameIndex: 0, userMetric});
+        return this.linkifier.linkifyScriptLocation(runtimeModel.target(), scriptId,
+                                                    url || Platform.DevToolsPath.EmptyUrlString, line,
+                                                    {columnNumber: column, userMetric});
       }
       if (stackTrace?.callFrames.length) {
         return this.linkifier.linkifyStackTraceTopFrame(runtimeModel.target(), stackTrace);
       }
       if (url && url !== 'undefined') {
-        return this.linkifier.linkifyScriptLocation(
-            runtimeModel.target(), /* scriptId */ null, url, line,
-            {columnNumber: column, inlineFrameIndex: 0, userMetric});
+        return this.linkifier.linkifyScriptLocation(runtimeModel.target(), /* scriptId */ null, url, line,
+                                                    {columnNumber: column, userMetric});
       }
       return null;
     };
@@ -695,17 +699,19 @@ export class ConsoleViewMessage implements ConsoleViewportElement {
     stackTracePreview.options = {widthConstrained: true};
     if (stackTraceTarget && stackTrace) {
       const selectableChildIndex = this.selectableChildren.length;
-      void Bindings.DebuggerWorkspaceBinding.DebuggerWorkspaceBinding.instance()
-          .createStackTraceFromProtocolRuntime(stackTrace, stackTraceTarget)
-          .then(stackTrace => {
-            stackTracePreview.stackTrace = stackTrace;
-            return stackTracePreview.updateComplete;
-          })
-          .then(() => {
-            const selectableLinks =
-                stackTracePreview.linkElements.map(element => ({element, forceSelect: () => element.focus()}));
-            this.selectableChildren.splice(selectableChildIndex, 0, ...selectableLinks);
-          });
+      const stackTracePromise = Bindings.DebuggerWorkspaceBinding.DebuggerWorkspaceBinding.instance()
+                                    .createStackTraceFromProtocolRuntime(stackTrace, stackTraceTarget)
+                                    .then(stackTrace => {
+                                      stackTracePreview.stackTrace = stackTrace;
+                                      return stackTracePreview.updateComplete;
+                                    })
+                                    .then(() => {
+                                      const selectableLinks = stackTracePreview.linkElements.map(
+                                          (element: HTMLElement) => ({element, forceSelect: () => element.focus()}));
+                                      this.selectableChildren.splice(selectableChildIndex, 0, ...selectableLinks);
+                                    });
+      this.#formatErrorStackPromiseForTest =
+          Promise.all([this.#formatErrorStackPromiseForTest, stackTracePromise]).then(() => {});
     }
     stackTracePreview.markAsRoot();
     stackTracePreview.show(stackTraceElement);
@@ -771,7 +777,7 @@ export class ConsoleViewMessage implements ConsoleViewportElement {
     let element;
     switch (outputType) {
       case 'error':
-        element = this.formatParameterAsError(output);
+        element = this.renderSymbolizedError(output);
         break;
       case 'function':
         element = this.formatParameterAsFunction(output, includePreview);
@@ -980,42 +986,28 @@ export class ConsoleViewMessage implements ConsoleViewportElement {
     return result;
   }
 
-  private formatParameterAsError(output: SDK.RemoteObject.RemoteObject): HTMLElement {
-    const result = document.createElement('span');
-
-    // Combine the ExceptionDetails for this error object with the parsed Error#stack.
-    // The Exceptiondetails include script IDs for stack frames, which allows more accurate
-    // linking.
-    const formatErrorStack =
-        async(errorObj: SDK.RemoteObject.RemoteObject, includeCausedByPrefix: boolean): Promise<void> => {
-      const error = SDK.RemoteObject.RemoteError.objectAsError(errorObj);
-      const [details, cause] = await Promise.all([error.exceptionDetails(), error.cause()]);
-      let errorElement = this.tryFormatAsError(error.errorStack, details);
-      if (!errorElement) {
-        errorElement = document.createElement('span');
-        appendOrShow(errorElement, this.linkifyStringAsFragment(error.errorStack));
-      }
-
-      if (includeCausedByPrefix) {
-        const causeElement = document.createElement('div');
-        causeElement.append('Caused by: ', errorElement);
-        result.appendChild(causeElement);
-      } else {
-        result.appendChild(errorElement);
-      }
+  private renderSymbolizedError(errorRemoteObject: SDK.RemoteObject.RemoteObject): HTMLElement {
+    const container = document.createElement('span');
+    const widget = new SymbolizedErrorWidget();
+    widget.ignoreListManager = Workspace.IgnoreListManager.IgnoreListManager.instance();
+    const selectableChildIndex = this.selectableChildren.length;
 
-      if (cause?.subtype === 'error') {
-        await formatErrorStack(cause, /* includeCausedByPrefix */ true);
-      } else if (cause?.type === 'string') {
-        const stringCauseElement = document.createElement('div');
-        stringCauseElement.append(`Caused by: ${cause.value}`);
-        result.append(stringCauseElement);
+    const format = async(): Promise<void> => {
+      const error = await Bindings.DebuggerWorkspaceBinding.DebuggerWorkspaceBinding.instance().createSymbolizedError(
+          errorRemoteObject, this.message.exceptionDetails);
+      if (error) {
+        widget.error = error;
       }
+      await widget.updateComplete;
+      const selectableLinks =
+          widget.linkElements.map((element: HTMLElement) => ({element, forceSelect: () => element.focus()}));
+      this.selectableChildren.splice(selectableChildIndex, 0, ...selectableLinks);
     };
 
-    this.#formatErrorStackPromiseForTest = formatErrorStack(output, /* includeCausedByPrefix */ false);
-
-    return result;
+    this.#formatErrorStackPromiseForTest = Promise.all([this.#formatErrorStackPromiseForTest, format()]).then(() => {});
+    widget.markAsRoot();
+    widget.show(container);
+    return container;
   }
 
   private formatAsArrayEntry(output: SDK.RemoteObject.RemoteObject): DocumentFragment {
@@ -1781,165 +1773,6 @@ export class ConsoleViewMessage implements ConsoleViewportElement {
     return this.searchHighlightNodes[index];
   }
 
-  private async getInlineFrames(
-      debuggerModel: SDK.DebuggerModel.DebuggerModel, url: Platform.DevToolsPath.UrlString,
-      lineNumber: number|undefined, columnNumber: number|undefined): Promise<{frames: Chrome.DevTools.FunctionInfo[]}> {
-    const debuggerWorkspaceBinding = Bindings.DebuggerWorkspaceBinding.DebuggerWorkspaceBinding.instance();
-    const projects = Workspace.Workspace.WorkspaceImpl.instance().projects();
-    const uiSourceCodes = projects.map(project => project.uiSourceCodeForURL(url)).flat().filter(f => !!f);
-    const scripts =
-        uiSourceCodes.map(uiSourceCode => debuggerWorkspaceBinding.scriptsForUISourceCode(uiSourceCode)).flat();
-    if (scripts.length) {
-      const location =
-          new SDK.DebuggerModel.Location(debuggerModel, scripts[0].scriptId, lineNumber || 0, columnNumber);
-      const functionInfo = await debuggerWorkspaceBinding.pluginManager.getFunctionInfo(scripts[0], location);
-      return functionInfo && 'frames' in functionInfo ? functionInfo : {frames: []};
-    }
-
-    return {frames: []};
-  }
-
-  // Expand inline stack frames in the formatted error in the stackTrace element, inserting new elements before the
-  // insertBefore anchor.
-  private async expandInlineStackFrames(
-      debuggerModel: SDK.DebuggerModel.DebuggerModel, prefix: string, suffix: string,
-      url: Platform.DevToolsPath.UrlString, lineNumber: number|undefined, columnNumber: number|undefined,
-      stackTrace: HTMLElement, insertBefore: HTMLElement): Promise<boolean> {
-    const {frames} = await this.getInlineFrames(debuggerModel, url, lineNumber, columnNumber);
-    if (!frames.length) {
-      return false;
-    }
-
-    for (let f = 0; f < frames.length; ++f) {
-      const {name} = frames[f];
-      const formattedLine = document.createElement('span');
-      appendOrShow(formattedLine, this.linkifyStringAsFragment(`${prefix} ${name} (`));
-      const scriptLocationLink = this.linkifier.linkifyScriptLocation(
-          debuggerModel.target(), null, url, lineNumber, {columnNumber, inlineFrameIndex: f});
-      scriptLocationLink.tabIndex = -1;
-      this.selectableChildren.push({element: scriptLocationLink, forceSelect: () => scriptLocationLink.focus()});
-      formattedLine.appendChild(scriptLocationLink);
-      appendOrShow(formattedLine, this.linkifyStringAsFragment(suffix));
-      formattedLine.classList.add('formatted-stack-frame');
-      stackTrace.insertBefore(formattedLine, insertBefore);
-    }
-    return true;
-  }
-
-  private createScriptLocationLinkForSyntaxError(
-      debuggerModel: SDK.DebuggerModel.DebuggerModel, exceptionDetails: Protocol.Runtime.ExceptionDetails): HTMLElement
-      |undefined {
-    const {scriptId, lineNumber, columnNumber} = exceptionDetails;
-    if (!scriptId) {
-      return;
-    }
-
-    // SyntaxErrors might not populate the URL field. Try to resolve it via scriptId.
-    const url =
-        exceptionDetails.url as Platform.DevToolsPath.UrlString || debuggerModel.scriptForId(scriptId)?.sourceURL;
-    if (!url) {
-      return;
-    }
-
-    const scriptLocationLink = this.linkifier.linkifyScriptLocation(
-        debuggerModel.target(), exceptionDetails.scriptId || null, url, lineNumber, {
-          columnNumber,
-          inlineFrameIndex: 0,
-          showColumnNumber: true,
-        });
-    scriptLocationLink.tabIndex = -1;
-    return scriptLocationLink;
-  }
-
-  private tryFormatAsError(string: string, exceptionDetails?: Protocol.Runtime.ExceptionDetails): HTMLElement|null {
-    const runtimeModel = this.message.runtimeModel();
-    if (!runtimeModel) {
-      return null;
-    }
-
-    const issueSummary = exceptionDetails?.exceptionMetaData?.issueSummary;
-    if (typeof issueSummary === 'string') {
-      string = StackTrace.ErrorStackParser.concatErrorDescriptionAndIssueSummary(string, issueSummary);
-    }
-
-    const linkInfos = StackTrace.ErrorStackParser.parseSourcePositionsFromErrorStack(runtimeModel, string);
-    if (!linkInfos?.length) {
-      return null;
-    }
-    if (exceptionDetails?.stackTrace) {
-      StackTrace.ErrorStackParser.augmentErrorStackWithScriptIds(linkInfos, exceptionDetails.stackTrace);
-    }
-
-    const debuggerModel = runtimeModel.debuggerModel();
-    const formattedResult = document.createElement('span');
-
-    for (let i = 0; i < linkInfos.length; ++i) {
-      const newline = i < linkInfos.length - 1 ? '\n' : '';
-      const {line, link, isCallFrame} = linkInfos[i];
-      // Syntax errors don't have a stack frame that points to the source position
-      // where the error occurred. We use the source location from the
-      // exceptionDetails and append it to the end of the message instead.
-      if (!link && exceptionDetails && line.startsWith('SyntaxError')) {
-        appendOrShow(formattedResult, this.linkifyStringAsFragment(line));
-        const maybeScriptLocation = this.createScriptLocationLinkForSyntaxError(debuggerModel, exceptionDetails);
-        if (maybeScriptLocation) {
-          formattedResult.append(' (at ');
-          formattedResult.appendChild(maybeScriptLocation);
-          formattedResult.append(')');
-        }
-        formattedResult.append(newline);
-        continue;
-      }
-      if (!isCallFrame) {
-        appendOrShow(formattedResult, this.linkifyStringAsFragment(`${line}${newline}`));
-        continue;
-      }
-      const formattedLine = document.createElement('span');
-      if (!link) {
-        appendOrShow(formattedLine, this.linkifyStringAsFragment(`${line}${newline}`));
-        formattedLine.classList.add('formatted-builtin-stack-frame');
-        formattedResult.appendChild(formattedLine);
-        continue;
-      }
-      const suffix = `${link.suffix}${newline}`;
-      appendOrShow(formattedLine, this.linkifyStringAsFragment(link.prefix));
-      const scriptLocationLink = this.linkifier.linkifyScriptLocation(
-          debuggerModel.target(), link.scriptId || null, link.url, link.lineNumber, {
-            columnNumber: link.columnNumber,
-            inlineFrameIndex: 0,
-            showColumnNumber: true,
-          });
-      scriptLocationLink.tabIndex = -1;
-      this.selectableChildren.push({element: scriptLocationLink, forceSelect: () => scriptLocationLink.focus()});
-      formattedLine.appendChild(scriptLocationLink);
-      appendOrShow(formattedLine, this.linkifyStringAsFragment(suffix));
-      formattedLine.classList.add('formatted-stack-frame');
-      formattedResult.appendChild(formattedLine);
-
-      if (!link.enclosedInBraces) {
-        continue;
-      }
-
-      const prefixWithoutFunction = link.prefix.substring(0, link.prefix.lastIndexOf(' ', link.prefix.length - 3));
-
-      // If we were able to parse the function name from the stack trace line, try to replace it with an expansion of
-      // any inline frames.
-      const selectableChildIndex = this.selectableChildren.length - 1;
-      void this
-          .expandInlineStackFrames(
-              debuggerModel, prefixWithoutFunction, suffix, link.url, link.lineNumber, link.columnNumber,
-              formattedResult, formattedLine)
-          .then(modified => {
-            if (modified) {
-              formattedResult.removeChild(formattedLine);
-              this.selectableChildren.splice(selectableChildIndex, 1);
-            }
-          });
-    }
-
-    return formattedResult;
-  }
-
   static linkifyWithCustomLinkifier(
       string: string,
       linkifier: (arg0: string, arg1: Platform.DevToolsPath.UrlString, arg2?: number, arg3?: number) => Node):

package/front_end/panels/console/SymbolizedErrorWidget.ts

@@ -122,7 +122,6 @@ const DEFAULT_VIEW = (input: ViewInput, _output: object, target: HTMLElement): v
 
     const linkOptions: Components.Linkifier.LinkifyOptions = {
       showColumnNumber: true,
-      inlineFrameIndex: 0,
       maxLength: UI.UIUtils.MaxLengthForDisplayedURLsInConsole,
       ignoreListManager: input.ignoreListManager,
     };
@@ -171,6 +170,10 @@ export class SymbolizedErrorWidget extends UI.Widget.Widget {
     this.#view = view;
   }
 
+  get linkElements(): readonly HTMLElement[] {
+    return [...this.contentElement.querySelectorAll<HTMLElement>('.devtools-link')];
+  }
+
   set ignoreListManager(ignoreListManager: Workspace.IgnoreListManager.IgnoreListManager) {
     this.#ignoreListManager = ignoreListManager;
     this.requestUpdate();

package/front_end/panels/elements/AdoptedStyleSheetTreeElement.ts

@@ -58,7 +58,6 @@ export class AdoptedStyleSheetTreeElement extends UI.TreeOutline.TreeElement {
         text: linkText,
         preventClick: true,
         showColumnNumber: false,
-        inlineFrameIndex: 0,
       }));
       UI.UIUtils.createTextChild(documentElement, ')');
     }

package/front_end/panels/elements/ElementsTreeElement.ts

@@ -644,7 +644,6 @@ function renderTitle(
         text,
         preventClick: true,
         showColumnNumber: false,
-        inlineFrameIndex: 0,
       })}</span>)</span>`;
     }
 
@@ -733,7 +732,6 @@ function renderLinkifiedValue(value: string, node: SDK.DOMModel.DOMNode): Lit.Te
     text: value,
     preventClick: true,
     showColumnNumber: false,
-    inlineFrameIndex: 0,
     onRef: link => {
       ImagePreviewPopover.setImageUrl(link, rewrittenHref);
     }

package/front_end/panels/elements/PropertyRenderer.ts

@@ -556,7 +556,6 @@ export class URLRenderer extends rendererBase(SDK.CSSPropertyParserMatchers.URLM
           // at the same time, which complicates both StylesSidebarPane and StylePropertyTreeElement.
           bypassURLTrimming: true,
           showColumnNumber: false,
-          inlineFrameIndex: 0,
         }),
         hrefUrl || url);
     container.appendChild(link);

package/front_end/panels/elements/StylesSidebarPane.ts

@@ -235,6 +235,7 @@ export class StylesSidebarPane extends Common.ObjectWrapper.eventMixin<EventType
   #shouldRenderLazily = false;
   #lazyRenderObserver?: IntersectionObserver;
   #lazyRenderCallbacks = new WeakMap<Element, () => void>();
+  #updateId = 0;
 
   constructor(computedStyleModel: ComputedStyle.ComputedStyleModel.ComputedStyleModel) {
     super(computedStyleModel, {delegatesFocus: true, useShadowDom: true, classes: ['flex-none']});
@@ -616,9 +617,15 @@ export class StylesSidebarPane extends Common.ObjectWrapper.eventMixin<EventType
       this.dispatchEventToListeners(Events.INITIAL_UPDATE_COMPLETED);
     }
 
-    this.nodeStylesUpdatedForTest((this.node() as SDK.DOMModel.DOMNode), true);
+    this.#updateId += 1;
+    const currentUpdateId = this.#updateId;
 
-    this.dispatchEventToListeners(Events.STYLES_UPDATE_COMPLETED, {hasMatchedStyles: this.hasMatchedStyles});
+    void UI.Widget.Widget.allUpdatesComplete.then(() => {
+      if (this.#updateId === currentUpdateId) {
+        this.nodeStylesUpdatedForTest((this.node() as SDK.DOMModel.DOMNode), true);
+        this.dispatchEventToListeners(Events.STYLES_UPDATE_COMPLETED, {hasMatchedStyles: this.hasMatchedStyles});
+      }
+    });
   }
 
   #getRegisteredPropertyDetails(matchedStyles: SDK.CSSMatchedStyles.CSSMatchedStyles, variableName: string):

package/front_end/panels/issues/AffectedResourcesView.ts

@@ -252,7 +252,7 @@ export abstract class AffectedResourcesView extends UI.TreeOutline.TreeElement {
       const linkifier = new Components.Linkifier.Linkifier(UI.UIUtils.MaxLengthForDisplayedURLsInConsole);
       const sourceAnchor = linkifier.linkifyScriptLocation(
           target || null, sourceLocation.scriptId || null, sourceLocation.url as Platform.DevToolsPath.UrlString,
-          sourceLocation.lineNumber, {columnNumber: sourceLocation.columnNumber, inlineFrameIndex: 0});
+          sourceLocation.lineNumber, {columnNumber: sourceLocation.columnNumber});
       sourceAnchor.setAttribute('jslog', `${VisualLogging.link('source-location').track({click: true})}`);
       sourceCodeLocation.appendChild(sourceAnchor);
     }

package/front_end/panels/issues/AffectedSourcesView.ts

@@ -39,7 +39,7 @@ export class AffectedSourcesView extends AffectedResourcesView {
     const cellElement = document.createElement('td');
     // TODO(chromium:1072331): Check feasibility of plumping through scriptId for `linkifyScriptLocation`
     //                         to support source maps and formatted scripts.
-    const linkifierURLOptions = {columnNumber, lineNumber, tabStop: true, showColumnNumber: false, inlineFrameIndex: 0};
+    const linkifierURLOptions = {columnNumber, lineNumber, tabStop: true, showColumnNumber: false};
     // An element created with linkifyURL can subscribe to the events
     // 'click' neither 'keydown' if that key is the 'Enter' key.
     // Also, this element has a context menu, so we should be able to

package/front_end/panels/lighthouse/LighthouseReportRenderer.ts

@@ -198,7 +198,6 @@ export class LighthouseReportRenderer {
         lineNumber: line,
         columnNumber: column,
         showColumnNumber: false,
-        inlineFrameIndex: 0,
         maxLength: MaxLengthForLinks,
       });
       UI.Tooltip.Tooltip.install(origHTMLElement, '');

package/front_end/panels/mobile_throttling/ThrottlingSettingsTab.ts

@@ -180,10 +180,20 @@ const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
 /**
  * This promise resolves after the first compute pressure record is observed.
  * The object it returns is always up-to-date with the most recent record observed.
+ *
+ * Note: The returned value measures the host machine's compute pressure. When
+ * debugging a remote device, this may trigger irrelevant high-pressure warnings.
  */
 function createComputePressurePromise(): Promise<{state: string}> {
   const result = {state: ''};
 
+  // @ts-expect-error typescript/lib version needs to be updated.
+  if (typeof PressureObserver === 'undefined') {
+    // The Compute Pressure API is used only for showing warnings to the user.
+    // If it's unavailable, resolve immediately to proceed without warnings.
+    return Promise.resolve(result);
+  }
+
   return new Promise(resolve => {
     // @ts-expect-error typescript/lib version needs to be updated.
     const observer = new PressureObserver(records => {

package/front_end/panels/network/NetworkDataGridNode.ts

@@ -1515,8 +1515,7 @@ export class NetworkRequestNode extends NetworkNode {
           this.linkifiedInitiatorAnchor = linkifier.linkifyStackTraceTopFrame(target, initiator.stack);
         } else {
           this.linkifiedInitiatorAnchor = linkifier.linkifyScriptLocation(
-              target, initiator.scriptId, initiator.url, initiator.lineNumber,
-              {columnNumber: initiator.columnNumber, inlineFrameIndex: 0});
+              target, initiator.scriptId, initiator.url, initiator.lineNumber, {columnNumber: initiator.columnNumber});
         }
         UI.Tooltip.Tooltip.install((this.linkifiedInitiatorAnchor), '');
         cell.appendChild(this.linkifiedInitiatorAnchor);

package/front_end/panels/network/NetworkLogView.ts

@@ -505,6 +505,11 @@ const UIStrings = {
    * @description Context menu item in Network panel to assess security headers of a request via AI.
    */
   assessSecurityHeaders: 'Assess security headers',
+  /**
+   * @description A comment in a generated command indicating that the URL scheme is unsupported. The placeholder is the comment prefix (e.g. '//' or '#').
+   * @example {//} PH1
+   */
+  unsupportedUrlScheme: '{PH1} Unsupported URL scheme',
 } as const;
 const str_ = i18n.i18n.registerUIStrings('panels/network/NetworkLogView.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
@@ -557,6 +562,8 @@ export class NetworkLogView extends Common.ObjectWrapper.eventMixin<EventTypes,
   private readonly textFilterSetting: Common.Settings.Setting<string>;
   private networkRequestToNode: WeakMap<SDK.NetworkRequest.NetworkRequest, NetworkRequestNode>;
 
+  static #allowedSchemes = new Set(['http:', 'https:', 'ws:', 'wss:', 'data:']);
+
   constructor(
       filterBar: UI.FilterBar.FilterBar, progressBarContainer: Element,
       networkLogLargeRowsSetting: Common.Settings.Setting<boolean>) {
@@ -2319,6 +2326,18 @@ export class NetworkLogView extends Common.ObjectWrapper.eventMixin<EventTypes,
     return requests.filter(request => !request.isBlobRequest());
   }
 
+  static #getValidClipboardUrl(url: string): Platform.DevToolsPath.UrlString|null {
+    try {
+      const parsedUrl = new URL(url);
+      if (!NetworkLogView.#allowedSchemes.has(parsedUrl.protocol)) {
+        return null;
+      }
+      return url as Platform.DevToolsPath.UrlString;
+    } catch {
+      return null;
+    }
+  }
+
   private async generateFetchCall(request: SDK.NetworkRequest.NetworkRequest, style: FetchStyle): Promise<string> {
     const ignoredHeaders = new Set<string>([
       // Internal headers
@@ -2355,7 +2374,11 @@ export class NetworkLogView extends Common.ObjectWrapper.eventMixin<EventTypes,
 
     const credentialHeaders = new Set<string>(['cookie', 'authorization']);
 
-    const url = JSON.stringify(request.url());
+    const validUrl = NetworkLogView.#getValidClipboardUrl(request.url());
+    if (!validUrl) {
+      return i18nString(UIStrings.unsupportedUrlScheme, {PH1: '//'});
+    }
+    const url = JSON.stringify(validUrl);
 
     const requestHeaders = request.requestHeaders();
     const headerData: Headers = requestHeaders.reduce((result, header) => {
@@ -2507,11 +2530,11 @@ export class NetworkLogView extends Common.ObjectWrapper.eventMixin<EventTypes,
     // (it may be different from the inspected page platform).
     const escapeString = platform === 'win' ? escapeStringWin : escapeStringPosix;
 
-    // The shell escaping above protects the *shell* parser, but not curl's own
-    // argv parser: if the (HAR-imported) URL begins with '-', curl will parse
-    // it as an option (e.g. "-K//host/share/file" -> --config UNC path).
-    // Passing the URL via --url forces curl to treat it as a URL operand.
-    command.push('--url ' + escapeString(request.url()).replace(/[[{}\]]/g, '\\$&'));
+    const validUrl = NetworkLogView.#getValidClipboardUrl(request.url());
+    if (!validUrl) {
+      return i18nString(UIStrings.unsupportedUrlScheme, {PH1: '#'});
+    }
+    command.push('--url ' + escapeString(validUrl).replace(/[[{}\]]/g, '\\$&'));
 
     let inferredMethod = 'GET';
     const data = [];
@@ -2617,7 +2640,11 @@ export class NetworkLogView extends Common.ObjectWrapper.eventMixin<EventTypes,
       return null;
     }
 
-    command.push('-Uri ' + escapeString(request.url()));
+    const validUrl = NetworkLogView.#getValidClipboardUrl(request.url());
+    if (!validUrl) {
+      return i18nString(UIStrings.unsupportedUrlScheme, {PH1: '#'});
+    }
+    command.push('-Uri ' + escapeString(validUrl));
 
     if (request.requestMethod !== 'GET') {
       command.push('-Method ' + escapeString(request.requestMethod));

package/front_end/panels/profiler/HeapProfileView.ts

@@ -628,7 +628,6 @@ export class NodeFormatter implements Formatter {
     const target = heapProfilerModel ? heapProfilerModel.target() : null;
     const options = {
       className: 'profile-node-file',
-      inlineFrameIndex: 0,
     };
     return this.profileView.linkifier().maybeLinkifyConsoleCallFrame(target, node.profileNode.callFrame, options);
   }

package/front_end/panels/profiler/HeapSnapshotGridNodes.ts

@@ -1467,7 +1467,6 @@ export class AllocationGridNode extends HeapSnapshotGridNode {
           String(allocationNode.scriptId) as Protocol.Runtime.ScriptId,
           allocationNode.scriptName as Platform.DevToolsPath.UrlString, allocationNode.line - 1, {
             columnNumber: allocationNode.column - 1,
-            inlineFrameIndex: 0,
             className: 'profile-node-file',
           });
       urlElement.style.maxWidth = '75%';

package/front_end/panels/profiler/HeapSnapshotView.ts

@@ -1949,7 +1949,7 @@ export class HeapAllocationStackView extends UI.Widget.Widget {
         continue;
       }
       const target = this.heapProfilerModel ? this.heapProfilerModel.target() : null;
-      const options = {columnNumber: frame.column - 1, inlineFrameIndex: 0};
+      const options = {columnNumber: frame.column - 1};
       const urlElement = this.linkifier.linkifyScriptLocation(
           target, String(frame.scriptId) as Protocol.Runtime.ScriptId,
           frame.scriptName as Platform.DevToolsPath.UrlString, frame.line - 1, options);

package/front_end/panels/profiler/IsolateSelector.ts

@@ -66,8 +66,10 @@ export class IsolateSelector extends UI.Widget.VBox implements UI.ListControl.Li
   totalValueDiv: HTMLElement;
   readonly totalTrendDiv: HTMLElement;
 
-  constructor() {
-    super();
+  // `devtools-widget` passes its host element into widget constructors.
+  // Accept and forward it so this widget attaches to that host element.
+  constructor(element?: HTMLElement) {
+    super(element);
 
     this.items = new UI.ListModel.ListModel();
     this.list = new UI.ListControl.ListControl(this.items, this, UI.ListControl.ListMode.NonViewport);