execute in-page tool

wolfib · wolfib · commit 1c1796c99d00 · 2026-03-30T18:22:05.000Z
diff --git a/src/McpContext.ts b/src/McpContext.ts
@@ -31,6 +31,7 @@ import type {
 } from './third_party/index.js';
 import {Locator} from './third_party/index.js';
 import {PredefinedNetworkConditions} from './third_party/index.js';
+import type {ToolGroup, ToolDefinition} from './tools/inPage.js';
 import {listPages} from './tools/pages.js';
 import {CLOSE_PAGE_ERROR} from './tools/ToolDefinition.js';
 import type {Context, DevToolsData} from './tools/ToolDefinition.js';
@@ -101,6 +102,7 @@ export class McpContext implements Context {
   #screenRecorderData: {recorder: ScreenRecorder; filePath: string} | null =
     null;
 
+  #inPageTools?: ToolGroup<ToolDefinition>;
   #nextPageId = 1;
   #extensionPages = new WeakMap<Target, Page>();
 
@@ -464,6 +466,14 @@ export class McpContext implements Context {
     this.#updateSelectedPageTimeouts();
   }
 
+  setInPageTools(toolGroup?: ToolGroup<ToolDefinition>) {
+    this.#inPageTools = toolGroup;
+  }
+
+  getInPageTools(): ToolGroup<ToolDefinition> | undefined {
+    return this.#inPageTools;
+  }
+
   #updateSelectedPageTimeouts() {
     const page = this.#getSelectedMcpPage();
     // For waiters 5sec timeout should be sufficient.
diff --git a/src/McpResponse.ts b/src/McpResponse.ts
@@ -422,6 +422,7 @@ export class McpResponse implements Response {
     let inPageTools: ToolGroup<ToolDefinition> | undefined;
     if (this.#listInPageTools) {
       inPageTools = await getToolGroup(context.getSelectedMcpPage());
+      context.setInPageTools(inPageTools);
     }
 
     let consoleMessages: Array<ConsoleFormatter | IssueFormatter> | undefined;
diff --git a/src/third_party/index.ts b/src/third_party/index.ts
@@ -29,6 +29,7 @@ export {
   type TextContent,
 } from '@modelcontextprotocol/sdk/types.js';
 export {z as zod} from 'zod';
+export {default as ajv} from 'ajv';
 export {
   Locator,
   PredefinedNetworkConditions,
diff --git a/src/tools/ToolDefinition.ts b/src/tools/ToolDefinition.ts
@@ -24,6 +24,10 @@ import type {InstalledExtension} from '../utils/ExtensionRegistry.js';
 import type {PaginationOptions} from '../utils/types.js';
 
 import type {ToolCategory} from './categories.js';
+import type {
+  ToolGroup,
+  ToolDefinition as InPageToolDefinition,
+} from './inPage.js';
 
 export interface BaseToolDefinition<
   Schema extends zod.ZodRawShape = zod.ZodRawShape,
@@ -194,6 +198,8 @@ export type Context = Readonly<{
   triggerExtensionAction(id: string): Promise<void>;
   listExtensions(): InstalledExtension[];
   getExtension(id: string): InstalledExtension | undefined;
+  setInPageTools(toolGroup?: ToolGroup<InPageToolDefinition>): void;
+  getInPageTools(): ToolGroup<InPageToolDefinition> | undefined;
   getSelectedMcpPage(): McpPage;
   getExtensionServiceWorkers(): ExtensionServiceWorker[];
   getExtensionServiceWorkerId(
diff --git a/src/tools/inPage.ts b/src/tools/inPage.ts
@@ -4,7 +4,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import {type JSONSchema7} from '../third_party/index.js';
+import {zod, ajv, type JSONSchema7} from '../third_party/index.js';
 
 import {ToolCategory} from './categories.js';
 import {definePageTool} from './ToolDefinition.js';
@@ -37,9 +37,13 @@ declare global {
 
 export const listInPageTools = definePageTool({
   name: 'list_in_page_tools',
-  description: `Lists all in-page-tools the page exposes for providing runtime information.
-  To call 'list_in_page_tools', call 'evaluate_script' with
-  'window.__dtmcp.executeTool("list_in_page_tools", {})'.`,
+  description: `Lists all in-page tools the page exposes for providing runtime information.
+  In-page tools can be called via the 'execute_in_page_tool()' MCP tool.
+  Alternatively, in-page tools can be executed by calling 'evaluate_script' and adding the
+  following command to the script:
+  'window.__dtmcp.executeTool(toolName, params)'
+  This might be helpful when the in-page-tools return non-serializable values or when composing
+  the in-page-tools with additional functionality.`,
   annotations: {
     category: ToolCategory.IN_PAGE,
     readOnlyHint: true,
@@ -50,3 +54,55 @@ export const listInPageTools = definePageTool({
     response.setListInPageTools();
   },
 });
+
+export const executeInPageTool = definePageTool({
+  name: 'execute_in_page_tool',
+  description: `Executes a tool exposed by the page.`,
+  annotations: {
+    category: ToolCategory.IN_PAGE,
+    readOnlyHint: false,
+    conditions: ['inPageTools'],
+  },
+  schema: {
+    toolName: zod.string().describe('The name of the tool to execute'),
+    params: zod
+      .record(zod.string(), zod.unknown())
+      .optional()
+      .describe('The parameters to pass to the tool'),
+  },
+  handler: async (request, response, context) => {
+    const page = context.getSelectedMcpPage();
+    const toolName = request.params.toolName;
+    const params = request.params.params ?? {};
+
+    const toolGroup = context.getInPageTools();
+    const tool = toolGroup?.tools.find(t => t.name === toolName);
+    if (!tool) {
+      throw new Error(`Tool ${toolName} not found`);
+    }
+    const ajvInstance = new ajv();
+    const validate = ajvInstance.compile(tool.inputSchema);
+    const valid = validate(params);
+    if (!valid) {
+      throw new Error(
+        `Invalid parameters for tool ${toolName}: ${ajvInstance.errorsText(validate.errors)}`,
+      );
+    }
+
+    const result = await page.pptrPage.evaluate(
+      async (name, args) => {
+        if (!window.__dtmcp?.executeTool) {
+          throw new Error('No tools found on the page');
+        }
+        const toolResult = await window.__dtmcp.executeTool(name, args);
+
+        return {
+          result: toolResult,
+        };
+      },
+      toolName,
+      params,
+    );
+    response.appendResponseLine(JSON.stringify(result, null, 2));
+  },
+});
diff --git a/tests/tools/inPage.test.ts b/tests/tools/inPage.test.ts
@@ -8,8 +8,10 @@ import assert from 'node:assert';
 import {describe, it} from 'node:test';
 
 import type {ParsedArguments} from '../../src/bin/chrome-devtools-mcp-cli-options.js';
+import type {McpContext} from '../../src/McpContext.js';
+import type {McpResponse} from '../../src/McpResponse.js';
 import type {ToolGroup, ToolDefinition} from '../../src/tools/inPage.js';
-import {listInPageTools} from '../../src/tools/inPage.js';
+import {executeInPageTool, listInPageTools} from '../../src/tools/inPage.js';
 import {withMcpContext} from '../utils.js';
 
 describe('inPage', () => {
@@ -145,4 +147,200 @@ describe('inPage', () => {
       );
     });
   });
+
+  describe('execute_in_page_tool', () => {
+    async function setupInPageTools(
+      response: McpResponse,
+      context: McpContext,
+      evaluateFn: () => void,
+    ) {
+      const page = await context.newPage();
+      await page.pptrPage.evaluate(evaluateFn);
+      await listInPageTools.handler({params: {}, page}, response, context);
+      await response.handle('list_in_page_tools', context);
+    }
+
+    it('executes a tool', async () => {
+      await withMcpContext(
+        async (response, context) => {
+          await setupInPageTools(response, context, () => {
+            window.__dtmcp = {
+              toolGroup: {
+                name: 'test-group',
+                description: 'test description',
+                tools: [
+                  {
+                    name: 'test-tool',
+                    description: 'test tool description',
+                    inputSchema: {
+                      type: 'object',
+                      properties: {
+                        arg: {type: 'string'},
+                      },
+                      required: ['arg'],
+                    },
+                    execute: () => 'result',
+                  },
+                ],
+              },
+            };
+            window.addEventListener('devtoolstooldiscovery', (e: Event) => {
+              // @ts-expect-error Event has `respondWith`
+              e.respondWith(window.__dtmcp?.toolGroup);
+            });
+          });
+
+          await executeInPageTool.handler(
+            {
+              params: {
+                toolName: 'test-tool',
+                params: {arg: 'value'},
+              },
+              page: context.getSelectedMcpPage(),
+            },
+            response,
+            context,
+          );
+          assert.strictEqual(
+            response.responseLines[0],
+            JSON.stringify({result: 'result'}, null, 2),
+          );
+        },
+        undefined,
+        {categoryInPageTools: true} as ParsedArguments,
+      );
+    });
+
+    it('throws if tool not found in list', async () => {
+      await withMcpContext(async (response, context) => {
+        await setupInPageTools(response, context, () => {
+          window.__dtmcp = {
+            toolGroup: {
+              name: 'test-group',
+              description: 'test description',
+              tools: [],
+            },
+          };
+          window.addEventListener('devtoolstooldiscovery', (e: Event) => {
+            // @ts-expect-error Event has `respondWith`
+            e.respondWith(window.__dtmcp?.toolGroup);
+          });
+        });
+
+        await assert.rejects(
+          async () => {
+            await executeInPageTool.handler(
+              {
+                params: {
+                  toolName: 'missing-tool',
+                  params: {},
+                },
+                page: context.getSelectedMcpPage(),
+              },
+              response,
+              context,
+            );
+          },
+          {message: /Tool missing-tool not found/},
+        );
+      });
+    });
+
+    it('throws if parameters are invalid', async () => {
+      await withMcpContext(
+        async (response, context) => {
+          await setupInPageTools(response, context, () => {
+            window.__dtmcp = {
+              toolGroup: {
+                name: 'test-group',
+                description: 'test description',
+                tools: [
+                  {
+                    name: 'test-tool',
+                    description: 'test tool description',
+                    inputSchema: {
+                      type: 'object',
+                      properties: {
+                        arg: {type: 'string'},
+                      },
+                      required: ['arg'],
+                    },
+                    execute: () => 'result',
+                  },
+                ],
+              },
+            };
+            window.addEventListener('devtoolstooldiscovery', (e: Event) => {
+              // @ts-expect-error Event has `respondWith`
+              e.respondWith(window.__dtmcp?.toolGroup);
+            });
+          });
+
+          await assert.rejects(
+            async () => {
+              await executeInPageTool.handler(
+                {
+                  params: {
+                    toolName: 'test-tool',
+                    params: {}, // Missing required 'arg'
+                  },
+                  page: context.getSelectedMcpPage(),
+                },
+                response,
+                context,
+              );
+            },
+            {message: /Invalid parameters for tool test-tool/},
+          );
+        },
+        undefined,
+        {categoryInPageTools: true} as ParsedArguments,
+      );
+    });
+
+    it('handles JSON result', async () => {
+      await withMcpContext(
+        async (response, context) => {
+          await setupInPageTools(response, context, () => {
+            window.__dtmcp = {
+              toolGroup: {
+                name: 'test-group',
+                description: 'test description',
+                tools: [
+                  {
+                    name: 'test-tool',
+                    description: 'test tool description',
+                    inputSchema: {},
+                    execute: () => ({foo: 'bar'}),
+                  },
+                ],
+              },
+            };
+            window.addEventListener('devtoolstooldiscovery', (e: Event) => {
+              // @ts-expect-error Event has `respondWith`
+              e.respondWith(window.__dtmcp?.toolGroup);
+            });
+          });
+
+          await executeInPageTool.handler(
+            {
+              params: {
+                toolName: 'test-tool',
+                params: {},
+              },
+              page: context.getSelectedMcpPage(),
+            },
+            response,
+            context,
+          );
+          assert.strictEqual(
+            response.responseLines[0],
+            JSON.stringify({result: {foo: 'bar'}}, null, 2),
+          );
+        },
+        undefined,
+        {categoryInPageTools: true} as ParsedArguments,
+      );
+    });
+  });
 });

Original file line number	Diff line number	Diff line change
`@@ -422,6 +422,7 @@ export class McpResponse implements Response {`
`422`	`422`	`let inPageTools: ToolGroup<ToolDefinition> \| undefined;`
`423`	`423`	`if (this.#listInPageTools) {`
`424`	`424`	`inPageTools = await getToolGroup(context.getSelectedMcpPage());`
	`425`	`+ context.setInPageTools(inPageTools);`
`425`	`426`	`}`
`426`	`427`
`427`	`428`	`let consoleMessages: Array<ConsoleFormatter \| IssueFormatter> \| undefined;`