chrome-devtools-frontend 1.0.1650035 → 1.0.1650232

package/front_end/models/ai_assistance/AiConversation.ts

@@ -11,7 +11,7 @@ import type * as Trace from '../../models/trace/trace.js';
 import * as Greendev from '../greendev/greendev.js';
 import type * as NetworkTimeCalculator from '../network_time_calculator/network_time_calculator.js';
 
-import {AccessibilityAgent, AccessibilityContext} from './agents/AccessibilityAgent.js';
+import {AccessibilityAgent} from './agents/AccessibilityAgent.js';
 import {
   type AgentOptions,
   type AiAgent,
@@ -33,6 +33,7 @@ import {StylingAgent} from './agents/StylingAgent.js';
 import {AiAgent2} from './AiAgent2.js';
 import {AiHistoryStorage, ConversationType, type SerializedConversation} from './AiHistoryStorage.js';
 import type {ChangeManager} from './ChangeManager.js';
+import {AccessibilityContext} from './contexts/AccessibilityContext.js';
 import {DOMNodeContext} from './contexts/DOMNodeContext.js';
 import {FileContext} from './contexts/FileContext.js';
 import {RequestContext} from './contexts/RequestContext.js';

package/front_end/models/ai_assistance/agents/AccessibilityAgent.ts

@@ -19,9 +19,8 @@ import {ToolRegistry} from '../tools/ToolRegistry.js';
 import {
   AiAgent,
   type AiWidget,
-  type ContextDetail,
   type ContextResponse,
-  ConversationContext,
+  type ConversationContext,
   type RequestOptions,
   ResponseType,
 } from './AiAgent.js';
@@ -81,31 +80,6 @@ If the user asks a question that requires an investigation of a problem, use thi
     - [Suggestion 2]
 `;
 
-export class AccessibilityContext extends ConversationContext<LHModel.ReporterTypes.ReportJSON> {
-  #lh: LHModel.ReporterTypes.ReportJSON;
-
-  constructor(report: LHModel.ReporterTypes.ReportJSON) {
-    super();
-    this.#lh = report;
-  }
-
-  #url(): string {
-    return this.#lh.finalUrl ?? this.#lh.finalDisplayedUrl;
-  }
-
-  override getURL(): string {
-    return this.#url();
-  }
-
-  override getItem(): LHModel.ReporterTypes.ReportJSON {
-    return this.#lh;
-  }
-
-  override getTitle(): string {
-    return `Lighthouse report: ${this.#url()}`;
-  }
-}
-
 /**
  * One agent instance handles one conversation. Create a new agent
  * instance for a new conversation.
@@ -184,10 +158,13 @@ export class AccessibilityAgent extends AiAgent<LHModel.ReporterTypes.ReportJSON
       return;
     }
 
-    yield {
-      type: ResponseType.CONTEXT,
-      details: this.#createContextDetails(lhr),
-    };
+    const details = await lhr.getUserFacingDetails();
+    if (details) {
+      yield {
+        type: ResponseType.CONTEXT,
+        details,
+      };
+    }
   }
 
   async #resolvePathToNode(path: string): Promise<SDK.DOMModel.DOMNode|null> {
@@ -517,38 +494,14 @@ export class AccessibilityAgent extends AiAgent<LHModel.ReporterTypes.ReportJSON
     });
   }
 
-  /**
-   * This is the initial payload we send at the start of a conversation.
-   * Because the agent is focused on Accessibility, we include the
-   * Accessibility Audits summary in the payload to avoid an extra round step of
-   * the AI querying them.
-   */
-  #getInitialPayload(context: ConversationContext<LHModel.ReporterTypes.ReportJSON>): string {
-    const report = context.getItem();
-    const formatter = new LighthouseFormatter();
-    const summary = formatter.summary(report);
-    const audits = formatter.audits(report, 'accessibility');
-    const allFailed = Object.values(report.categories).every(category => category.score === null);
-    if (allFailed) {
-      return '**CRITICAL**: The Lighthouse report failed to record or all category scores are error/unavailable (n/a). This indicates a failed run or missing data.';
-    }
-    return `# Lighthouse Report:\n${summary}\n${audits}`;
-  }
-
   override async enhanceQuery(query: string, lhr: ConversationContext<LHModel.ReporterTypes.ReportJSON>|null):
       Promise<string> {
     this.clearDeclaredFunctions();
     if (lhr) {
       this.#declareFunctions();
     }
-    const enhancedQuery = lhr ? `${this.#getInitialPayload(lhr)}\n# User request:\n\n` : '';
+    const promptDetails = lhr ? await lhr.getPromptDetails() : null;
+    const enhancedQuery = promptDetails ? `${promptDetails}\n# User request:\n\n` : '';
     return `${enhancedQuery}${query}`;
   }
