chrome-devtools-frontend 1.0.1643099 → 1.0.1645245

package/eslint.config.mjs

@@ -721,7 +721,8 @@ export default defineConfig([
       'test/**/*.ts',
       '**/testing/*.ts',
       'scripts/eslint_rules/test/**/*',
-      'extensions/cxx_debugging/e2e/**',
+      'extensions/cxx_debugging/e2e/**/*.ts',
+      'extensions/cxx_debugging/tests/**/*.ts',
     ],
 
     rules: {
@@ -750,6 +751,7 @@ export default defineConfig([
       ],
 
       '@devtools/check-test-definitions': 'error',
+      '@devtools/prefer-chai-assert': 'error',
       '@devtools/no-assert-strict-equal-for-arrays-and-objects': 'error',
       '@devtools/no-assert-deep-strict-equal': 'error',
       '@devtools/no-assert-equal': 'error',

package/extension-api/ExtensionAPI.d.ts

@@ -19,8 +19,35 @@ export namespace Chrome {
        */
       readonly buildId?: string;
 
+      /**
+       * Returns the `content` and `encoding` of the resource. If a `callback`
+       * is provided, it is invoked with the `content` and `encoding` and the
+       * method returns `void`. If no `callback` is provided, the method returns
+       * a `Promise`.
+       *
+       * @param callback Optional callback to be invoked with the content and
+       * encoding.
+       * @returns A Promise that resolves to an object containing the content
+       * and encoding if no callback is provided, otherwise void. Rejects with
+       * an error object on failure.
+       */
+      getContent(): Promise<{content: string, encoding: string}>;
       getContent(callback: (content: string, encoding: string) => unknown): void;
-      setContent(content: string, commit: boolean, callback?: (error?: Object) => unknown): void;
+
+      /**
+       * Sets the content of the resource. If a `callback` is provided, it is
+       * invoked when the content is set and the method returns `void`. If no
+       * `callback` is provided, the method returns a `Promise`.
+       *
+       * @param content The new content of the resource.
+       * @param commit Whether to commit the changes.
+       * @param callback Optional callback to be invoked when the content is
+       * set.
+       * @returns A Promise that resolves when the content is set if no callback
+       * is provided, otherwise void. Rejects with an error object on failure.
+       */
+      setContent(content: string, commit: boolean): Promise<void>;
+      setContent(content: string, commit: boolean, callback: (error?: object) => unknown): void;
       /**
        * Augments this resource's scopes information based on the list of {@link NamedFunctionRange}s
        * for improved debuggability and function naming.
@@ -40,18 +67,62 @@ export namespace Chrome {
       onResourceAdded: EventSink<(resource: Resource) => unknown>;
       onResourceContentCommitted: EventSink<(resource: Resource, content: string) => unknown>;
 
-      eval(
-          expression: string,
-          options?: {scriptExecutionContext?: string, frameURL?: string, useContentScriptContext?: boolean},
-          callback?: (result: unknown, exceptioninfo: {
-            code: string,
-            description: string,
-            details: unknown[],
-            isError: boolean,
-            isException: boolean,
-            value: string,
-          }) => unknown): void;
+      /**
+       * Evaluates a JavaScript expression in the context of the inspected page.
+       *
+       * If a `callback` is provided, it is invoked with the result and
+       * exception information and the method returns `void`. If no `callback`
+       * is provided, the method returns a `Promise`.
+       *
+       * @template E The type of the value that the Promise resolves to.
+       * @param expression The JavaScript expression to evaluate.
+       * @param optionsOrCallback Optional options for evaluation, or a callback
+       * function.
+       * @param callback Optional callback to be invoked with the evaluation
+       * result and exception information.
+       * @returns A Promise that resolves to the result if no callback is
+       * provided, otherwise void. Rejects with an error object on failure.
+       */
+      eval<E = unknown>(expression: string, options?: {
+        scriptExecutionContext?: string,
+        frameURL?: string,
+        useContentScriptContext?: boolean,
+      }): Promise<E>;
+      eval(expression: string,
+           optionsOrCallback: {scriptExecutionContext?: string, frameURL?: string, useContentScriptContext?: boolean}|
+           undefined|((result: unknown, exceptioninfo: {
+                        code: string,
+                        description: string,
+                        details: unknown[],
+                        isError: boolean,
+                        isException: boolean,
+                        value: string,
+                      }) => unknown),
+           callback?: (result: unknown, exceptioninfo: {
+             code: string,
+             description: string,
+             details: unknown[],
+             isError: boolean,
+             isException: boolean,
+             value: string,
+           }) => unknown): void;
+
+      /**
+       * Retrieves all resources within the inspected window.
+       *
+       * If a `callback` is provided, it is invoked with the array of resources
+       * and the method returns `void`. If no `callback` is provided, the method
+       * returns a `Promise`.
+       *
+       * @param callback Optional callback to be invoked with the array of
+       * resources.
+       * @returns A Promise that resolves to an array of resources if no
+       * callback is provided, otherwise void. Rejects with an error object on
+       * failure.
+       */
+      getResources(): Promise<Resource[]>;
       getResources(callback: (resources: Resource[]) => unknown): void;
+
       reload(reloadOptions?: {ignoreCache?: boolean, injectedScript?: string, userAgent?: string}): void;
     }
 

package/front_end/core/host/UserMetrics.ts

@@ -496,8 +496,9 @@ export enum Action {
   AiCodeGenerationRequestTriggeredFromSources = 205,
   AiCodeCompletionFreCompletedFromConsole = 206,
   AiCodeCompletionFreCompletedFromSources = 207,
-  AiAssistanceOpenedFromStoragePanelFloatingButton = 208,
-  MAX_VALUE = 209,
+  AiAssistanceOpenedFromApplicationPanelFloatingButton = 208,
+  AiAssistanceOpenedFromApplicationPanel = 209,
+  MAX_VALUE = 210,
   /* eslint-enable @typescript-eslint/naming-convention */
 }
 
@@ -767,7 +768,6 @@ export enum DevtoolsExperiments {
   /* eslint-disable @typescript-eslint/naming-convention */
   'protocol-monitor' = 13,
   'instrumentation-breakpoints' = 61,
-  'use-source-map-scopes' = 76,
   'durable-messages' = 110,
   'jpeg-xl' = 111,
   'plus-button' = 112,

package/front_end/core/root/ExperimentNames.ts

@@ -6,7 +6,6 @@ export enum ExperimentName {
   ALL = '*',
   PROTOCOL_MONITOR = 'protocol-monitor',
   INSTRUMENTATION_BREAKPOINTS = 'instrumentation-breakpoints',
-  USE_SOURCE_MAP_SCOPES = 'use-source-map-scopes',
   DURABLE_MESSAGES = 'durable-messages',
   JPEG_XL = 'jpeg-xl',
   PLUS_BUTTON = 'plus-button',

package/front_end/core/sdk/CSSPropertyParserMatchers.ts

@@ -561,9 +561,8 @@ export class ColorMatcher extends matcherBase(ColorMatch) {
         const colorText = args.length >= 2 ? matching.getComputedTextRange(args[0], args[args.length - 1]) : '';
         // colorText holds the fully substituted parenthesized expression, so colorFunc + colorText is the color
         // function call.
-        const isRelativeColorSyntax = Boolean(
-            colorText.match(/^[^)]*\(\W*from\W+/) && !matching.hasUnresolvedSubstitutions(node) &&
-            CSS.supports('color', colorFunc + colorText));
+        const isRelativeColorSyntax =
+            Boolean(colorText.match(/^[^)]*\(\W*from\W+/) && !matching.hasUnresolvedSubstitutions(node));
         if (!isRelativeColorSyntax) {
           return new ColorMatch(text, node);
         }

package/front_end/core/sdk/ConsoleModel.ts

@@ -547,6 +547,7 @@ export interface ConsoleMessageDetails {
   context?: string;
   affectedResources?: AffectedResources;
   category?: Protocol.Log.LogEntryCategory;
+  exceptionDetails?: Protocol.Runtime.ExceptionDetails;
 }
 
 export class ConsoleMessage {
@@ -570,6 +571,7 @@ export class ConsoleMessage {
   #exceptionId?: number = undefined;
   #affectedResources?: AffectedResources;
   category?: Protocol.Log.LogEntryCategory;
+  readonly exceptionDetails?: Protocol.Runtime.ExceptionDetails;
 
   /**
    * The parent frame of the `console.log` call of logpoints or conditional breakpoints
@@ -600,6 +602,7 @@ export class ConsoleMessage {
     this.workerId = details?.workerId;
     this.#affectedResources = details?.affectedResources;
     this.category = details?.category;
+    this.exceptionDetails = details?.exceptionDetails;
 
     if (!this.#executionContextId && this.#runtimeModel) {
       if (this.scriptId) {
@@ -646,6 +649,7 @@ export class ConsoleMessage {
       executionContextId: exceptionDetails.executionContextId,
       scriptId: exceptionDetails.scriptId,
       affectedResources,
+      exceptionDetails,
     };
     return new ConsoleMessage(
         runtimeModel, Protocol.Log.LogEntrySource.Javascript, Protocol.Log.LogEntryLevel.Error,

package/front_end/core/sdk/NetworkRequest.ts

@@ -299,6 +299,10 @@ export class NetworkRequest extends Common.ObjectWrapper.ObjectWrapper<EventType
   #contentDataProvider?: () => Promise<TextUtils.ContentData.ContentDataOrError>;
   #isSameSite: boolean|null = null;
   #wasIntercepted = false;
+  /**
+   * Whether this request was imported from a HAR file.
+   */
+  #isImportedHar = false;
   #associatedData = new Map<string, object>();
   #hasOverriddenContent = false;
   #hasThirdPartyCookiePhaseoutIssue = false;
@@ -1148,6 +1152,14 @@ export class NetworkRequest extends Common.ObjectWrapper.ObjectWrapper<EventType
     this.#wasIntercepted = wasIntercepted;
   }
 
+  isImportedHar(): boolean {
+    return this.#isImportedHar;
+  }
+
+  setIsImportedHar(isImportedHar: boolean): void {
+    this.#isImportedHar = isImportedHar;
+  }
+
   setEarlyHintsHeaders(headers: NameValue[]): void {
     this.earlyHintsHeaders = headers;
   }
@@ -1908,7 +1920,6 @@ export interface EventTypes {
   [Events.RESPONSE_HEADERS_CHANGED]: void;
   [Events.WEBSOCKET_FRAME_ADDED]: WebSocketFrame;
   [Events.DIRECTSOCKET_CHUNK_ADDED]: DirectSocketChunk;
-  [Events.DIRECTSOCKET_CHUNK_ADDED]: DirectSocketChunk;
   [Events.EVENT_SOURCE_MESSAGE_ADDED]: EventSourceMessage;
   [Events.TRUST_TOKEN_RESULT_ADDED]: void;
 }

package/front_end/core/sdk/SourceMap.ts

@@ -6,7 +6,6 @@ import * as TextUtils from '../../models/text_utils/text_utils.js';
 import * as ScopesCodec from '../../third_party/source-map-scopes-codec/source-map-scopes-codec.js';
 import * as Common from '../common/common.js';
 import * as Platform from '../platform/platform.js';
-import * as Root from '../root/root.js';
 
 import type {CallFrame, ScopeChainEntry} from './DebuggerModel.js';
 import {scopeTreeForScript} from './ScopeTreeCache.js';
@@ -584,23 +583,21 @@ export class SourceMap {
           lineNumber, columnNumber, sourceIndex, sourceURL, sourceLineNumber, sourceColumnNumber, names[nameIndex]));
     }
 
-    if (Root.Runtime.experiments.isEnabled(Root.ExperimentNames.ExperimentName.USE_SOURCE_MAP_SCOPES)) {
-      if (!this.#scopesInfo) {
-        this.#scopesInfo = new SourceMapScopesInfo(this, {scopes: [], ranges: []});
-      }
-      if (map.scopes) {
-        const {scopes, ranges} = ScopesCodec.decode(
-            map as ScopesCodec.SourceMapJson,
-            {mode: ScopesCodec.DecodeMode.LAX, generatedOffset: {line: baseLineNumber, column: baseColumnNumber}});
-        this.#scopesInfo.addOriginalScopes(scopes);
-        this.#scopesInfo.addGeneratedRanges(ranges);
-      } else if (map.x_com_bloomberg_sourcesFunctionMappings) {
-        const originalScopes = this.parseBloombergScopes(map);
-        this.#scopesInfo.addOriginalScopes(originalScopes);
-      } else {
-        // Keep the OriginalScope[] tree array consistent with sources.
-        this.#scopesInfo.addOriginalScopes(new Array(map.sources.length).fill(null));
-      }
+    if (!this.#scopesInfo) {
+      this.#scopesInfo = new SourceMapScopesInfo(this, {scopes: [], ranges: []});
+    }
+    if (map.scopes) {
+      const {scopes, ranges} = ScopesCodec.decode(
+          map as ScopesCodec.SourceMapJson,
+          {mode: ScopesCodec.DecodeMode.LAX, generatedOffset: {line: baseLineNumber, column: baseColumnNumber}});
+      this.#scopesInfo.addOriginalScopes(scopes);
+      this.#scopesInfo.addGeneratedRanges(ranges);
+    } else if (map.x_com_bloomberg_sourcesFunctionMappings) {
+      const originalScopes = this.parseBloombergScopes(map);
+      this.#scopesInfo.addOriginalScopes(originalScopes);
+    } else {
+      // Keep the OriginalScope[] tree array consistent with sources.
+      this.#scopesInfo.addOriginalScopes(new Array(map.sources.length).fill(null));
     }
   }
 

package/front_end/entrypoints/greendev_floaty/FloatyEntrypoint.ts

@@ -593,8 +593,6 @@ async function init(): Promise<void> {
 
     safeRegisterExperiment(
         Root.ExperimentNames.ExperimentName.INSTRUMENTATION_BREAKPOINTS, 'Enable instrumentation breakpoints');
-    safeRegisterExperiment(
-        Root.ExperimentNames.ExperimentName.USE_SOURCE_MAP_SCOPES, 'Use scope information from source maps');
     safeRegisterExperiment(Root.ExperimentNames.ExperimentName.PROTOCOL_MONITOR, 'Protocol Monitor');
 
     const hostUnsyncedStorage: Common.Settings.SettingsBackingStore = {

package/front_end/entrypoints/greendev_floaty/greendev_floaty.ts

@@ -247,8 +247,6 @@ async function init(): Promise<void> {
     // Register necessary experiments to avoid "Unknown experiment" errors.
     Root.Runtime.experiments.register(
         Root.ExperimentNames.ExperimentName.INSTRUMENTATION_BREAKPOINTS, 'Enable instrumentation breakpoints');
-    Root.Runtime.experiments.register(
-        Root.ExperimentNames.ExperimentName.USE_SOURCE_MAP_SCOPES, 'Use scope information from source maps');
     Root.Runtime.experiments.register(Root.ExperimentNames.ExperimentName.PROTOCOL_MONITOR, 'Protocol Monitor');
 
     const WINDOW_LOCAL_STORAGE: Common.Settings.SettingsBackingStore = {

package/front_end/entrypoints/heap_snapshot_worker/HeapSnapshot.ts

@@ -2740,6 +2740,8 @@ export abstract class HeapSnapshot {
       const nodeAId = baseIds[i];
       if (nodeAId < nodeB.id()) {
         diff.deletedIndexes.push(baseIndexes[i]);
+        diff.deletedIds.push(nodeAId);
+        diff.deletedSelfSizes.push(baseSelfSizes[i]);
         diff.removedCount++;
         diff.removedSize += baseSelfSizes[i];
         ++i;
@@ -2747,6 +2749,8 @@ export abstract class HeapSnapshot {
           nodeAId >
           nodeB.id()) {  // Native nodes(e.g. dom groups) may have ids less than max JS object id in the base snapshot
         diff.addedIndexes.push(indexes[j]);
+        diff.addedIds.push(nodeB.id());
+        diff.addedSelfSizes.push(nodeB.selfSize());
         diff.addedCount++;
         diff.addedSize += nodeB.selfSize();
         nodeB.nodeIndex = indexes[++j];
@@ -2757,12 +2761,16 @@ export abstract class HeapSnapshot {
     }
     while (i < l) {
       diff.deletedIndexes.push(baseIndexes[i]);
+      diff.deletedIds.push(baseIds[i]);
+      diff.deletedSelfSizes.push(baseSelfSizes[i]);
       diff.removedCount++;
       diff.removedSize += baseSelfSizes[i];
       ++i;
     }
     while (j < m) {
       diff.addedIndexes.push(indexes[j]);
+      diff.addedIds.push(nodeB.id());
+      diff.addedSelfSizes.push(nodeB.selfSize());
       diff.addedCount++;
       diff.addedSize += nodeB.selfSize();
       nodeB.nodeIndex = indexes[++j];
@@ -2975,6 +2983,35 @@ export abstract class HeapSnapshot {
     return {paths, limitsReached};
   }
 
+  getDominatorsOf(nodeIndex: number): HeapSnapshotModel.HeapSnapshotModel.DominatorChain {
+    const chain: HeapSnapshotModel.HeapSnapshotModel.DominatorNode[] = [];
+    let currentIndex = nodeIndex;
+    const rootIndex = this.rootNodeIndex;
+
+    while (currentIndex !== undefined) {
+      const node = this.createNode(currentIndex);
+      chain.push({
+        nodeId: node.id(),
+        nodeIndex: currentIndex,
+        nodeName: node.name(),
+        retainedSize: node.retainedSize(),
+        selfSize: node.selfSize(),
+      });
+
+      if (currentIndex === rootIndex) {
+        break;
+      }
+
+      const nextIndex = node.dominatorIndex();
+      if (nextIndex === currentIndex) {
+        break;
+      }
+      currentIndex = nextIndex;
+    }
+
+    return chain;
+  }
+
   createAddedNodesProvider(baseSnapshotId: number, classKey: string): HeapSnapshotNodesProvider {
     const snapshotDiff = this.#snapshotDiffs[baseSnapshotId];
     const diffForClass = snapshotDiff[classKey];

package/front_end/entrypoints/main/MainImpl.ts

@@ -365,8 +365,6 @@ export class MainImpl {
     // Debugging
     Root.Runtime.experiments.register(
         Root.ExperimentNames.ExperimentName.INSTRUMENTATION_BREAKPOINTS, 'Instrumentation breakpoints');
-    Root.Runtime.experiments.register(
-        Root.ExperimentNames.ExperimentName.USE_SOURCE_MAP_SCOPES, 'Use scope information from source maps');
 
     Root.Runtime.experiments.registerHostExperiment({
       name: Root.ExperimentNames.ExperimentName.DURABLE_MESSAGES,
@@ -392,10 +390,6 @@ export class MainImpl {
       requiresChromeRestart: false,
     });
 
-    Root.Runtime.experiments.enableExperimentsByDefault([
-      Root.ExperimentNames.ExperimentName.USE_SOURCE_MAP_SCOPES,
-    ]);
-
     const enabledExperiments = Root.Runtime.Runtime.queryParam('enabledExperiments');
     if (enabledExperiments) {
       Root.Runtime.experiments.setServerEnabledExperiments(enabledExperiments.split(';'));

package/front_end/generated/SupportedCSSProperties.js

@@ -3860,7 +3860,8 @@ export const generatedProperties = [
  {
   "keywords": [
    "auto",
-   "none"
+   "none",
+   "normal"
   ],
   "name": "position-anchor"
  },
@@ -6987,7 +6988,8 @@ export const generatedPropertyValues = {
  "position-anchor": {
   "values": [
    "auto",
-   "none"
+   "none",
+   "normal"
   ]
  },
  "position-area": {

package/front_end/models/ai_assistance/AiAgent2.ts

@@ -3,9 +3,11 @@
 // found in the LICENSE file.
 
 import * as Host from '../../core/host/host.js';
+import * as SDK from '../../core/sdk/sdk.js';
 
 import {
   AiAgent,
+  type AllowedOriginResult,
   type ContextResponse,
   type ConversationContext,
   type MultimodalInputType,
@@ -19,7 +21,7 @@ import {debugLog} from './debug.js';
 import {ExtensionScope} from './ExtensionScope.js';
 import type {Skill, SkillName} from './skills/Skill.js';
 import {SKILLS} from './skills/SkillRegistry.js';
-import type {Tool} from './tools/Tool.js';
+import type {AllToolsContext, Tool, ToolArgs} from './tools/Tool.js';
 import {ToolRegistry} from './tools/ToolRegistry.js';
 
 const SKILL_DISPLAY_NAMES: Record<SkillName, string> = {
@@ -35,6 +37,7 @@ export class AiAgent2 extends AiAgent<unknown> {
   #skillsInjected = false;
   #changes = new ChangeManager();
   #execJs: typeof executeJsCode;
+  readonly #allowedOrigin?: () => AllowedOriginResult;
 
   get options(): RequestOptions {
     return {};
@@ -46,6 +49,7 @@ export class AiAgent2 extends AiAgent<unknown> {
   constructor(opts: ExecuteJsAgentOptions) {
     super(opts);
     this.#execJs = opts.execJs ?? executeJsCode;
+    this.#allowedOrigin = opts.allowedOrigin;
     this.#declaredTools.add('learnSkills');
     const skillsList = Object.keys(SKILLS).join(', ');
     this.declareFunction<{skills: SkillName[]}>('learnSkills', {
@@ -169,7 +173,7 @@ User query: ${enhancedQuery}`;
    * Declares a tool to be available to the agent model, verifying first that
    * it hasn't already been declared to prevent duplicate declaration errors.
    */
-  #declareTool(tool: Tool): void {
+  #declareTool(tool: Tool<ToolArgs, unknown, AllToolsContext>): void {
     if (this.#declaredTools.has(tool.name)) {
       debugLog(`AiAgent2: Tool ${tool.name} is already declared`);
       return;
@@ -179,19 +183,26 @@ User query: ${enhancedQuery}`;
       description: tool.description,
       parameters: tool.parameters,
       displayInfoFromArgs: tool.displayInfoFromArgs,
-      handler: (args, options) => tool.handler(
-          args,
-          {
-            conversationContext: this.context ?? null,
-            changeManager: this.#changes,
-            createExtensionScope: this.#createExtensionScope.bind(this),
-            execJs: this.#execJs,
-          },
-          options,
-          ),
+      handler: (args, options) => {
+        const context: AllToolsContext = {
+          conversationContext: this.context ?? null,
+          changeManager: this.#changes,
+          createExtensionScope: this.#createExtensionScope.bind(this),
+          execJs: this.#execJs,
+          getExecutionContextNode: () => this.context instanceof DOMNodeContext ? this.context.getItem() : null,
+          getTarget: () => SDK.TargetManager.TargetManager.instance().primaryPageTarget(),
+          getEstablishedOrigin: () => this.#getConversationOrigin(),
+        };
+        return tool.handler(args, context, options);
+      },
     });
   }
 
+  #getConversationOrigin(): string|undefined {
+    const allowed = this.#allowedOrigin?.();
+    return allowed && 'origin' in allowed ? allowed.origin : undefined;
+  }
+
   get activeSkills(): Set<SkillName> {
     return this.#activeSkills;
   }

package/front_end/models/ai_assistance/README.md

@@ -24,7 +24,7 @@ To deal with the work to take an object that is the AI agent's context and turn
 
 ## Future Architecture (V2) - WIP
 
-We are currently working on migrating the DevTools AI Assistance from a siloed multi-agent architecture to a unified, skill-based single-agent architecture (`AIAgent2`).
+We are migrating the DevTools AI Assistance from a siloed multi-agent architecture to a unified, skill-based single-agent architecture (`AIAgent2`).
 
 In this new architecture:
 - A single agent (`AIAgent2`) handles multiple domains.
@@ -36,15 +36,16 @@ This work is currently in progress and behind a feature flag.
 ### Skills Build System
 
 To support dynamic loading of skills, we generate JavaScript files from Markdown files containing skill definitions.
-We use a nested `BUILD.gn` file in the `skills/` subdirectory specifically for this purpose. This ensures that GN's `target_gen_dir` points to `gen/front_end/models/ai_assistance/skills/`, placing the generated `.skill.js` files in the same relative structure as their source `.md` files. This allows TypeScript files in the `skills/` directory (like `map.ts`) to import the generated files using relative paths (e.g., `./styling.skill.js`) seamlessly.
+We use a nested `BUILD.gn` file in the `skills/` subdirectory specifically for this purpose. This ensures that GN's `target_gen_dir` points to `gen/front_end/models/ai_assistance/skills/`, placing the generated `.skill.js` files in the same relative structure as their source `.md` files. This allows TypeScript files in the `skills/` directory (like `map.ts`) to import the generated files using relative paths (e.g., `./styling.skill.js`) seamlessly. See the [Skills README](skills/README.md) for full details.
 
 ### Tools and ToolRegistry
 
 To support skills requiring execution of code or fetching page state (like computed styles), the architecture defines **Tools** in the `tools/` directory.
 
 - **BaseTool**: A non-generic base interface capturing tool metadata (`name`, `description`, `parameters`). This acts as the type-erased representation for generic registry storage and fallback string lookups.
-- **Tool**: A generic interface extending `BaseTool` that binds argument types (`Args`) to the schema `parameters` and the `handler()` method. This ensures compile-time safety and alignment inside each tool implementation.
-- **ToolRegistry**: A static registry (`ToolRegistry`) storing instantiated tools. It uses TypeScript function overloading and generic lookups (`static get<K extends keyof typeof TOOLS>(name: K): typeof TOOLS[K]`) to return the precise class type of each tool, preventing type-erasure and escape-hatches (such as `any` or `as unknown` type assertions) at integration points like `AiAgent.ts`.
+- **Tool**: A generic interface parameterized by `<Args, ReturnType, ContextType>` that binds parameter argument types and handler execution to strict contracts. `ContextType` defaults to `BaseToolCapability`, ensuring that each tool explicitly requests only the dependencies it requires.
+- **Capability Contexts**: Instead of passing a monolithic grab-bag context to all tools, dependencies are broken into narrow capability interfaces (e.g. `PageExecutionCapability`, `StyleMutationCapability`, `TargetCapability`, `OriginLockCapability`). Tools declare their required dependencies by intersecting these interfaces on their generic `ContextType` definition. The caller/Agent fulfills the complete capability context (`AllToolsContext`), guaranteeing 100% compile-time type safety for dependencies without runtime checks.
+- **ToolRegistry**: A static registry (`ToolRegistry`) storing instantiated tools. It uses TypeScript function overloading and generic lookups (`static get<K extends keyof typeof TOOLS>(name: K): typeof TOOLS[K]`) to return the precise class type of each tool, preventing type-erasure and escape-hatches (such as `any` or `as unknown` type assertions) at integration points like `AiAgent2.ts`. See the [Tools README](tools/README.md) for authoring instructions.
 
 ## Performance specific documentation
 

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

@@ -13,6 +13,8 @@ import {ChangeManager} from '../ChangeManager.js';
 import {LighthouseFormatter} from '../data_formatters/LighthouseFormatter.js';
 import {debugLog} from '../debug.js';
 import {ExtensionScope} from '../ExtensionScope.js';
+import {ToolName} from '../tools/Tool.js';
+import {ToolRegistry} from '../tools/ToolRegistry.js';
 
 import {
   AiAgent,
@@ -25,10 +27,8 @@ import {
 } from './AiAgent.js';
 import {
   type CreateExtensionScopeFunction,
-  executeJavaScriptFunction,
   type ExecuteJsAgentOptions,
   executeJsCode,
-  JavascriptExecutor
 } from './ExecuteJavascript.js';
 
 /**
@@ -117,7 +117,6 @@ export class AccessibilityAgent extends AiAgent<LHModel.ReporterTypes.ReportJSON
       (overrides?: LHModel.RunTypes.RunOverrides) => Promise<LHModel.ReporterTypes.ReportJSON|null>;
 
   #execJs: typeof executeJsCode;
-  #javascriptExecutor: JavascriptExecutor;
   #changes: ChangeManager;
   #createExtensionScope: CreateExtensionScopeFunction;
 
@@ -129,14 +128,6 @@ export class AccessibilityAgent extends AiAgent<LHModel.ReporterTypes.ReportJSON
     this.#createExtensionScope = opts.createExtensionScope ?? ((changes: ChangeManager) => {
                                    return new ExtensionScope(changes, this.sessionId, this.#getDocumentBodyNode());
                                  });
-    this.#javascriptExecutor = new JavascriptExecutor(
-        {
-          executionMode: this.executionMode,
-          getContextNode: () => this.#getDocumentBodyNode(),
-          createExtensionScope: this.#createExtensionScope.bind(this),
-          changes: this.#changes,
-        },
-        this.#execJs);
   }
 
   get userTier(): string|undefined {
@@ -271,16 +262,31 @@ export class AccessibilityAgent extends AiAgent<LHModel.ReporterTypes.ReportJSON
       }
     });
 
-    const executeJsDeclaration = executeJavaScriptFunction(this.#javascriptExecutor);
-    this.declareFunction('executeJavaScript', {
-      ...executeJsDeclaration,
-      handler: async (params, options) => {
+    const executeJsTool = ToolRegistry.get(ToolName.EXECUTE_JAVASCRIPT);
+    if (!executeJsTool) {
+      throw new Error('Required tool "executeJavaScript" not found');
+    }
+    this.declareFunction(executeJsTool.name, {
+      description: executeJsTool.description,
+      parameters: executeJsTool.parameters,
+      displayInfoFromArgs: executeJsTool.displayInfoFromArgs,
+      handler: async (args, options) => {
         if (isImported) {
           return {
             error: 'Cannot use this tool on an imported file.',
           };
         }
-        return await executeJsDeclaration.handler(params, options);
+        return await executeJsTool.handler(
+            args,
+            {
+              conversationContext: this.context ?? null,
+              changeManager: this.#changes,
+              createExtensionScope: this.#createExtensionScope.bind(this),
+              execJs: this.#execJs,
+              getExecutionContextNode: () => this.#getDocumentBodyNode(),
+            },
+            options,
+        );
       },
     });