chrome-devtools-frontend 1.0.1674545 → 1.0.1676824

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

@@ -0,0 +1,111 @@
+// 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 SDK from '../../../core/sdk/sdk.js';
+import {
+  ConversationContext,
+  type ConversationSuggestions,
+} from '../agents/AiAgent.js';
+import {areOriginsEquivalent} from '../AiOrigins.js';
+import {CookieItem, DOMStorageItem, type StorageItem} from '../StorageItem.js';
+
+export class StorageContext extends ConversationContext<StorageItem> {
+  #item: StorageItem;
+
+  constructor(item: StorageItem) {
+    super();
+    this.#item = item;
+  }
+
+  override getURL(): string {
+    return this.#item.primaryTargetOrigin;
+  }
+
+  override getItem(): StorageItem {
+    return this.#item;
+  }
+
+  override getTitle(): string {
+    if (this.#item instanceof CookieItem) {
+      if (this.#item.name) {
+        return `cookie: ${this.#item.name}${this.#item.origin ? ` ${this.#item.origin}` : ''}`;
+      }
+      return `cookies${this.#item.isGenericContext ? '' : `: ${this.#item.origin}`}`;
+    }
+    if (this.#item instanceof DOMStorageItem) {
+      if (this.#item.key) {
+        return `entry: ${this.#item.key}${this.#item.origin ? ` ${this.#item.origin}` : ''}`;
+      }
+      const prefix = this.#item.type === 'localStorage' ? 'local storage' : 'session storage';
+      return `${prefix}${this.#item.isGenericContext ? '' : `: ${this.#item.origin}`}`;
+    }
+    return `Storage: ${this.getOrigin()}`;
+  }
+
+  /**
+   * @override
+   */
+  override isLoggingEnabled(): boolean {
+    if (this.#item instanceof CookieItem && Boolean(this.#item.name)) {
+      return false;
+    }
+    if (this.#item instanceof DOMStorageItem && Boolean(this.#item.key)) {
+      return false;
+    }
+    return true;
+  }
+
+  override async getSuggestions(): Promise<ConversationSuggestions|undefined> {
+    if (this.#item instanceof CookieItem) {
+      if (this.#item.name) {
+        return [
+          {
+            title: 'Why is this cookie set?',
+            jslogContext: 'storage-cookie',
+          },
+          {
+            title: 'Explain the value of this cookie',
+            jslogContext: 'storage-cookie',
+          },
+        ];
+      }
+      return [
+        {
+          title: 'Explain the cookies set by this page',
+          jslogContext: 'storage-cookie',
+        },
+      ];
+    }
+    if (this.#item instanceof DOMStorageItem) {
+      if (this.#item.key) {
+        return [
+          {
+            title: 'What is the purpose of this storage entry?',
+            jslogContext: 'storage-domstorage',
+          },
+          {
+            title: 'Explain the value of this storage entry',
+            jslogContext: 'storage-domstorage',
+          },
+        ];
+      }
+      return [
+        {
+          title: 'Explain these storage items',
+          jslogContext: 'storage-domstorage',
+        },
+      ];
+    }
+    return undefined;
+  }
+}
+
+export function isSamePageOrigin(target: SDK.Target.Target|null, allowedOrigin: string): boolean {
+  if (!target) {
+    return false;
+  }
+  const pageOrigin = Common.ParsedURL.ParsedURL.extractOrigin(target.inspectedURL());
+  return pageOrigin !== '' && areOriginsEquivalent(pageOrigin, allowedOrigin);
+}

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

@@ -11,7 +11,7 @@ import type {AICallTree} from '../performance/AICallTree.js';
 import type {AgentFocus} from '../performance/AIContext.js';
 import {AIQueries} from '../performance/AIQueries.js';
 
-import {NetworkRequestFormatter} from './NetworkRequestFormatter.js';
+import {NetworkRequestFormatter, sanitizeHeaders} from './NetworkRequestFormatter.js';
 import {PerformanceInsightFormatter} from './PerformanceInsightFormatter.js';
 import {bytes, micros, millis} from './UnitFormatters.js';
 
@@ -1036,3 +1036,71 @@ The order of headers corresponds to an internal fixed list. If a header is not p
     ].join('\n\n');
   }
 }
+
+/**
+ * Serializes a trace event to a JSON string for AI consumption,
+ * ensuring sensitive data (like headers and raw script source code)
+ * is sanitized or redacted.
+ */
+export function formatEventForAI(event: Trace.Types.Events.Event): string {
+  if (Trace.Types.Events.isSyntheticNetworkRequest(event)) {
+    return JSON.stringify({
+      ...event,
+      args: {
+        ...event.args,
+        data: {
+          ...event.args.data,
+          responseHeaders: event.args.data.responseHeaders ? sanitizeHeaders(event.args.data.responseHeaders) : null,
+        },
+      },
+    });
+  }
+
+  if (Trace.Types.Events.isResourceReceiveResponse(event)) {
+    return JSON.stringify({
+      ...event,
+      args: {
+        ...event.args,
+        data: {
+          ...event.args.data,
+          headers: event.args.data.headers ? sanitizeHeaders(event.args.data.headers) : undefined,
+        },
+      },
+    });
+  }
+
+  if (Trace.Types.Events.isRundownScriptSource(event)) {
+    // Redact sensitive cross-origin script source text.
+    const safeData: Omit<Trace.Types.Events.RundownScriptSource['args']['data'], 'sourceText'> = {
+      isolate: event.args.data.isolate,
+      scriptId: event.args.data.scriptId,
+      length: event.args.data.length,
+    };
+    return JSON.stringify({
+      ...event,
+      args: {
+        ...event.args,
+        data: safeData,
+      },
+    });
+  }
+
+  if (Trace.Types.Events.isRundownScriptSourceLarge(event)) {
+    // Redact sensitive cross-origin script source text.
+    const safeData: Omit<Trace.Types.Events.RundownScriptSourceLarge['args']['data'], 'sourceText'> = {
+      isolate: event.args.data.isolate,
+      scriptId: event.args.data.scriptId,
+      splitIndex: event.args.data.splitIndex,
+      splitCount: event.args.data.splitCount,
+    };
+    return JSON.stringify({
+      ...event,
+      args: {
+        ...event.args,
+        data: safeData,
+      },
+    });
+  }
+
+  return JSON.stringify(event);
+}

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

@@ -10,7 +10,7 @@ Example:
 ```markdown
 ---
 name: styling
-allowed-tools: [search_web]
+allowed-tools: [executeJavaScript]
 ---
 You are a CSS expert...
 ```
@@ -38,3 +38,65 @@ To use a skill in TypeScript:
 2.  Register it in `SkillRegistry.ts`.
 
 Types are provided globally in `front_end/global_typings/global_defs.d.ts` via a wildcard module declaration (`*.skill.js`). This avoids the need to generate `tsconfig.json` files for the generated skills.
+
+## Building a skill for AIv2
+
+_Note: some of this is a bit rough around the edges and subject to change as we build V2 out._
+
+If you want to add a new skill to DevTools AI v2 you should:
+
+Firstly, consider if we need it or not. Can we test the AI to see how it can handle relevant prompts without a new skill? (We are currently working on eval architecture to make this easier in the future too).
+
+Assuming we do want it, then we should create the new skill in `models/ai_assistance/skills/<NAME>.md`.
+
+This skill must have YAML frontmatter that defines its name and description, and optionally any tools that it is allowed to call (more on tools below):
+
+```
+---
+name: performance
+description: Web performance analysis, trace inspection, and trace recording.
+allowed-tools:
+  - recordPerformanceTrace
+---
+
+<body of the skill goes here>
+```
+
+The name and description are important. These are given to the AI in its context window so it knows that this tool exists and understands when to use it. You should think carefully about producing a very clear description and ideally evaluate this to check if the AI uses the tool in the right scenarios.
+
+To have the skill built as JavaScript and available to the AI:
+
+1. Update `models/ai_assistance/skills/BUILD.gn` to add the new skill file as a source.
+2. Update `models/ai_assistance/skills/Skill.ts` to add the new skill name to the `SkillName` union type.
+3. Update `models/ai_assistance/skills/SkillRegistry.ts` to import the generated skill file and register it in the `SKILLS` object.
+4. Add the generated skill file (`front_end/models/ai_assistance/skills/<NAME>.skill.js`) to the list of release sources in `config/gni/devtools_grd_files.gni`.
+
+If your skill does not need to call any tools, then you are done. The AI can now learn your skill and use it.
+
+### Using existing tools
+
+If your new skill needs to use tools that are already implemented:
+
+1. **Find the tool name**: Locate the tool's registration name in the `ToolName` enum (e.g., `executeJavaScript`, `listNetworkRequests`, `getStyles`) from `models/ai_assistance/tools/Tool.ts`.
+2. **Bind the tool to the skill**: Add the tool name to the `allowed-tools` list in your skill's Markdown frontmatter:
+   ```yaml
+   ---
+   name: my-skill
+   allowed-tools:
+     - executeJavaScript
+   ---
+   ```
+
+By doing this you ensure that if the AI learns you skill, those functions are learned and added to the active conversation for the AI to invoke.
+
+Even if other skills list the tool you need, you should list it also. Tools are not learned more than once; any subsequent skills that use the same tool do not cause it to be redeclared.
+
+### Implementing and binding tools
+
+If your new skill requires tools that do not exist yet, you should:
+
+1. Implement your new tool under `models/ai_assistance/tools/` extending the `BaseTool` class and implementing the `Tool` interface. Use the existing tools as guidance.
+2. Register the tool in the build system:
+   - Add the tool's source file to the `sources` list in `models/ai_assistance/BUILD.gn`.
+   - Import and register it inside `models/ai_assistance/tools/ToolRegistry.ts`.
+3. List the tool's name under the `allowed-tools` section of your skill's markdown frontmatter.

package/front_end/models/ai_assistance/skills/Skill.ts

@@ -3,7 +3,7 @@
 // found in the LICENSE file.
 
 // This will become a union type as we add more skills (e.g. 'styling' | 'network').
-export type SkillName = 'styling'|'network'|'accessibility'|'performance';
+export type SkillName = 'styling'|'network'|'accessibility'|'performance'|'storage'|'sources';
 
 export interface Skill {
   name: SkillName;

package/front_end/models/ai_assistance/skills/SkillRegistry.ts

@@ -6,6 +6,8 @@ import {skill as accessibilitySkill} from './accessibility.skill.js';
 import {skill as networkSkill} from './network.skill.js';
 import {skill as performanceSkill} from './performance.skill.js';
 import type {Skill, SkillName} from './Skill.js';
+import {skill as sourcesSkill} from './sources.skill.js';
+import {skill as storageSkill} from './storage.skill.js';
 import {skill as stylingSkill} from './styling.skill.js';
 
 export const SKILLS: Record<SkillName, Skill> = {
@@ -13,4 +15,6 @@ export const SKILLS: Record<SkillName, Skill> = {
   network: networkSkill,
   accessibility: accessibilitySkill,
   performance: performanceSkill,
+  storage: storageSkill,
+  sources: sourcesSkill,
 };

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

@@ -3,8 +3,16 @@ name: performance
 description: Web performance analysis, trace inspection, and trace recording.
 allowed-tools:
   - recordPerformanceTrace
+  - getTraceEventByKey
+  - selectTraceEventByKey
+  - getTraceMainThreadSummary
+  - getTraceNetworkSummary
 ---
 You are an expert web performance assistant integrated into Chrome DevTools.
 Your goal is to help users analyze, measure, and improve web page performance.
 
 Use `recordPerformanceTrace` to record a new performance trace when requested by the user or when live measurement is required.
+- Trace events in the provided insights or summaries may have an `eventKey`. Use `getTraceEventByKey` with this key to retrieve detailed event data for verification.
+- If the user asks to see, locate, or show a specific event, use `selectTraceEventByKey` to reveal and select it in the Flamechart.
+- Use `getTraceMainThreadSummary` to get a bottom-up activity summary of the main thread for a specific labeled period.
+- Use `getTraceNetworkSummary` to get a summary of network requests within a specific microsecond time range.

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

@@ -0,0 +1,16 @@
+---
+name: sources
+description: Analyzing workspace sources, inspecting code files, reading script contents, and viewing files in the workspace.
+allowed-tools:
+  - listSources
+  - getSourceContent
+---
+You are the most advanced source code analysis and debugging assistant integrated into Chrome DevTools.
+Provide a comprehensive analysis of source files, focusing on areas crucial for a software engineer. Your analysis should include:
+* Briefly explain the purpose and architecture of the file or script.
+* Analyze code blocks to identify potential bugs, logic issues, or areas for optimization.
+* Walk through execution flow if requested, pointing to key lines or functions.
+
+# Considerations
+* Never leak sensitive user data or API keys found in source code files. Redact or generalize them in your analysis.
+* Provide clean code snippets and direct line references where helpful.

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

@@ -0,0 +1,31 @@
+---
+name: storage
+description: inspect, understand, and audit the state stored in browser storage (LocalStorage, SessionStorage) or cookies.
+allowed-tools:
+  - listPageOrigins
+---
+You are a Senior Software Engineer specializing in state audit and storage analysis within Chrome DevTools. Your mission is to help developers debug storage-related issues faster by analyzing the evidence in LocalStorage, SessionStorage, and Cookies.
+
+You have access to the site's storage using tools.
+
+# Goals
+
+1.  **Explain Purpose**: Identify what specific storage entries or cookies are for.
+2.  **Understand Application State**: Help users inspect, understand, and audit the state stored in browser storage or cookies, and how it relates to application behavior or issues (such as state mismatch/drift, security misconfigurations, or oversized cookies).
+3.  **Top-Level Page First**: Your primary goal is to assist the user in understanding and debugging the storage of the **top-level page**. This context is the most critical for debugging and should be your default starting point for any analysis.
+
+# Tools & Workflow
+
+-   **Top-Level Context**: Generally, questions refer to the primary page target ("my page", "this page", etc.). If the user selects a general category or a specific selection, answers should refer to that particular selection, but follow-up questions may switch to the primary page target.
+-   **Address Specific Selections**: The user can select individual storage items in the DevTools UI (provided in the '# Active Context' section of the prompt). If the query is about a selected item (e.g., "Why is this cookie set?"), focus your response on that specific item.
+-   **General Category Selection**: If a general storage category (such as Cookies, Local Storage, or Session Storage) is selected in the active context (indicated by an empty context origin), your first step MUST be to look through all active page origins by calling `listPageOrigins` to discover origins, unless the user's explicit request hints otherwise.
+-   **Expand Scope When Necessary**: For general questions or those implying a wider scope (e.g., "Check all storages," "Are there related cookies on subdomains?"), proactively use your tools to explore other relevant storage contexts, including iframes and different origins.
+-   **Discovery**: Start by calling `listPageOrigins` to discover all active, non-empty frame origins loaded by the page.
+-   **Active Context**: Start by inspecting the active context's origin (provided in the '# Active Context' section of the prompt).
+
+# Considerations
+
+-   **Strictly Read-Only**: You cannot write, clear, delete, or edit storage or cookies.
+-   **DevTools UI Fallback**: If the user asks you to modify state, politely decline and provide exact step-by-step visual navigation directions on how they can perform the edit manually in the DevTools Application panel. Do NOT supply Console scripts.
+-   **Raw Evidence**: Treat storage data as raw evidence. Do not make assumptions about values without reading them first.
+-   **Dynamic State**: Always re-request values if you suspect they might have changed, rather than relying on past tool outputs.

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

@@ -0,0 +1,101 @@
+// 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 Host from '../../../core/host/host.js';
+import * as i18n from '../../../core/i18n/i18n.js';
+import * as TextUtils from '../../../core/text_utils/text_utils.js';
+import {FileFormatter} from '../data_formatters/FileFormatter.js';
+
+import {ListSourcesTool} from './ListSources.js';
+import {
+  type BaseToolCapability,
+  type DataHandlerResult,
+  type DataTool,
+  type OriginLockCapability,
+  type ToolArgs,
+  ToolName,
+} from './Tool.js';
+
+const UIStringsNotTranslate = {
+  readingSource: 'Reading source content',
+} as const;
+
+const lockedString = i18n.i18n.lockedString;
+
+export interface GetSourceContentArgs extends ToolArgs {
+  id: number;
+}
+
+/**
+ * A tool that retrieves the contents of a source file by its unique ID.
+ * Filters access by origin lock to prevent cross-origin leakage.
+ */
+export class GetSourceContentTool implements
+    DataTool<GetSourceContentArgs, {content: string}, BaseToolCapability&OriginLockCapability> {
+  readonly name = ToolName.GET_SOURCE_CONTENT;
+  readonly description = 'Gets the content and metadata of a source file by its ID.';
+
+  readonly parameters: Host.AidaClient.FunctionObjectParam<keyof GetSourceContentArgs> = {
+    type: Host.AidaClient.ParametersTypes.OBJECT,
+    description: '',
+    properties: {
+      id: {
+        type: Host.AidaClient.ParametersTypes.INTEGER,
+        description: 'The unique numeric ID of the source file to retrieve.',
+        nullable: false,
+      },
+    },
+    required: ['id'],
+  };
+
+  displayInfoFromArgs(args: GetSourceContentArgs): {
+    title: string,
+    action: string,
+  } {
+    return {
+      title: lockedString(UIStringsNotTranslate.readingSource),
+      action: `getSourceContent(${args.id})`,
+    };
+  }
+
+  async handler(
+      args: GetSourceContentArgs,
+      context: BaseToolCapability&OriginLockCapability,
+      ): Promise<DataHandlerResult<{content: string}>> {
+    const origin = context.getEstablishedOrigin();
+    const file = ListSourcesTool.getUISourceCodes().find(
+        f => ListSourcesTool.uiSourceCodeId.get(f) === args.id,
+    );
+
+    if (!file) {
+      return {
+        error: 'Unable to find file.',
+      };
+    }
+
+    const fileUrl = file.url();
+    const fileOrigin = Common.ParsedURL.ParsedURL.extractOrigin(fileUrl);
+    if (origin && fileOrigin !== origin) {
+      return {
+        error: 'Cross-origin access blocked.',
+      };
+    }
+
+    const contentData = await file.requestContentData();
+    if (TextUtils.ContentData.ContentData.isError(contentData)) {
+      return {
+        error: `Failed to load file content: ${contentData.error}`,
+      };
+    }
+
+    const formatter = new FileFormatter(file);
+
+    return {
+      result: {
+        content: formatter.formatFile(),
+      },
+    };
+  }
+}

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

@@ -0,0 +1,83 @@
+// 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 Host from '../../../core/host/host.js';
+import * as i18n from '../../../core/i18n/i18n.js';
+import {PerformanceTraceContext} from '../contexts/PerformanceTraceContext.js';
+import {formatEventForAI} from '../data_formatters/PerformanceTraceFormatter.js';
+
+import {
+  type BaseToolCapability,
+  type DataHandlerResult,
+  type DataTool,
+  type ToolArgs,
+  ToolName,
+} from './Tool.js';
+
+const UIStringsNotTranslate = {
+  lookingAtTraceEvent: 'Looking at trace event',
+} as const;
+
+const lockedString = i18n.i18n.lockedString;
+
+export interface GetTraceEventByKeyArgs extends ToolArgs {
+  eventKey: string;
+}
+
+export class GetTraceEventByKeyTool implements DataTool<GetTraceEventByKeyArgs, string, BaseToolCapability> {
+  readonly name = ToolName.GET_TRACE_EVENT_BY_KEY;
+  readonly description = 'Get details for a specific trace event by its event key.';
+
+  readonly parameters: Host.AidaClient.FunctionObjectParam<keyof GetTraceEventByKeyArgs> = {
+    type: Host.AidaClient.ParametersTypes.OBJECT,
+    description: 'Arguments for looking up a trace event.',
+    nullable: false,
+    properties: {
+      eventKey: {
+        type: Host.AidaClient.ParametersTypes.STRING,
+        description: 'The key of the event to look up.',
+        nullable: false,
+      },
+    },
+    required: ['eventKey'],
+  };
+
+  displayInfoFromArgs(params: GetTraceEventByKeyArgs): {
+    title: string,
+    action: string,
+  } {
+    return {
+      title: lockedString(UIStringsNotTranslate.lookingAtTraceEvent),
+      action: `getTraceEventByKey('${params.eventKey}')`,
+    };
+  }
+
+  async handler(
+      params: GetTraceEventByKeyArgs,
+      capabilities: BaseToolCapability,
+      ): Promise<DataHandlerResult<string>> {
+    const conversationContext = capabilities.conversationContext;
+    if (!conversationContext || !(conversationContext instanceof PerformanceTraceContext)) {
+      return {error: 'Performance trace context is not available.'};
+    }
+
+    const focus = conversationContext.getItem();
+    const event = focus.lookupEvent(params.eventKey);
+    if (!event) {
+      return {error: `Could not find event with key "${params.eventKey}".`};
+    }
+
+    const details = formatEventForAI(event);
+    return {
+      result: details,
+      widgets: [{
+        name: 'TIMELINE_EVENT_SUMMARY',
+        data: {
+          event,
+          parsedTrace: focus.parsedTrace,
+        },
+      }],
+    };
+  }
+}

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

@@ -0,0 +1,106 @@
+// 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 Host from '../../../core/host/host.js';
+import * as i18n from '../../../core/i18n/i18n.js';
+import {
+  type MainThreadSectionLabel,
+  PerformanceTraceContext,
+} from '../contexts/PerformanceTraceContext.js';
+
+import {
+  type BaseToolCapability,
+  type DataHandlerResult,
+  type DataTool,
+  MAX_FUNCTION_RESULT_BYTE_LENGTH,
+  type ToolArgs,
+  ToolName,
+} from './Tool.js';
+
+const UIStringsNotTranslate = {
+  mainThreadActivity: 'Main thread activity',
+} as const;
+
+const lockedString = i18n.i18n.lockedString;
+
+export interface GetTraceMainThreadSummaryArgs extends ToolArgs {
+  label: MainThreadSectionLabel;
+}
+
+export class GetTraceMainThreadSummaryTool implements
+    DataTool<GetTraceMainThreadSummaryArgs, string, BaseToolCapability> {
+  readonly name = ToolName.GET_TRACE_MAIN_THREAD_SUMMARY;
+  readonly description = 'Returns a focused, detailed summary of the main thread for a predefined labeled period.';
+
+  readonly parameters: Host.AidaClient.FunctionObjectParam<keyof GetTraceMainThreadSummaryArgs> = {
+    type: Host.AidaClient.ParametersTypes.OBJECT,
+    description: 'Arguments for looking up a main thread summary.',
+    nullable: false,
+    properties: {
+      label: {
+        type: Host.AidaClient.ParametersTypes.STRING,
+        description:
+            'The label of the period to investigate (e.g., \'LCPBreakdown\', \'CLSCulprits\', \'nav-to-lcp\').',
+        nullable: false,
+      },
+    },
+    required: ['label'],
+  };
+
+  displayInfoFromArgs(params: GetTraceMainThreadSummaryArgs): {
+    title: string,
+    action: string,
+  } {
+    return {
+      title: `${lockedString(UIStringsNotTranslate.mainThreadActivity)}: ${params.label}`,
+      action: `getTraceMainThreadSummary('${params.label}')`,
+    };
+  }
+
+  async handler(
+      params: GetTraceMainThreadSummaryArgs,
+      capabilities: BaseToolCapability,
+      ): Promise<DataHandlerResult<string>> {
+    const conversationContext = capabilities.conversationContext;
+    if (!conversationContext || !(conversationContext instanceof PerformanceTraceContext)) {
+      return {error: 'Performance trace context is not available.'};
+    }
+
+    const focus = conversationContext.getItem();
+    const bounds = conversationContext.getBoundsForLabel(params.label);
+    if (!bounds) {
+      return {error: `Invalid label: ${params.label}`};
+    }
+
+    const formatter = conversationContext.createFormatter();
+    const summary = await formatter.formatMainThreadTrackSummary(bounds);
+    if (summary.length > MAX_FUNCTION_RESULT_BYTE_LENGTH) {
+      return {
+        error:
+            'getTraceMainThreadSummary response is too large. Try investigating using other functions, or a more narrow bounds',
+      };
+    }
+
+    return {
+      result: summary,
+      widgets: [
+        {
+          name: 'TIMELINE_RANGE_SUMMARY',
+          data: {
+            parsedTrace: focus.parsedTrace,
+            bounds,
+            track: 'main',
+          },
+        },
+        {
+          name: 'BOTTOM_UP_TREE',
+          data: {
+            bounds,
+            parsedTrace: focus.parsedTrace,
+          },
+        },
+      ],
+    };
+  }
+}