chrome-devtools-frontend 1.0.1613625 → 1.0.1615539

package/front_end/models/stack_trace/DetailedErrorStackParser.ts

@@ -0,0 +1,161 @@
+// 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 type * as Platform from '../../core/platform/platform.js';
+import type * as Protocol from '../../generated/protocol.js';
+
+import type {RawFrame} from './Trie.js';
+
+/**
+ * Takes a V8 Error#stack string and extracts structured information.
+ */
+export function parseRawFramesFromErrorStack(stack: string): RawFrame[] {
+  const lines = stack.split('\n');
+  const rawFrames: RawFrame[] = [];
+  for (const line of lines) {
+    const match = /^\s*at\s+(.*)/.exec(line);
+    if (!match) {
+      continue;
+    }
+
+    let lineContent = match[1];
+    let isAsync = false;
+    if (lineContent.startsWith('async ')) {
+      isAsync = true;
+      lineContent = lineContent.substring(6);
+    }
+
+    let isConstructor = false;
+    if (lineContent.startsWith('new ')) {
+      isConstructor = true;
+      lineContent = lineContent.substring(4);
+    }
+
+    let functionName = '';
+    let url = '';
+    let lineNumber = -1;
+    let columnNumber = -1;
+    let typeName: string|undefined;
+    let methodName: string|undefined;
+    let isEval = false;
+    let isWasm = false;
+    let wasmModuleName: string|undefined;
+    let wasmFunctionIndex: number|undefined;
+    let promiseIndex: number|undefined;
+    let evalOrigin: RawFrame|undefined;
+
+    const openParenIndex = lineContent.indexOf(' (');
+    if (lineContent.endsWith(')') && openParenIndex !== -1) {
+      functionName = lineContent.substring(0, openParenIndex).trim();
+      let location = lineContent.substring(openParenIndex + 2, lineContent.length - 1);
+
+      if (location.startsWith('eval at ')) {
+        isEval = true;
+        const commaIndex = location.lastIndexOf(', ');
+        let evalOriginStr = location;
+        if (commaIndex !== -1) {
+          evalOriginStr = location.substring(0, commaIndex);
+          location = location.substring(commaIndex + 2);
+        } else {
+          location = '';
+        }
+
+        if (evalOriginStr.startsWith('eval at ')) {
+          evalOriginStr = evalOriginStr.substring(8);
+        }
+        const innerOpenParen = evalOriginStr.indexOf(' (');
+        let evalFunctionName = evalOriginStr;
+        let evalLocation = '';
+        if (innerOpenParen !== -1) {
+          evalFunctionName = evalOriginStr.substring(0, innerOpenParen).trim();
+          evalLocation = evalOriginStr.substring(innerOpenParen + 2, evalOriginStr.length - 1);
+          evalOrigin = parseRawFramesFromErrorStack(`    at ${evalFunctionName} (${evalLocation})`)[0];
+        } else {
+          evalOrigin = parseRawFramesFromErrorStack(`    at ${evalFunctionName}`)[0];
+        }
+      }
+
+      if (location.startsWith('index ')) {
+        promiseIndex = parseInt(location.substring(6), 10);
+        url = '';
+      } else if (location.includes(':wasm-function[')) {
+        isWasm = true;
+        const wasmMatch = /^(.*):wasm-function\[(\d+)\]:(0x[0-9a-fA-F]+)$/.exec(location);
+        if (wasmMatch) {
+          url = wasmMatch[1];
+          wasmFunctionIndex = parseInt(wasmMatch[2], 10);
+          columnNumber = parseInt(wasmMatch[3], 16);
+        }
+      } else {
+        const splitResult = Common.ParsedURL.ParsedURL.splitLineAndColumn(location);
+        url = splitResult.url;
+        lineNumber = splitResult.lineNumber ?? -1;
+        columnNumber = splitResult.columnNumber ?? -1;
+      }
+    } else {
+      const splitResult = Common.ParsedURL.ParsedURL.splitLineAndColumn(lineContent);
+      url = splitResult.url;
+      lineNumber = splitResult.lineNumber ?? -1;
+      columnNumber = splitResult.columnNumber ?? -1;
+    }
+
+    // Handle "typeName.methodName [as alias]"
+    if (functionName) {
+      const aliasMatch = /(.*)\s+\[as\s+(.*)\]/.exec(functionName);
+      if (aliasMatch) {
+        methodName = aliasMatch[2];
+        functionName = aliasMatch[1];
+      }
+
+      const dotIndex = functionName.indexOf('.');
+      if (dotIndex !== -1) {
+        typeName = functionName.substring(0, dotIndex);
+        methodName = methodName ?? functionName.substring(dotIndex + 1);
+      }
+
+      if (isWasm && typeName) {
+        wasmModuleName = typeName;
+      }
+    }
+
+    rawFrames.push({
+      url: url as Platform.DevToolsPath.UrlString,
+      functionName,
+      lineNumber,
+      columnNumber,
+      parsedFrameInfo: {
+        isAsync,
+        isConstructor,
+        isEval,
+        evalOrigin,
+        isWasm,
+        wasmModuleName,
+        wasmFunctionIndex,
+        typeName,
+        methodName,
+        promiseIndex,
+      },
+    });
+  }
+  return rawFrames;
+}
+
+/**
+ * Error#stack output only contains script URLs. In some cases we are able to
+ * retrieve additional exception details from V8 that we can use to augment
+ * the parsed Error#stack with script IDs.
+ */
+export function augmentRawFramesWithScriptIds(
+    rawFrames: RawFrame[], protocolStackTrace: Protocol.Runtime.StackTrace): void {
+  for (const rawFrame of rawFrames) {
+    const protocolFrame = protocolStackTrace.callFrames.find(
+        frame => rawFrame.url === frame.url && rawFrame.lineNumber === frame.lineNumber &&
+            rawFrame.columnNumber === frame.columnNumber);
+    if (protocolFrame) {
+      // @ts-expect-error scriptId is a readonly property.
+      rawFrame.scriptId = protocolFrame.scriptId;
+    }
+  }
+}

