chrome-devtools-mcp 0.4.0 → 0.5.0

package/README.md

@@ -27,7 +27,7 @@ MCP clients.
 
 ## Requirements
 
-- [Node.js 22.12.0](https://nodejs.org/) or newer.
+- [Node.js 20](https://nodejs.org/) or a newer [latest maintainance LTS](https://github.com/nodejs/Release#release-schedule) version.
 - [Chrome](https://www.google.com/chrome/) current stable version or newer.
 - [npm](https://www.npmjs.com/).
 
@@ -75,6 +75,23 @@ claude mcp add chrome-devtools npx chrome-devtools-mcp@latest
 codex mcp add chrome-devtools -- npx chrome-devtools-mcp@latest
 ```
 
+**On Windows 11**
+
+Configure the Chrome install location and increase the startup timeout by updating `.codex/config.toml` and adding the following `env` and `startup_timeout_ms` parameters:
+
+```
+[mcp_servers.chrome-devtools]
+command = "cmd"
+args = [
+    "/c",
+    "npx",
+    "-y",
+    "chrome-devtools-mcp@latest",
+]
+env = { SystemRoot="C:\\Windows", PROGRAMFILES="C:\\Program Files" }
+startup_timeout_ms = 20_000
+```
+
 </details>
 
 <details>

package/build/src/McpContext.js

@@ -8,6 +8,7 @@ import os from 'node:os';
 import path from 'node:path';
 import { NetworkCollector, PageCollector } from './PageCollector.js';
 import { listPages } from './tools/pages.js';
+import { takeSnapshot } from './tools/snapshot.js';
 import { CLOSE_PAGE_ERROR } from './tools/ToolDefinition.js';
 import { WaitForHelper } from './WaitForHelper.js';
 const DEFAULT_TIMEOUT = 5_000;
@@ -191,7 +192,7 @@ export class McpContext {
     }
     async getElementByUid(uid) {
         if (!this.#textSnapshot?.idToNode.size) {
-            throw new Error('No snapshot found. Use browser_snapshot to capture one');
+            throw new Error(`No snapshot found. Use ${takeSnapshot.name} to capture one.`);
         }
         const [snapshotId] = uid.split('_');
         if (this.#textSnapshot.snapshotId !== snapshotId) {

package/build/src/McpResponse.js

@@ -1,6 +1,7 @@
 import { formatConsoleEvent } from './formatters/consoleFormatter.js';
 import { getFormattedHeaderValue, getShortDescriptionForRequest, getStatusFromRequest, } from './formatters/networkFormatter.js';
 import { formatA11ySnapshot } from './formatters/snapshotFormatter.js';
+import { handleDialog } from './tools/pages.js';
 import { paginate } from './utils/pagination.js';
 export class McpResponse {
     #includePages = false;
@@ -106,7 +107,7 @@ export class McpResponse {
         if (dialog) {
             response.push(`# Open dialog
 ${dialog.type()}: ${dialog.message()} (default value: ${dialog.message()}).
-Call browser_handle_dialog to handle it before continuing.`);
+Call ${handleDialog.name} to handle it before continuing.`);
         }
         if (this.#includePages) {
             const parts = [`## Pages`];

package/build/src/index.js

@@ -6,8 +6,12 @@
  */
 import { version } from 'node:process';
 const [major, minor] = version.substring(1).split('.').map(Number);
-if (major < 22 || (major === 22 && minor < 12)) {
-    console.error(`ERROR: \`chrome-devtools-mcp\` does not support Node ${process.version}. Please upgrade to Node 22.12.0 or newer.`);
+if (major === 22 && minor < 12) {
+    console.error(`ERROR: \`chrome-devtools-mcp\` does not support Node ${process.version}. Please upgrade to Node 22.12.0 LTS or a newer LTS.`);
+    process.exit(1);
+}
+if (major < 20) {
+    console.error(`ERROR: \`chrome-devtools-mcp\` does not support Node ${process.version}. Please upgrade to Node 20 LTS or a newer LTS.`);
     process.exit(1);
 }
 await import('./main.js');

package/build/src/main.js

@@ -3,6 +3,7 @@
  * Copyright 2025 Google LLC
  * SPDX-License-Identifier: Apache-2.0
  */
+import './polyfill.js';
 import assert from 'node:assert';
 import fs from 'node:fs';
 import path from 'node:path';

package/build/src/polyfill.js

@@ -0,0 +1,7 @@
+/**
+ * @license
+ * Copyright 2025 Google Inc.
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import 'core-js/modules/es.promise.with-resolvers.js';
+import 'core-js/proposals/iterator-helpers.js';

package/build/src/tools/pages.js

@@ -4,6 +4,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 import z from 'zod';
+import { logger } from '../logger.js';
 import { ToolCategories } from './categories.js';
 import { CLOSE_PAGE_ERROR, defineTool } from './ToolDefinition.js';
 export const listPages = defineTool({
@@ -172,12 +173,24 @@ export const handleDialog = defineTool({
         }
         switch (request.params.action) {
             case 'accept': {
-                await dialog.accept(request.params.promptText);
+                try {
+                    await dialog.accept(request.params.promptText);
+                }
+                catch (err) {
+                    // Likely already handled by the user outside of MCP.
+                    logger(err);
+                }
                 response.appendResponseLine('Successfully accepted the dialog');
                 break;
             }
             case 'dismiss': {
-                await dialog.dismiss();
+                try {
+                    await dialog.dismiss();
+                }
+                catch (err) {
+                    // Likely already handled.
+                    logger(err);
+                }
                 response.appendResponseLine('Successfully dismissed the dialog');
                 break;
             }

package/build/src/tools/screenshot.js

@@ -18,6 +18,12 @@ export const screenshot = defineTool({
             .enum(['png', 'jpeg'])
             .default('png')
             .describe('Type of format to save the screenshot as. Default is "png"'),
+        quality: z
+            .number()
+            .min(0)
+            .max(100)
+            .optional()
+            .describe('Compression quality for JPEG format (0-100). Higher values mean better quality but larger file sizes. Ignored for PNG format.'),
         uid: z
             .string()
             .optional()
@@ -41,6 +47,8 @@ export const screenshot = defineTool({
         const screenshot = await pageOrHandle.screenshot({
             type: request.params.format,
             fullPage: request.params.fullPage,
+            quality: request.params.quality,
+            optimizeForSpeed: true, // Bonus: optimize encoding for speed
         });
         if (request.params.uid) {
             response.appendResponseLine(`Took a screenshot of node with uid "${request.params.uid}".`);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "chrome-devtools-mcp",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "description": "MCP server for Chrome DevTools",
   "type": "module",
   "bin": "./build/src/index.js",
@@ -14,6 +14,7 @@
     "docs:generate": "node --experimental-strip-types scripts/generate-docs.ts",
     "start": "npm run build && node build/src/index.js",
     "start-debug": "DEBUG=mcp:* DEBUG_COLORS=false npm run build && node build/src/index.js",
+    "test:node20": "node --require ./build/tests/setup.js --test-reporter spec --test-force-exit --test build/tests",
     "test": "npm run build && node --require ./build/tests/setup.js --no-warnings=ExperimentalWarning --test-reporter spec --test-force-exit --test \"build/tests/**/*.test.js\"",
     "test:only": "npm run build && node --require ./build/tests/setup.js --no-warnings=ExperimentalWarning --test-reporter spec --test-force-exit --test --test-only \"build/tests/**/*.test.js\"",
     "test:only:no-build": "node --require ./build/tests/setup.js --no-warnings=ExperimentalWarning --test-reporter spec --test-force-exit --test --test-only \"build/tests/**/*.test.js\"",
@@ -36,7 +37,8 @@
   "homepage": "https://github.com/ChromeDevTools/chrome-devtools-mcp#readme",
   "mcpName": "io.github.ChromeDevTools/chrome-devtools-mcp",
   "dependencies": {
-    "@modelcontextprotocol/sdk": "1.18.1",
+    "@modelcontextprotocol/sdk": "1.18.2",
+    "core-js": "3.45.1",
     "debug": "4.4.3",
     "puppeteer-core": "24.22.3",
     "yargs": "18.0.0"
@@ -53,14 +55,14 @@
     "@typescript-eslint/parser": "^8.43.0",
     "chrome-devtools-frontend": "1.0.1520535",
     "eslint": "^9.35.0",
-    "eslint-plugin-import": "^2.32.0",
     "eslint-import-resolver-typescript": "^4.4.4",
+    "eslint-plugin-import": "^2.32.0",
     "globals": "^16.4.0",
     "prettier": "^3.6.2",
     "puppeteer": "24.22.3",
     "sinon": "^21.0.0",
-    "typescript-eslint": "^8.43.0",
-    "typescript": "^5.9.2"
+    "typescript": "^5.9.2",
+    "typescript-eslint": "^8.43.0"
   },
   "engines": {
     "node": ">=22.12.0"