-
-  #createContextDetails(lhr: ConversationContext<LHModel.ReporterTypes.ReportJSON>):
-      [ContextDetail, ...ContextDetail[]] {
-    return [
-      {title: 'Lighthouse report', text: this.#getInitialPayload(lhr)},
-    ];
-  }
 }

package/front_end/models/ai_assistance/agents/ContextSelectionAgent.ts

@@ -14,13 +14,13 @@ import * as NetworkTimeCalculator from '../../network_time_calculator/network_ti
 import type * as Trace from '../../trace/trace.js';
 import * as Workspace from '../../workspace/workspace.js';
 import {isOpaqueOrigin} from '../AiOrigins.js';
+import {AccessibilityContext} from '../contexts/AccessibilityContext.js';
 import {DOMNodeContext} from '../contexts/DOMNodeContext.js';
 import {FileContext} from '../contexts/FileContext.js';
 import {getRequestContextOrigin, RequestContext} from '../contexts/RequestContext.js';
 import {debugLog} from '../debug.js';
 import {StorageItem} from '../StorageItem.js';
 
-import {AccessibilityContext} from './AccessibilityAgent.js';
 import {
   type AgentOptions,
   AiAgent,

package/front_end/models/ai_assistance/agents/ExecuteJavascript.ts

@@ -179,7 +179,11 @@ export class JavascriptExecutor {
     return error;
   }
 }`;
+    const timeoutSentinel = Symbol('timeout');
+    const {promise: timeoutPromise, resolve: resolveTimeout} = Promise.withResolvers<typeof timeoutSentinel>();
+    let timeoutId: ReturnType<typeof setTimeout>|undefined;
     try {
+      timeoutId = setTimeout(() => resolveTimeout(timeoutSentinel), OBSERVATION_TIMEOUT);
       const result = await Promise.race([
         this.#execJs(
             functionDeclaration,
@@ -188,11 +192,11 @@ export class JavascriptExecutor {
               contextNode: this.#options.getContextNode(),
             },
             ),
-        new Promise<never>((_, reject) => {
-          setTimeout(
-              () => reject(new Error('Script execution exceeded the maximum allowed time.')), OBSERVATION_TIMEOUT);
-        }),
+        timeoutPromise,
       ]);
+      if (result === timeoutSentinel) {
+        throw new Error('Script execution exceeded the maximum allowed time.');
+      }
       const byteCount = Platform.StringUtilities.countWtf8Bytes(result);
       Host.userMetrics.freestylerEvalResponseSize(byteCount);
       if (byteCount > MAX_OBSERVATION_BYTE_LENGTH) {
@@ -217,6 +221,11 @@ export class JavascriptExecutor {
         sideEffect: false,
         canceled: false,
       };
+    } finally {
+      if (timeoutId !== undefined) {
+        clearTimeout(timeoutId);
+      }
+      resolveTimeout(timeoutSentinel);
     }
   }
 }

package/front_end/models/ai_assistance/agents/PerformanceAgent.ts

@@ -6,7 +6,7 @@ import * as Common from '../../../core/common/common.js';
 import * as Host from '../../../core/host/host.js';
 import * as i18n from '../../../core/i18n/i18n.js';
 import type {UrlString} from '../../../core/platform/DevToolsPath.js';
-import * as Platform from '../../../core/platform/platform.js';
+import type * as Platform from '../../../core/platform/platform.js';
 import * as Root from '../../../core/root/root.js';
 import * as SDK from '../../../core/sdk/sdk.js';
 import * as Tracing from '../../../services/tracing/tracing.js';
@@ -936,9 +936,6 @@ export class PerformanceAgent extends AiAgent<AgentFocus> {
       };
     }
 
-    const byteCount = Platform.StringUtilities.countWtf8Bytes(summary);
-    Host.userMetrics.performanceAIMainThreadActivityResponseSize(byteCount);
-
     this.#cacheFunctionResult(focus, cacheKey, summary);
     const widgets: AiWidget[] = [];
     widgets.push({
@@ -1225,9 +1222,6 @@ export class PerformanceAgent extends AiAgent<AgentFocus> {
           };
         }
 
-        const byteCount = Platform.StringUtilities.countWtf8Bytes(summary);
-        Host.userMetrics.performanceAINetworkSummaryResponseSize(byteCount);
-
         const key = `getNetworkTrackSummary({min: ${bounds.min}, max: ${bounds.max}})`;
         this.#cacheFunctionResult(focus, key, summary);
         return {

package/front_end/models/ai_assistance/ai_assistance.ts

@@ -22,6 +22,7 @@ import * as AiOrigins from './AiOrigins.js';
 import * as AiUtils from './AiUtils.js';
 import * as BuiltInAi from './BuiltInAi.js';
 import * as ChangeManager from './ChangeManager.js';
+import * as AccessibilityContext from './contexts/AccessibilityContext.js';
 import * as DOMNodeContext from './contexts/DOMNodeContext.js';
 import * as FileContext from './contexts/FileContext.js';
 import * as RequestContext from './contexts/RequestContext.js';
@@ -50,6 +51,7 @@ import * as ToolRegistry from './tools/ToolRegistry.js';
 
 export {
   AccessibilityAgent,
+  AccessibilityContext,
   AgentProject,
   AiAgent,
   AiAgent2,

package/front_end/models/ai_assistance/contexts/AccessibilityContext.snapshot.txt

@@ -0,0 +1,26 @@
+Title: AccessibilityContext should return prompt details correctly
+Content:
+# Lighthouse Report:
+# Lighthouse Report Summary
+URL: https://example.com
+Fetch Time: 2026-03-12
+Lighthouse Version: 1.0.0
+
+## Category Scores
+- Accessibility: 50
+# Audits for Accessibility
+
+The following audits in this category have a score below 90 and may need attention:
+- **Accessibility Audit**: 50 (Fail)
+  * Description of accessibility audit
+=== end content
+
+Title: AccessibilityContext should return user facing details correctly
+Content:
+[
+  {
+    "title": "Lighthouse report",
+    "text": "# Lighthouse Report:\n# Lighthouse Report Summary\nURL: https://example.com\nFetch Time: 2026-03-12\nLighthouse Version: 1.0.0\n\n## Category Scores\n- Accessibility: 50\n# Audits for Accessibility\n\nThe following audits in this category have a score below 90 and may need attention:\n- **Accessibility Audit**: 50 (Fail)\n  * Description of accessibility audit"
+  }
+]
+=== end content

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

@@ -0,0 +1,63 @@
+// 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 type * as LHModel from '../../lighthouse/lighthouse.js';
+import {type ContextDetail, ConversationContext} from '../agents/AiAgent.js';
+import {LighthouseFormatter} from '../data_formatters/LighthouseFormatter.js';
+
+export class AccessibilityContext extends ConversationContext<LHModel.ReporterTypes.ReportJSON> {
+  readonly #lh: LHModel.ReporterTypes.ReportJSON;
+  #cachedPayload: string|null = null;
+
+  constructor(report: LHModel.ReporterTypes.ReportJSON) {
+    super();
+    this.#lh = report;
+  }
+
+  #url(): string {
+    return this.#lh.finalUrl ?? this.#lh.finalDisplayedUrl;
+  }
+
+  override getURL(): string {
+    return this.#url();
+  }
+
+  override getItem(): LHModel.ReporterTypes.ReportJSON {
+    return this.#lh;
+  }
+
+  override getTitle(): string {
+    return `Lighthouse report: ${this.#url()}`;
+  }
+
+  #getInitialPayload(): string {
+    if (this.#cachedPayload !== null) {
+      return this.#cachedPayload;
+    }
+    const formatter = new LighthouseFormatter();
+    const summary = formatter.summary(this.#lh);
+    const audits = formatter.audits(this.#lh, 'accessibility');
+    const allFailed = Object.values(this.#lh.categories).every(category => category.score === null);
+    if (allFailed) {
+      this.#cachedPayload =
+          '**CRITICAL**: The Lighthouse report failed to record or all category scores are error/unavailable (n/a). This indicates a failed run or missing data.';
+    } else {
+      this.#cachedPayload = `# Lighthouse Report:\n${summary}\n${audits}`;
+    }
+    return this.#cachedPayload;
+  }
+
+  override async getPromptDetails(): Promise<string|null> {
+    return this.#getInitialPayload();
+  }
+
+  override async getUserFacingDetails(): Promise<[ContextDetail, ...ContextDetail[]]|null> {
+    return [
+      {
+        title: 'Lighthouse report',
+        text: this.#getInitialPayload(),
+      },
+    ];
+  }
+}

package/front_end/models/bindings/DebuggerWorkspaceBinding.ts

@@ -7,7 +7,7 @@ import * as Platform from '../../core/platform/platform.js';
 import * as Root from '../../core/root/root.js';
 import * as SDK from '../../core/sdk/sdk.js';
 import * as Protocol from '../../generated/protocol.js';
-import * as StackTrace from '../stack_trace/stack_trace.js';
+import type * as StackTrace from '../stack_trace/stack_trace.js';
 // eslint-disable-next-line @devtools/es-modules-import
 import * as StackTraceImpl from '../stack_trace/stack_trace_impl.js';
 import type * as TextUtils from '../text_utils/text_utils.js';
@@ -254,7 +254,8 @@ export class DebuggerWorkspaceBinding implements SDK.TargetManager.SDKModelObser
 
     const issueSummary = fetchedExceptionDetails?.exceptionMetaData?.issueSummary;
     if (typeof issueSummary === 'string') {
-      errorStack = StackTrace.ErrorStackParser.concatErrorDescriptionAndIssueSummary(errorStack, issueSummary);
+      errorStack =
+          StackTraceImpl.DetailedErrorStackParser.concatErrorDescriptionAndIssueSummary(errorStack, issueSummary);
     }
 
     if (!stackTrace) {

package/front_end/models/stack_trace/DetailedErrorStackParser.ts

@@ -212,3 +212,21 @@ export function augmentRawFramesWithScriptIds(
     augmentFrame(rawFrame);
   }
 }
+
+/**
+ * Combines the error description (essentially the `Error#stack` property value)
+ * with the `issueSummary`.
+ *
+ * @param description the `description` property of the `Error` remote object.
+ * @param issueSummary the optional `issueSummary` of the `exceptionMetaData`.
+ * @returns the enriched description.
+ * @see https://goo.gle/devtools-reduce-network-noise-design
+ */
+export function concatErrorDescriptionAndIssueSummary(description: string, issueSummary: string): string {
+  // Insert the issue summary right after the error message.
+  const pos = description.indexOf('\n');
+  const prefix = pos === -1 ? description : description.substring(0, pos);
+  const suffix = pos === -1 ? '' : description.substring(pos);
+  description = `${prefix}. ${issueSummary}${suffix}`;
+  return description;
+}

package/front_end/models/stack_trace/stack_trace.ts

@@ -2,12 +2,8 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-import * as ErrorStackParser from './ErrorStackParser.js';
 import * as StackTrace from './StackTrace.js';
 
 export {
-  // TODO(crbug.com/485142682): Move to stack_trace_impl.js once all usage
-  // goes through createStackTraceFromErrorObject.
-  ErrorStackParser,
   StackTrace,
 };

package/front_end/panels/accessibility/ARIAAttributesView.ts

@@ -79,6 +79,7 @@ export const DEFAULT_VIEW: View = (input, output, target) => {
                   <devtools-prompt
                     completions=completions
                     class="monospace"
+                    value=${attribute.value}
                     @mousedown=${onStartEditing.bind(null, attribute)}
                     .completionTimeout=${0}
                     ?editing=${input.attributeBeingEdited === attribute}

package/front_end/panels/ai_assistance/AiAssistancePanel.ts

@@ -623,12 +623,12 @@ function createFileContext(file: Workspace.UISourceCode.UISourceCode|null): AiAs
   return new AiAssistanceModel.FileContext.FileContext(file);
 }
 
-function createAccessibilityContext(report: LighthousePanel.LighthousePanel.ActiveLighthouseReport|null):
-    AiAssistanceModel.AccessibilityAgent.AccessibilityContext|null {
+function createAccessibilityContext(report: LighthousePanel.LighthousePanel.ActiveLighthouseReport|
+                                    null): AiAssistanceModel.AccessibilityContext.AccessibilityContext|null {
   if (!report) {
     return null;
   }
-  return new AiAssistanceModel.AccessibilityAgent.AccessibilityContext(report.report);
+  return new AiAssistanceModel.AccessibilityContext.AccessibilityContext(report.report);
 }
 
 function createRequestContext(request: SDK.NetworkRequest.NetworkRequest|
@@ -710,7 +710,7 @@ export class AiAssistancePanel extends UI.Panel.Panel {
   #selectedPerformanceTrace: AiAssistanceModel.PerformanceAgent.PerformanceTraceContext|null = null;
   #selectedRequest: AiAssistanceModel.RequestContext.RequestContext|null = null;
 
-  #selectedAccessibility: AiAssistanceModel.AccessibilityAgent.AccessibilityContext|null = null;
+  #selectedAccessibility: AiAssistanceModel.AccessibilityContext.AccessibilityContext|null = null;
   #selectedStorage: AiAssistanceModel.StorageAgent.StorageContext|null = null;
 
   // Messages displayed in the `ChatView` component.
@@ -1781,7 +1781,7 @@ export class AiAssistancePanel extends UI.Panel.Panel {
     } else if (data instanceof AiAssistanceModel.PerformanceAgent.PerformanceTraceContext) {
       this.#selectedPerformanceTrace = data;
 
-    } else if (data instanceof AiAssistanceModel.AccessibilityAgent.AccessibilityContext) {
+    } else if (data instanceof AiAssistanceModel.AccessibilityContext.AccessibilityContext) {
       this.#selectedAccessibility = data;
     } else if (data instanceof AiAssistanceModel.StorageAgent.StorageContext) {
       this.#selectedStorage = data;

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

@@ -355,7 +355,7 @@ export const DEFAULT_VIEW = (input: ViewInput, _output: ViewOutput, target: HTML
                             PanelUtils.PanelUtils.getIconForNetworkRequest(input.context.getItem()) :
                             input.context instanceof AiAssistanceModel.FileContext.FileContext ?
                             PanelUtils.PanelUtils.getIconForSourceFile(input.context.getItem()) :
-                            input.context instanceof AiAssistanceModel.AccessibilityAgent.AccessibilityContext ?
+                            input.context instanceof AiAssistanceModel.AccessibilityContext.AccessibilityContext ?
                             html`<devtools-icon class="icon" name="performance" title="Lighthouse"></devtools-icon>` :
                             input.context instanceof AiAssistanceModel.PerformanceAgent.PerformanceTraceContext ?
                             html`<devtools-icon class="icon" name="performance" title="Performance"></devtools-icon>` :