chrome-devtools-mcp 0.24.0 → 0.26.0

package/build/src/tools/categories.js

@@ -12,8 +12,9 @@ export var ToolCategory;
     ToolCategory["NETWORK"] = "network";
     ToolCategory["DEBUGGING"] = "debugging";
     ToolCategory["EXTENSIONS"] = "extensions";
-    ToolCategory["IN_PAGE"] = "experimentalInPage";
+    ToolCategory["THIRD_PARTY"] = "experimentalThirdParty";
     ToolCategory["MEMORY"] = "memory";
+    ToolCategory["WEBMCP"] = "experimentalWebmcp";
 })(ToolCategory || (ToolCategory = {}));
 export const labels = {
     [ToolCategory.INPUT]: 'Input automation',
@@ -23,11 +24,13 @@ export const labels = {
     [ToolCategory.NETWORK]: 'Network',
     [ToolCategory.DEBUGGING]: 'Debugging',
     [ToolCategory.EXTENSIONS]: 'Extensions',
-    [ToolCategory.IN_PAGE]: 'In-page tools',
+    [ToolCategory.THIRD_PARTY]: 'Third-party',
     [ToolCategory.MEMORY]: 'Memory',
+    [ToolCategory.WEBMCP]: 'WebMCP',
 };
 export const OFF_BY_DEFAULT_CATEGORIES = [
     ToolCategory.EXTENSIONS,
-    ToolCategory.IN_PAGE,
+    ToolCategory.THIRD_PARTY,
+    ToolCategory.WEBMCP,
 ];
 //# sourceMappingURL=categories.js.map

package/build/src/tools/input.js

@@ -26,6 +26,44 @@ function handleActionError(error, uid) {
         cause: error,
     });
 }