package/front_end/models/stack_trace/StackTrace.ts

@@ -8,6 +8,7 @@ import type * as Workspace from '../workspace/workspace.js';
 
 export type StackTrace = BaseStackTrace<Fragment>;
 export type DebuggableStackTrace = BaseStackTrace<DebuggableFragment>;
+export type ParsedErrorStackTrace = BaseStackTrace<ParsedErrorStackFragment>;
 
 export interface BaseStackTrace<SyncFragmentT extends Fragment> extends Common.EventTarget.EventTarget<EventTypes> {
   readonly syncFragment: SyncFragmentT;
@@ -26,6 +27,10 @@ export interface DebuggableFragment {
   readonly frames: readonly DebuggableFrame[];
 }
 
+export interface ParsedErrorStackFragment {
+  readonly frames: readonly ParsedErrorStackFrame[];
+}
+
 export interface Frame {
   readonly url?: string;
   readonly uiSourceCode?: Workspace.UISourceCode.UISourceCode;
@@ -41,6 +46,19 @@ export interface Frame {
   readonly rawName?: string;
 }
 
+export interface ParsedErrorStackFrame extends Frame {
+  readonly isAsync?: boolean;
+  readonly isConstructor?: boolean;
+  readonly isEval?: boolean;
+  readonly evalOrigin?: ParsedErrorStackFrame;
+  readonly isWasm?: boolean;
+  readonly wasmModuleName?: string;
+  readonly wasmFunctionIndex?: number;
+  readonly typeName?: string;
+  readonly methodName?: string;
+  readonly promiseIndex?: number;
+}
+
 export interface DebuggableFrame extends Frame {
   readonly sdkFrame: SDK.DebuggerModel.CallFrame;
 }

package/front_end/models/stack_trace/StackTraceImpl.ts

@@ -7,11 +7,12 @@ import type * as SDK from '../../core/sdk/sdk.js';
 import type * as Workspace from '../workspace/workspace.js';
 
 import type * as StackTrace from './stack_trace.js';
-import type {FrameNode} from './Trie.js';
+import type {FrameNode, ParsedFrameInfo} from './Trie.js';
 
-export type AnyStackTraceImpl = StackTraceImpl<FragmentImpl|DebuggableFragmentImpl>;
+export type AnyStackTraceImpl = StackTraceImpl<FragmentImpl|DebuggableFragmentImpl|ParsedErrorStackFragmentImpl>;
 
-export class StackTraceImpl<SyncFragmentT extends FragmentImpl|DebuggableFragmentImpl = FragmentImpl> extends
+export class StackTraceImpl<SyncFragmentT extends FragmentImpl|DebuggableFragmentImpl|ParsedErrorStackFragmentImpl =
+                                                      FragmentImpl> extends
     Common.ObjectWrapper.ObjectWrapper<StackTrace.StackTrace.EventTypes> implements
         StackTrace.StackTrace.BaseStackTrace<SyncFragmentT> {
   readonly syncFragment: SyncFragmentT;
@@ -23,7 +24,9 @@ export class StackTraceImpl<SyncFragmentT extends FragmentImpl|DebuggableFragmen
     this.asyncFragments = asyncFragments;
 
     const fragment =
-        syncFragment instanceof DebuggableFragmentImpl ? syncFragment.fragment : syncFragment as FragmentImpl;
+        (syncFragment instanceof DebuggableFragmentImpl || syncFragment instanceof ParsedErrorStackFragmentImpl) ?
+        syncFragment.fragment :
+        syncFragment as FragmentImpl;
     fragment.stackTraces.add(this);
 
     this.asyncFragments.forEach(asyncFragment => asyncFragment.fragment.stackTraces.add(this));
@@ -99,6 +102,95 @@ export class FrameImpl implements StackTrace.StackTrace.Frame {
   }
 }
 
+export class ParsedErrorStackFragmentImpl implements StackTrace.StackTrace.ParsedErrorStackFragment {
+  constructor(readonly fragment: FragmentImpl) {
+  }
+
+  get frames(): ParsedErrorStackFrameImpl[] {
+    if (!this.fragment.node) {
+      return [];
+    }
+
+    const frames: ParsedErrorStackFrameImpl[] = [];
+
+    for (const node of this.fragment.node.getCallStack()) {
+      for (const frame of node.frames) {
+        frames.push(new ParsedErrorStackFrameImpl(frame, node.parsedFrameInfo, node.evalOriginFrames));
+      }
+    }
+
+    return frames;
+  }
+}
+
+export class ParsedErrorStackFrameImpl implements StackTrace.StackTrace.ParsedErrorStackFrame {
+  readonly #frame: FrameImpl;
+  readonly #parsedFrameInfo?: ParsedFrameInfo;
+  readonly #evalOriginFrames?: FrameImpl[];
+
+  constructor(frame: FrameImpl, parsedFrameInfo?: ParsedFrameInfo, evalOriginFrames?: FrameImpl[]) {
+    this.#frame = frame;
+    this.#parsedFrameInfo = parsedFrameInfo;
+    this.#evalOriginFrames = evalOriginFrames;
+  }
+
+  get url(): string|undefined {
+    return this.#frame.url;
+  }
+  get uiSourceCode(): Workspace.UISourceCode.UISourceCode|undefined {
+    return this.#frame.uiSourceCode;
+  }
+  get name(): string|undefined {
+    return this.#frame.name;
+  }
+  get line(): number {
+    return this.#frame.line;
+  }
+  get column(): number {
+    return this.#frame.column;
+  }
+  get missingDebugInfo(): StackTrace.StackTrace.MissingDebugInfo|undefined {
+    return this.#frame.missingDebugInfo;
+  }
+  get rawName(): string|undefined {
+    return this.#frame.rawName;
+  }
+
+  get isAsync(): boolean|undefined {
+    return this.#parsedFrameInfo?.isAsync;
+  }
+  get isConstructor(): boolean|undefined {
+    return this.#parsedFrameInfo?.isConstructor;
+  }
+  get isEval(): boolean|undefined {
+    return this.#parsedFrameInfo?.isEval;
+  }
+  get evalOrigin(): ParsedErrorStackFrameImpl|undefined {
+    if (!this.#evalOriginFrames || this.#evalOriginFrames.length === 0) {
+      return undefined;
+    }
+    return new ParsedErrorStackFrameImpl(this.#evalOriginFrames[0], this.#parsedFrameInfo?.evalOrigin?.parsedFrameInfo);
+  }
+  get isWasm(): boolean|undefined {
+    return this.#parsedFrameInfo?.isWasm;
+  }
+  get wasmModuleName(): string|undefined {
+    return this.#parsedFrameInfo?.wasmModuleName;
+  }
+  get wasmFunctionIndex(): number|undefined {
+    return this.#parsedFrameInfo?.wasmFunctionIndex;
+  }
+  get typeName(): string|undefined {
+    return this.#parsedFrameInfo?.typeName;
+  }
+  get methodName(): string|undefined {
+    return this.#parsedFrameInfo?.methodName;
+  }
+  get promiseIndex(): number|undefined {
+    return this.#parsedFrameInfo?.promiseIndex;
+  }
+}
+
 /**
  * A DebuggableFragmentImpl wraps an existing FragmentImpl. This is important: We can pause at the
  * same location multiple times and the paused information changes each and everytime while the underlying

package/front_end/models/stack_trace/StackTraceModel.ts

@@ -6,6 +6,7 @@ import * as Common from '../../core/common/common.js';
 import * as SDK from '../../core/sdk/sdk.js';
 import type * as Protocol from '../../generated/protocol.js';
 
+import {augmentRawFramesWithScriptIds, parseRawFramesFromErrorStack} from './DetailedErrorStackParser.js';
 // eslint-disable-next-line @devtools/es-modules-import
 import * as StackTrace from './stack_trace.js';
 import {
@@ -14,6 +15,7 @@ import {
   DebuggableFragmentImpl,
   FragmentImpl,
   FrameImpl,
+  ParsedErrorStackFragmentImpl,
   StackTraceImpl
 } from './StackTraceImpl.js';
 import {type FrameNode, type RawFrame, Trie} from './Trie.js';
@@ -54,6 +56,23 @@ export class StackTraceModel extends SDK.SDKModel.SDKModel<unknown> {
     return new StackTraceImpl(syncFragment, asyncFragments);
   }
 
+  async createFromErrorStackLikeString(
+      stack: string, rawFramesToUIFrames: TranslateRawFrames,
+      exceptionDetails?: Protocol.Runtime.ExceptionDetails): Promise<StackTrace.StackTrace.ParsedErrorStackTrace> {
+    const rawFrames = parseRawFramesFromErrorStack(stack);
+    if (exceptionDetails?.stackTrace) {
+      augmentRawFramesWithScriptIds(rawFrames, exceptionDetails.stackTrace);
+    }
+
+    const [syncFragment, asyncFragments] = await Promise.all([
+      this.#createFragment(rawFrames, rawFramesToUIFrames),
+      exceptionDetails?.stackTrace ? this.#createAsyncFragments(exceptionDetails.stackTrace, rawFramesToUIFrames) :
+                                     Promise.resolve([]),
+    ]);
+
+    return new StackTraceImpl(new ParsedErrorStackFragmentImpl(syncFragment), asyncFragments);
+  }
+
   async createFromDebuggerPaused(
       pausedDetails: SDK.DebuggerModel.DebuggerPausedDetails,
       rawFramesToUIFrames: TranslateRawFrames): Promise<StackTrace.StackTrace.DebuggableStackTrace> {
@@ -162,12 +181,32 @@ export class StackTraceModel extends SDK.SDKModel.SDKModel<unknown> {
     const uiFrames = await rawFramesToUIFrames(rawFrames, this.target());
     console.assert(rawFrames.length === uiFrames.length, 'Broken rawFramesToUIFrames implementation');
 
+    const evalOriginPromises: Array<ReturnType<TranslateRawFrames>> = [];
+    for (const node of fragment.node.getCallStack()) {
+      if (node.parsedFrameInfo?.evalOrigin) {
+        // Evaluate each eval origin individually, as they are not a contiguous stack trace.
+        evalOriginPromises.push(rawFramesToUIFrames([node.parsedFrameInfo.evalOrigin], this.target()));
+      }
+    }
+
+    const evalUiFrames = await Promise.all(evalOriginPromises);
+
     let i = 0;
+    let evalI = 0;
     for (const node of fragment.node.getCallStack()) {
       node.frames = uiFrames[i++].map(
           frame => new FrameImpl(
               frame.url, frame.uiSourceCode, frame.name, frame.line, frame.column, frame.missingDebugInfo,
               node.rawFrame.functionName));
+
+      if (node.parsedFrameInfo?.evalOrigin) {
+        const evalOriginRawFrame = node.parsedFrameInfo.evalOrigin;
+        // evalUiFrames[evalI] is Array<Array<Frame>>, and since we passed a 1-element array, we take [0]
+        node.evalOriginFrames = evalUiFrames[evalI++][0].map(
+            frame => new FrameImpl(
+                frame.url, frame.uiSourceCode, frame.name, frame.line, frame.column, frame.missingDebugInfo,
+                evalOriginRawFrame.functionName));
+      }
     }
   }
 

package/front_end/models/stack_trace/Trie.ts

@@ -6,6 +6,19 @@ import type * as Protocol from '../../generated/protocol.js';
 
 import type {FragmentImpl, FrameImpl} from './StackTraceImpl.js';
 
+export interface ParsedFrameInfo {
+  readonly isAsync?: boolean;
+  readonly isConstructor?: boolean;
+  readonly isEval?: boolean;
+  readonly evalOrigin?: RawFrame;
+  readonly isWasm?: boolean;
+  readonly wasmModuleName?: string;
+  readonly wasmFunctionIndex?: number;
+  readonly typeName?: string;
+  readonly methodName?: string;
+  readonly promiseIndex?: number;
+}
+
 /**
  * Intentionally very close to a {@link Protocol.Runtime.CallFrame} but with optional `scriptId`.
  */
@@ -15,6 +28,8 @@ export interface RawFrame {
   readonly functionName?: string;
   readonly lineNumber: number;
   readonly columnNumber: number;
+
+  readonly parsedFrameInfo?: ParsedFrameInfo;
 }
 
 /**
@@ -42,10 +57,13 @@ export class FrameNode implements FrameNodeBase<FrameNode, AnyFrameNode> {
   frames: FrameImpl[] = [];
 
   fragment?: FragmentImpl;
+  parsedFrameInfo?: ParsedFrameInfo;
+  evalOriginFrames?: FrameImpl[];
 
   constructor(rawFrame: RawFrame, parent: AnyFrameNode) {
     this.rawFrame = rawFrame;
     this.parent = parent;
+    this.parsedFrameInfo = rawFrame.parsedFrameInfo;
   }
 
   /**
@@ -98,6 +116,9 @@ export class Trie {
 
       const compareResult = compareRawFrames(child.rawFrame, rawFrame);
       if (compareResult === 0) {
+        if (rawFrame.parsedFrameInfo && !child.parsedFrameInfo) {
+          child.parsedFrameInfo = rawFrame.parsedFrameInfo;
+        }
         return child;
       }
       if (compareResult > 0) {

package/front_end/models/stack_trace/stack_trace_impl.ts

@@ -2,11 +2,13 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+import * as DetailedErrorStackParser from './DetailedErrorStackParser.js';
 import * as StackTraceImpl from './StackTraceImpl.js';
 import * as StackTraceModel from './StackTraceModel.js';
 import * as Trie from './Trie.js';
 
 export {
+  DetailedErrorStackParser,
   StackTraceImpl,
   StackTraceModel,
   Trie,

package/front_end/panels/ai_assistance/components/AccessibilityAgentMarkdownRenderer.ts

@@ -13,6 +13,18 @@ import {MarkdownRendererWithCodeBlock} from './MarkdownRendererWithCodeBlock.js'
 const {html} = Lit.StaticHtml;
 const {until} = Lit.Directives;
 
+/**
+ * Represents the different types of links that can be parsed from the AI agent's response.
+ * The agent can linkify a node either by its backend node ID or by its full DOM path.
+ */
+type ParsedLink = {
+  type: 'path',
+  path: string,
+}|{
+  type: 'node',
+  nodeId: Protocol.DOM.BackendNodeId,
+};
+
 export class AccessibilityAgentMarkdownRenderer extends MarkdownRendererWithCodeBlock {
   constructor(
       private mainFrameId = '',
@@ -22,28 +34,54 @@ export class AccessibilityAgentMarkdownRenderer extends MarkdownRendererWithCode
 
   override templateForToken(token: Marked.Marked.MarkedToken): Lit.LitTemplate|null {
     if (token.type === 'link' && token.href.startsWith('#')) {
-      if (token.href.startsWith('#path-')) {
-        const path = token.href.replace('#path-', '');
-        return html`<span>${
-            until(this.#linkifyPath(path, token.text).then(node => node || token.text), token.text)}</span>`;
-      }
+      const parsed = this.#parseLink(token.href);
+      if (parsed) {
+        const resultPromise = parsed.type === 'path' ? this.#linkifyPath(parsed.path, token.text) :
+                                                       this.#linkifyNode(parsed.nodeId, token.text);
 
-      let nodeId = undefined;
-      if (token.href.startsWith('#node-')) {
-        nodeId = Number(token.href.replace('#node-', '')) as Protocol.DOM.BackendNodeId;
-      } else if (token.href.startsWith('#')) {
-        nodeId = Number(token.href.replace('#', '')) as Protocol.DOM.BackendNodeId;
+        return html`<span>${until(resultPromise.then(node => node || token.text), token.text)}</span>`;
       }
+    }
+
+    return super.templateForToken(token);
+  }
 
-      if (nodeId) {
-        return html`<span>${
-            until(this.#linkifyNode(nodeId, token.text).then(node => node || token.text), token.text)}</span>`;
+  /**
+   * Parses a link href to determine if it's a node ID or a DOM path.
+   *
+   * The AI agent is instructed to use #node-ID or #path-PATH, but
+   * sometimes it omits the prefixes, in which case we try to detect
+   * paths by looking for `#1,HTML` which is often how paths in LH
+   * start.
+   */
+  #parseLink(href: string): ParsedLink|null {
+    if (href.startsWith('#path-')) {
+      return {type: 'path', path: href.replace('#path-', '')};
+    }
+    if (href.startsWith('#1,HTML')) {
+      return {type: 'path', path: href.slice(1)};
+    }
+
+    let nodeIdStr = '';
+    if (href.startsWith('#node-')) {
+      nodeIdStr = href.replace('#node-', '');
+    } else if (href.startsWith('#')) {
+      nodeIdStr = href.slice(1);
+    }
+
+    if (nodeIdStr.trim() !== '') {
+      const nodeId = Number(nodeIdStr);
+      if (Number.isInteger(nodeId)) {
+        return {type: 'node', nodeId: nodeId as Protocol.DOM.BackendNodeId};
       }
     }
 
-    return super.templateForToken(token);
+    return null;
   }
 
+  /**
+   * Linkifies a node using its backend node ID.
+   */
   async #linkifyNode(backendNodeId: Protocol.DOM.BackendNodeId, label: string): Promise<Lit.LitTemplate|undefined> {
     if (backendNodeId === undefined) {
       return;
@@ -68,6 +106,9 @@ export class AccessibilityAgentMarkdownRenderer extends MarkdownRendererWithCode
     return linkedNode;
   }
 
+  /**
+   * Linkifies a node using its full DOM path (e.g. "1,HTML,1,BODY,...").
+   */
   async #linkifyPath(path: string, label: string): Promise<Lit.LitTemplate|undefined> {
     const target = SDK.TargetManager.TargetManager.instance().primaryPageTarget();
     const domModel = target?.model(SDK.DOMModel.DOMModel);

package/front_end/panels/ai_assistance/components/ChatView.ts

@@ -96,7 +96,7 @@ export interface Props {
   };
 }
 
-interface ChatWidgetInput extends Props {
+export interface ChatWidgetInput extends Props {
   handleScroll: (ev: Event) => void;
   handleSuggestionClick: (title: string) => void;
   handleMessageContainerRef: (el: Element|undefined) => void;
@@ -367,12 +367,13 @@ export class ChatView extends HTMLElement {
   };
 
   async #getSummary(): Promise<string> {
-    if (this.#cachedSummary?.markdown === this.#props.conversationMarkdown) {
+    const cacheKey = this.#props.conversationMarkdown.replace(/\*\*Export Timestamp \(UTC\):\*\* .*\n\n/, '');
+    if (this.#cachedSummary?.markdown === cacheKey) {
       return this.#cachedSummary.summary;
     }
     try {
       const summary = await this.#props.generateConversationSummary(this.#props.conversationMarkdown);
-      this.#cachedSummary = {markdown: this.#props.conversationMarkdown, summary};
+      this.#cachedSummary = {markdown: cacheKey, summary};
       return summary;
     } catch (err) {
       console.error(err);

package/front_end/panels/ai_assistance/components/ExportForAgentsDialog.ts

@@ -123,7 +123,10 @@ export const DEFAULT_VIEW: View = (input, _output, target): void => {
             ${i18nString(UIStrings.generatingSummary)}
           </span>
           ` : Lit.nothing}
-        <textarea readonly .value=${isPrompt && input.state.isPromptLoading ? '' : exportText}></textarea>
+        ${isPrompt ?
+          html`<textarea class="prompt" readonly .value=${input.state.isPromptLoading ? '' : exportText}></textarea>` :
+          html`<textarea class="conversation" readonly .value=${exportText}></textarea>`
+        }
       </main>
       <div class="disclaimer">${i18nString(UIStrings.disclaimer)}</div>
       <footer>

package/front_end/panels/ai_assistance/components/optInChangeDialog.css

@@ -25,7 +25,7 @@
     gap: var(--sys-size-8);
     margin-bottom: var(--sys-size-8);
 
-    h2 {
+    h1 {
       margin: 0;
       color: var(--sys-color-on-surface);
       font: var(--sys-typescale-headline5);
@@ -47,7 +47,6 @@
       devtools-icon {
         width: var(--sys-size-9);
         height: var(--sys-size-9);
-        color: var(--sys-color-on-primary);
       }
     }
   }