+async function selectNativeSelectOption(handle) {
+    const selectHandle = await handle.evaluateHandle(node => {
+        if (!(node instanceof HTMLOptionElement)) {
+            return null;
+        }
+        const select = node.closest('select');
+        if (!select || select.multiple || select.disabled || node.disabled) {
+            return null;
+        }
+        const parentElement = node.parentElement;
+        if (parentElement instanceof HTMLOptGroupElement &&
+            parentElement.disabled) {
+            return null;
+        }
+        return select;
+    });
+    try {
+        const select = selectHandle.asElement();
+        if (!select) {
+            return false;
+        }
+        const valueHandle = await handle.getProperty('value');
+        try {
+            const value = await valueHandle.jsonValue();
+            if (typeof value !== 'string') {
+                return false;
+            }
+            await select.asLocator().fill(value);
+        }
+        finally {
+            void valueHandle.dispose();
+        }
+        return true;
+    }
+    finally {
+        void selectHandle.dispose();
+    }
+}
 export const click = definePageTool({
     name: 'click',
     description: `Clicks on the provided element`,
@@ -44,8 +82,14 @@ export const click = definePageTool({
     handler: async (request, response) => {
         const uid = request.params.uid;
         const handle = await request.page.getElementByUid(uid);
+        const aXNode = request.page.getAXNodeByUid(uid);
+        const shouldSelectNativeOption = !request.params.dblClick && aXNode?.role === 'option';
         try {
             await request.page.waitForEventsAfterAction(async () => {
+                if (shouldSelectNativeOption &&
+                    (await selectNativeSelectOption(handle))) {
+                    return;
+                }
                 await handle.asLocator().click({
                     count: request.params.dblClick ? 2 : 1,
                 });
@@ -176,10 +220,27 @@ async function fillFormElement(uid, value, context, page) {
             await selectOption(handle, aXNode, value);
         }
         else {
-            // Increase timeout for longer input values.
-            const timeoutPerChar = 10; // ms
-            const fillTimeout = page.pptrPage.getDefaultTimeout() + value.length * timeoutPerChar;
-            await handle.asLocator().setTimeout(fillTimeout).fill(value);
+            const isToggle = await handle.evaluate(el => {
+                if (el instanceof HTMLInputElement) {
+                    return el.type === 'checkbox' || el.type === 'radio';
+                }
+                const role = el.getAttribute('role');
+                return role === 'checkbox' || role === 'radio' || role === 'switch';
+            });
+            if (isToggle) {
+                if (['true', 'false'].includes(value)) {
+                    await handle.asLocator().fill(value === 'true');
+                }
+                else {
+                    throw new Error(`Checkboxes, radio boxes and toggles require "true" or "false" value, but ${value} was used`);
+                }
+            }
+            else {
+                // Increase timeout for longer input values.
+                const timeoutPerChar = 10; // ms
+                const fillTimeout = page.pptrPage.getDefaultTimeout() + value.length * timeoutPerChar;
+                await handle.asLocator().setTimeout(fillTimeout).fill(value);
+            }
         }
     }
     catch (error) {
@@ -200,7 +261,9 @@ export const fill = definePageTool({
         uid: zod
             .string()
             .describe('The uid of an element on the page from the page content snapshot'),
-        value: zod.string().describe('The value to fill in'),
+        value: zod
+            .string()
+            .describe('The value to fill in. "true" or "false" for checkboxes and toggles, "true" for radio buttons.'),
         includeSnapshot: includeSnapshotSchema,
     },
     blockedByDialog: true,
@@ -273,7 +336,7 @@ export const drag = definePageTool({
 });
 export const fillForm = definePageTool({
     name: 'fill_form',
-    description: `Fill out multiple form elements at once`,
+    description: `Fill out multiple form elements (inputs, selects, checkboxes, radios) at once. ALWAYS prefer this tool over multiple individual 'fill' or 'click' calls when interacting with forms. It is significantly faster, more reliable, and reduces turn count. Example: Fill username, password, and check "Remember Me" in one call.`,
     annotations: {
         category: ToolCategory.INPUT,
         readOnlyHint: false,
@@ -284,7 +347,9 @@ export const fillForm = definePageTool({
         // eslint-disable-next-line @local/enforce-zod-schema
         zod.object({
             uid: zod.string().describe('The uid of the element to fill out'),
-            value: zod.string().describe('Value for the element'),
+            value: zod
+                .string()
+                .describe('Value for the element. "true" or "false" for checkboxes and toggles, "true" for radio buttons.'),
         }))
             .describe('Elements from snapshot to fill out.'),
         includeSnapshot: includeSnapshotSchema,

package/build/src/tools/lighthouse.js

@@ -4,7 +4,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 import path from 'node:path';
-import { snapshot, navigation, generateReport, zod, agenticBrowsingConfig, } from '../third_party/index.js';
+import { snapshot, navigation, generateReport, zod, } from '../third_party/index.js';
 import { ToolCategory } from './categories.js';
 import { startTrace } from './performance.js';
 import { definePageTool } from './ToolDefinition.js';
@@ -67,17 +67,17 @@ export const lighthouseAudit = definePageTool({
                 disabled: false,
             };
         }
-        const options = {
-            flags,
-            config: agenticBrowsingConfig,
-        };
         let result;
         try {
             if (mode === 'navigation') {
-                result = await navigation(page.pptrPage, page.pptrPage.url(), options);
+                result = await navigation(page.pptrPage, page.pptrPage.url(), {
+                    flags,
+                });
             }
             else {
-                result = await snapshot(page.pptrPage, options);
+                result = await snapshot(page.pptrPage, {
+                    flags,
+                });
             }
             if (!result) {
                 throw new Error('Lighthouse audit failed.');

package/build/src/tools/pages.js

@@ -64,7 +64,7 @@ export const listPages = defineTool(args => {
         blockedByDialog: false,
         handler: async (_request, response) => {
             response.setIncludePages(true);
-            response.setListInPageTools();
+            response.setListThirdPartyDeveloperTools();
             response.setListWebMcpTools();
         },
     };
@@ -90,7 +90,7 @@ export const selectPage = defineTool({
         const page = context.getPageById(request.params.pageId);
         context.selectPage(page);
         response.setIncludePages(true);
-        response.setListInPageTools();
+        response.setListThirdPartyDeveloperTools();
         response.setListWebMcpTools();
         if (request.params.bringToFront) {
             await page.pptrPage.bringToFront();
@@ -123,7 +123,7 @@ export const closePage = defineTool({
             }
         }
         response.setIncludePages(true);
-        response.setListInPageTools();
+        response.setListThirdPartyDeveloperTools();
     },
 });
 export const newPage = defineTool(args => {
@@ -163,7 +163,7 @@ export const newPage = defineTool(args => {
                 timeout: request.params.timeout,
             }), request.params.allowList, request.params.timeout);
             response.setIncludePages(true);
-            response.setListInPageTools();
+            response.setListThirdPartyDeveloperTools();
         },
     };
 });
@@ -295,7 +295,7 @@ export const navigatePage = definePageTool(args => {
                 }
             }
             response.setIncludePages(true);
-            response.setListInPageTools();
+            response.setListThirdPartyDeveloperTools();
             response.setListWebMcpTools();
         },
     };

package/build/src/tools/{inPage.js → thirdPartyDeveloper.js}

@@ -6,30 +6,30 @@
 import { zod, ajv } from '../third_party/index.js';
 import { ToolCategory } from './categories.js';
 import { definePageTool } from './ToolDefinition.js';
-export const listInPageTools = definePageTool({
-    name: '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
+export const listThirdPartyDeveloperTools = definePageTool({
+    name: 'list_3p_developer_tools',
+    description: `Lists all third-party developer tools the page exposes for providing runtime information.
+  Third-party developer tools can be called via the 'execute_3p_developer_tool()' MCP tool.
+  Alternatively, third-party developer 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.`,
+  This might be helpful when the third-party developer tools return non-serializable values or when composing
+  third-party developer tools with additional functionality.`,
     annotations: {
-        category: ToolCategory.IN_PAGE,
+        category: ToolCategory.THIRD_PARTY,
         readOnlyHint: true,
     },
     schema: {},
     blockedByDialog: false,
     handler: async (_request, response, _context) => {
-        response.setListInPageTools();
+        response.setListThirdPartyDeveloperTools();
     },
 });
-export const executeInPageTool = definePageTool({
-    name: 'execute_in_page_tool',
+export const executeThirdPartyDeveloperTool = definePageTool({
+    name: 'execute_3p_developer_tool',
     description: `Executes a tool exposed by the page.`,
     annotations: {
-        category: ToolCategory.IN_PAGE,
+        category: ToolCategory.THIRD_PARTY,
         readOnlyHint: false,
     },
     schema: {
@@ -58,7 +58,7 @@ export const executeInPageTool = definePageTool({
                 throw new Error(`Failed to parse params as JSON: ${errorMessage}`);
             }
         }
-        const toolGroup = request.page.getInPageTools();
+        const toolGroup = request.page.getThirdPartyDeveloperTools();
         const tool = toolGroup?.tools.find(t => t.name === toolName);
         if (!tool) {
             throw new Error(`Tool ${toolName} not found`);
@@ -69,7 +69,7 @@ export const executeInPageTool = definePageTool({
         if (!valid) {
             throw new Error(`Invalid parameters for tool ${toolName}: ${ajvInstance.errorsText(validate.errors)}`);
         }
-        await request.page.executeInPageTool(toolName, params, response);
+        await request.page.executeThirdPartyDeveloperTool(toolName, params, response);
     },
 });
-//# sourceMappingURL=inPage.js.map
+//# sourceMappingURL=thirdPartyDeveloper.js.map

package/build/src/tools/tools.js

@@ -6,7 +6,6 @@
 import * as consoleTools from './console.js';
 import * as emulationTools from './emulation.js';
 import * as extensionTools from './extensions.js';
-import * as inPageTools from './inPage.js';
 import * as inputTools from './input.js';
 import * as lighthouseTools from './lighthouse.js';
 import * as memoryTools from './memory.js';
@@ -18,6 +17,7 @@ import * as screenshotTools from './screenshot.js';
 import * as scriptTools from './script.js';
 import * as slimTools from './slim/tools.js';
 import * as snapshotTools from './snapshot.js';
+import * as thirdPartyDeveloperTools from './thirdPartyDeveloper.js';
 import * as webmcpTools from './webmcp.js';
 export const createTools = (args) => {
     const rawTools = args.slim
@@ -26,7 +26,6 @@ export const createTools = (args) => {
             ...Object.values(consoleTools),
             ...Object.values(emulationTools),
             ...Object.values(extensionTools),
-            ...Object.values(inPageTools),
             ...Object.values(inputTools),
             ...Object.values(lighthouseTools),
             ...Object.values(memoryTools),
@@ -37,6 +36,7 @@ export const createTools = (args) => {
             ...Object.values(screenshotTools),
             ...Object.values(scriptTools),
             ...Object.values(snapshotTools),
+            ...Object.values(thirdPartyDeveloperTools),
             ...Object.values(webmcpTools),
         ];
     const tools = [];

package/build/src/tools/webmcp.js

@@ -10,9 +10,8 @@ export const listWebMcpTools = definePageTool({
     name: 'list_webmcp_tools',
     description: `Lists all WebMCP tools the page exposes.`,
     annotations: {
-        category: ToolCategory.DEBUGGING,
+        category: ToolCategory.WEBMCP,
         readOnlyHint: true,
-        conditions: ['experimentalWebmcp'],
     },
     schema: {},
     blockedByDialog: false,
@@ -24,9 +23,8 @@ export const executeWebMcpTool = definePageTool({
     name: 'execute_webmcp_tool',
     description: `Executes a WebMCP tool exposed by the page.`,
     annotations: {
-        category: ToolCategory.DEBUGGING,
+        category: ToolCategory.WEBMCP,
         readOnlyHint: false,
-        conditions: ['experimentalWebmcp'],
     },
     schema: {
         toolName: zod.string().describe('The name of the WebMCP tool to execute'),

package/build/src/version.js

@@ -5,6 +5,6 @@
  */
 // If moved update release-please config
 // x-release-please-start-version
-export const VERSION = '0.24.0';
+export const VERSION = '0.26.0';
 // x-release-please-end
 //# sourceMappingURL=version.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "chrome-devtools-mcp",
-  "version": "0.24.0",
+  "version": "0.26.0",
   "description": "MCP server for Chrome DevTools",
   "type": "module",
   "bin": {
@@ -48,7 +48,7 @@
   "mcpName": "io.github.ChromeDevTools/chrome-devtools-mcp",
   "devDependencies": {
     "@eslint/js": "^9.35.0",
-    "@google/genai": "^1.37.0",
+    "@google/genai": "^2.0.1",
     "@modelcontextprotocol/sdk": "1.29.0",
     "@rollup/plugin-commonjs": "^29.0.0",
     "@rollup/plugin-json": "^6.1.0",
@@ -62,22 +62,21 @@
     "@types/yargs": "^17.0.33",
     "@typescript-eslint/eslint-plugin": "^8.43.0",
     "@typescript-eslint/parser": "^8.43.0",
-    "chrome-devtools-frontend": "1.0.1618066",
+    "chrome-devtools-frontend": "1.0.1626840",
     "core-js": "3.49.0",
     "debug": "4.4.3",
     "eslint": "^9.35.0",
     "eslint-import-resolver-typescript": "^4.4.4",
     "eslint-plugin-import": "^2.32.0",
     "globals": "^17.0.0",
-    "lighthouse": "13.2.0",
+    "lighthouse": "13.3.0",
     "prettier": "^3.6.2",
-    "puppeteer": "24.42.0",
-    "rollup": "4.60.2",
+    "puppeteer": "24.43.0",
+    "rollup": "4.60.3",
     "rollup-plugin-cleanup": "^3.2.1",
     "rollup-plugin-license": "^3.6.0",
     "semver": "^7.7.4",
-    "sinon": "^21.0.0",
-    "tiktoken": "^1.0.22",
+    "sinon": "^22.0.0",
     "typescript": "^6.0.2",
     "typescript-eslint": "^8.43.0",
     "urlpattern-polyfill": "^10.1.0",