chrome-devtools-mcp 0.3.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>
@@ -102,8 +119,22 @@ Go to `Cursor Settings` -> `MCP` -> `New MCP Server`. Use the config provided ab
 
 <details>
   <summary>Gemini CLI</summary>
-  Follow the <a href="https://github.com/google-gemini/gemini-cli/blob/main/docs/tools/mcp-server.md#how-to-set-up-your-mcp-server">MCP guide</a>
-  using the standard config from above.
+Install the Chrome DevTools MCP server using the Gemini CLI.
+
+**Project wide:**
+
+```bash
+gemini mcp add chrome-devtools npx chrome-devtools-mcp@latest
+```
+
+**Globally:**
+
+```bash
+gemini mcp add -s user chrome-devtools npx chrome-devtools-mcp@latest
+```
+
+Alternatively, follow the <a href="https://github.com/google-gemini/gemini-cli/blob/main/docs/tools/mcp-server.md#how-to-set-up-your-mcp-server">MCP guide</a> and use the standard config from above.
+
 </details>
 
 <details>
@@ -201,6 +232,10 @@ The Chrome DevTools MCP server supports the following configuration option:
   - **Type:** string
   - **Choices:** `stable`, `canary`, `beta`, `dev`
 
+- **`--logFile`**
+  Path to a file to write debug logs to. Set the env variable `DEBUG` to `*` to enable verbose logs. Useful for submitting bug reports.
+  - **Type:** string
+
 <!-- END AUTO GENERATED OPTIONS -->
 
 Pass them via the `args` property in the JSON configuration. For example:

package/build/node_modules/chrome-devtools-frontend/front_end/core/host/GdpClient.js

@@ -19,7 +19,7 @@ export var SubscriptionTier;
     SubscriptionTier["PRO_ANNUAL"] = "SUBSCRIPTION_TIER_PRO_ANNUAL";
     SubscriptionTier["PRO_MONTHLY"] = "SUBSCRIPTION_TIER_PRO_MONTHLY";
 })(SubscriptionTier || (SubscriptionTier = {}));
-var EligibilityStatus;
+export var EligibilityStatus;
 (function (EligibilityStatus) {
     EligibilityStatus["ELIGIBLE"] = "ELIGIBLE";
     EligibilityStatus["NOT_ELIGIBLE"] = "NOT_ELIGIBLE";
@@ -65,12 +65,18 @@ export class GdpClient {
         return gdpClientInstance;
     }
     async initialize() {
-        return await Promise.all([this.getProfile(), this.checkEligibility()]).then(([profile, eligibilityResponse]) => {
+        const profile = await this.getProfile();
+        if (profile) {
             return {
-                hasProfile: Boolean(profile),
-                isEligible: eligibilityResponse?.createProfile === EligibilityStatus.ELIGIBLE
+                hasProfile: true,
+                isEligible: true,
             };
-        });
+        }
+        const isEligible = await this.isEligibleToCreateProfile();
+        return {
+            hasProfile: false,
+            isEligible,
+        };
     }
     async getProfile() {
         if (this.#cachedProfilePromise) {
@@ -81,7 +87,11 @@ export class GdpClient {
             path: '/v1beta1/profile:get',
             method: 'GET',
         });
-        return await this.#cachedProfilePromise;
+        const profile = await this.#cachedProfilePromise;
+        if (profile) {
+            this.#cachedEligibilityPromise = Promise.resolve({ createProfile: EligibilityStatus.ELIGIBLE });
+        }
+        return profile;
     }
     async checkEligibility() {
         if (this.#cachedEligibilityPromise) {

package/build/node_modules/chrome-devtools-frontend/front_end/models/ai_assistance/data_formatters/PerformanceInsightFormatter.js

@@ -27,20 +27,12 @@ function getLCPData(parsedTrace, frameId, navigationId) {
         metricScore: metric,
     };
 }
-export class PerformanceInsightFormatter extends PerformanceTraceFormatter {
+export class PerformanceInsightFormatter {
+    #traceFormatter;
     #insight;
     #parsedTrace;
-    /**
-     * A utility method because we dependency inject this formatter into
-     * PerformanceTraceFormatter; this allows you to pass
-     * PerformanceInsightFormatter.create rather than an anonymous
-     * function that wraps the constructor.
-     */
-    static create(focus, insight) {
-        return new PerformanceInsightFormatter(focus, insight);
-    }
     constructor(focus, insight) {
-        super(focus, null);
+        this.#traceFormatter = new PerformanceTraceFormatter(focus);
         this.#insight = insight;
         this.#parsedTrace = focus.parsedTrace;
     }
@@ -57,8 +49,7 @@ export class PerformanceInsightFormatter extends PerformanceTraceFormatter {
         return this.#formatMilli(Trace.Helpers.Timing.microToMilli(x));
     }
     #formatRequestUrl(request) {
-        const eventKey = this.eventsSerializer.keyForEvent(request);
-        return `${request.args.data.url} (eventKey: ${eventKey})`;
+        return `${request.args.data.url} ${this.#traceFormatter.serializeEvent(request)}`;
     }
     #formatScriptUrl(script) {
         if (script.request) {
@@ -97,7 +88,7 @@ export class PerformanceInsightFormatter extends PerformanceTraceFormatter {
         ];
         if (lcpRequest) {
             parts.push(`${theLcpElement} is an image fetched from ${this.#formatRequestUrl(lcpRequest)}.`);
-            const request = this.formatNetworkRequests([lcpRequest], { verbose: true, customTitle: 'LCP resource network request' });
+            const request = this.#traceFormatter.formatNetworkRequests([lcpRequest], { verbose: true, customTitle: 'LCP resource network request' });
             parts.push(request);
         }
         else {
@@ -305,7 +296,7 @@ ${shiftsFormatted.join('\n')}`;
         });
         return `${this.#lcpMetricSharedContext()}
 
-${this.formatNetworkRequests([documentRequest], {
+${this.#traceFormatter.formatNetworkRequests([documentRequest], {
             verbose: true,
             customTitle: 'Document network request'
         })}
@@ -580,8 +571,8 @@ ${filesFormatted}`;
      */
     formatModernHttpInsight(insight) {
         const requestSummary = (insight.http1Requests.length === 1) ?
-            this.formatNetworkRequests(insight.http1Requests, { verbose: true }) :
-            this.formatNetworkRequests(insight.http1Requests);
+            this.#traceFormatter.formatNetworkRequests(insight.http1Requests, { verbose: true }) :
+            this.#traceFormatter.formatNetworkRequests(insight.http1Requests);
         if (requestSummary.length === 0) {
             return 'There are no requests that were served over a legacy HTTP protocol.';
         }
@@ -665,7 +656,7 @@ ${requestSummary}`;
      * @returns a string formatted for sending to Ask AI.
      */
     formatRenderBlockingInsight(insight) {
-        const requestSummary = this.formatNetworkRequests(insight.renderBlockingRequests);
+        const requestSummary = this.#traceFormatter.formatNetworkRequests(insight.renderBlockingRequests);
         if (requestSummary.length === 0) {
             return 'There are no network requests that are render blocking.';
         }
@@ -856,7 +847,7 @@ ${this.#links()}`;
     #links() {
         switch (this.#insight.insightKey) {
             case 'CLSCulprits':
-                return `- https://wdeb.dev/articles/cls
+                return `- https://web.dev/articles/cls
 - https://web.dev/articles/optimize-cls`;
             case 'DocumentLatency':
                 return '- https://web.dev/articles/optimize-ttfb';

package/build/node_modules/chrome-devtools-frontend/front_end/models/ai_assistance/data_formatters/PerformanceTraceFormatter.js

@@ -5,28 +5,21 @@ import * as CrUXManager from '../../crux-manager/crux-manager.js';
 import * as Trace from '../../trace/trace.js';
 import { AIQueries } from '../performance/AIQueries.js';
 import { NetworkRequestFormatter } from './NetworkRequestFormatter.js';
+import { PerformanceInsightFormatter } from './PerformanceInsightFormatter.js';
 import { bytes, micros, millis } from './UnitFormatters.js';
 export class PerformanceTraceFormatter {
     #focus;
     #parsedTrace;
     #insightSet;
-    #getInsightFormatter = null;
-    eventsSerializer;
-    /**
-     * We inject the insight formatter because otherwise we get a circular
-     * dependency between PerformanceInsightFormatter and
-     * PerformanceTraceFormatter. This is OK in the browser build, but breaks when
-     * we reuse this code in NodeJS for DevTools MCP.
-     */
-    constructor(focus, getInsightFormatter) {
+    #eventsSerializer;
+    constructor(focus) {
         this.#focus = focus;
         this.#parsedTrace = focus.parsedTrace;
         this.#insightSet = focus.insightSet;
-        this.eventsSerializer = focus.eventsSerializer;
-        this.#getInsightFormatter = getInsightFormatter;
+        this.#eventsSerializer = focus.eventsSerializer;
     }
     serializeEvent(event) {
-        const key = this.eventsSerializer.keyForEvent(event);
+        const key = this.#eventsSerializer.keyForEvent(event);
         return `(eventKey: ${key}, ts: ${event.ts})`;
     }
     serializeBounds(bounds) {
@@ -155,10 +148,7 @@ export class PerformanceTraceFormatter {
                 if (model.state === 'pass') {
                     continue;
                 }
-                const formatter = this.#getInsightFormatter?.(this.#focus, model);
-                if (!formatter) {
-                    continue;
-                }
+                const formatter = new PerformanceInsightFormatter(this.#focus, model);
                 if (!formatter.insightIsSupported()) {
                     continue;
                 }
@@ -455,7 +445,7 @@ export class PerformanceTraceFormatter {
         });
         const initiators = this.#getInitiatorChain(parsedTrace, request);
         const initiatorUrls = initiators.map(initiator => initiator.args.data.url);
-        const eventKey = this.eventsSerializer.keyForEvent(request);
+        const eventKey = this.#eventsSerializer.keyForEvent(request);
         const eventKeyLine = eventKey ? `eventKey: ${eventKey}\n` : '';
         return `${titlePrefix}: ${url}
 ${eventKeyLine}Timings:
@@ -504,6 +494,29 @@ Network requests data:
                 .join(', ')}]`;
         return networkDataString + '\n\n' + urlsMapString + '\n\n' + allRequestsText;
     }
+    static callFrameDataFormatDescription = `Each call frame is presented in the following format:
+
+'id;eventKey;name;duration;selfTime;urlIndex;childRange;[S]'
+
+Key definitions:
+
+* id: A unique numerical identifier for the call frame. Never mention this id in the output to the user.
+* eventKey: String that uniquely identifies this event in the flame chart.
+* name: A concise string describing the call frame (e.g., 'Evaluate Script', 'render', 'fetchData').
+* duration: The total execution time of the call frame, including its children.
+* selfTime: The time spent directly within the call frame, excluding its children's execution.
+* urlIndex: Index referencing the "All URLs" list. Empty if no specific script URL is associated.
+* childRange: Specifies the direct children of this node using their IDs. If empty ('' or 'S' at the end), the node has no children. If a single number (e.g., '4'), the node has one child with that ID. If in the format 'firstId-lastId' (e.g., '4-5'), it indicates a consecutive range of child IDs from 'firstId' to 'lastId', inclusive.
+* S: _Optional_. The letter 'S' terminates the line if that call frame was selected by the user.
+
+Example Call Tree:
+
+1;r-123;main;500;100;;
+2;r-124;update;200;50;;3
+3;p-49575-15428179-2834-374;animate;150;20;0;4-5;S
+4;p-49575-15428179-3505-1162;calculatePosition;80;80;;
+5;p-49575-15428179-5391-2767;applyStyles;50;50;;
+`;
     /**
      * Network requests format description that is sent to the model as a fact.
      */
@@ -575,7 +588,7 @@ The order of headers corresponds to an internal fixed list. If a header is not p
         const initiatorUrlIndices = initiators.map(initiator => this.#getOrAssignUrlIndex(urlIdToIndex, initiator.args.data.url));
         const parts = [
             urlIndex,
-            this.eventsSerializer.keyForEvent(request) ?? '',
+            this.#eventsSerializer.keyForEvent(request) ?? '',
             queuedTime,
             requestSentTime,
             downloadCompleteTime,

package/build/node_modules/chrome-devtools-frontend/front_end/third_party/legacy-javascript/legacy-javascript.js

@@ -1,38 +1,2 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.LegacyJavaScript = void 0;
-const LegacyJavaScript = __importStar(require("./lib/legacy-javascript.js"));
-exports.LegacyJavaScript = LegacyJavaScript;
+import * as LegacyJavaScript from './lib/legacy-javascript.js';
+export { LegacyJavaScript };

package/build/node_modules/chrome-devtools-frontend/front_end/third_party/legacy-javascript/lib/legacy-javascript.js

@@ -1,8 +1,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.detectLegacyJavaScript = detectLegacyJavaScript;
-exports.getCoreJsPolyfillData = getCoreJsPolyfillData;
-exports.getTransformPatterns = getTransformPatterns;
 // core/lib/legacy-javascript/polyfill-module-data.json
 var polyfill_module_data_default = [
     {
@@ -937,6 +932,7 @@ function detectLegacyJavaScript(content, map) {
         estimatedByteSavings: estimateWastedBytes(content, matches)
     };
 }
+export { detectLegacyJavaScript, getCoreJsPolyfillData, getTransformPatterns };
 /**
  * @license
  * Copyright 2025 Google LLC

package/build/node_modules/chrome-devtools-frontend/front_end/third_party/third-party-web/lib/nostats-subset.js

@@ -1,5 +1,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __commonJS = (cb, mod) => function __require() {
     return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
@@ -145,4 +143,4 @@ var require_nostats_subset = __commonJS({
         module.exports = require_nostats();
     }
 });
-exports.default = require_nostats_subset();
+export default require_nostats_subset();

package/build/node_modules/chrome-devtools-frontend/front_end/third_party/third-party-web/third-party-web.js

@@ -1,8 +1,2 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ThirdPartyWeb = void 0;
-const nostats_subset_js_1 = __importDefault(require("./lib/nostats-subset.js"));
-exports.ThirdPartyWeb = nostats_subset_js_1.default;
+import ThirdPartyWeb from './lib/nostats-subset.js';
+export { ThirdPartyWeb };

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,17 +1,17 @@
 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;
     #includeSnapshot = false;
-    #includeNetworkRequests = false;
     #attachedNetworkRequestUrl;
     #includeConsoleData = false;
     #textResponseLines = [];
     #formattedConsoleData;
     #images = [];
-    #networkRequestsPaginationOptions;
+    #networkRequestsOptions;
     setIncludePages(value) {
         this.#includePages = value;
     }
@@ -19,14 +19,19 @@ export class McpResponse {
         this.#includeSnapshot = value;
     }
     setIncludeNetworkRequests(value, options) {
-        this.#includeNetworkRequests = value;
-        if (!value || !options) {
-            this.#networkRequestsPaginationOptions = undefined;
+        if (!value) {
+            this.#networkRequestsOptions = undefined;
             return;
         }
-        this.#networkRequestsPaginationOptions = {
-            pageSize: options.pageSize,
-            pageIdx: options.pageIdx,
+        this.#networkRequestsOptions = {
+            include: value,
+            pagination: options?.pageSize || options?.pageIdx
+                ? {
+                    pageSize: options.pageSize,
+                    pageIdx: options.pageIdx,
+                }
+                : undefined,
+            resourceTypes: options?.resourceTypes,
         };
     }
     setIncludeConsoleData(value) {
@@ -39,7 +44,7 @@ export class McpResponse {
         return this.#includePages;
     }
     get includeNetworkRequests() {
-        return this.#includeNetworkRequests;
+        return this.#networkRequestsOptions?.include ?? false;
     }
     get includeConsoleData() {
         return this.#includeConsoleData;
@@ -48,7 +53,7 @@ export class McpResponse {
         return this.#attachedNetworkRequestUrl;
     }
     get networkRequestsPageIdx() {
-        return this.#networkRequestsPaginationOptions?.pageIdx;
+        return this.#networkRequestsOptions?.pagination?.pageIdx;
     }
     appendResponseLine(value) {
         this.#textResponseLines.push(value);
@@ -102,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`];
@@ -122,17 +127,25 @@ Call browser_handle_dialog to handle it before continuing.`);
             }
         }
         response.push(...this.#getIncludeNetworkRequestsData(context));
-        if (this.#includeNetworkRequests) {
-            const requests = context.getNetworkRequests();
+        if (this.#networkRequestsOptions?.include) {
+            let requests = context.getNetworkRequests();
+            // Apply resource type filtering if specified
+            if (this.#networkRequestsOptions.resourceTypes?.length) {
+                const normalizedTypes = new Set(this.#networkRequestsOptions.resourceTypes);
+                requests = requests.filter(request => {
+                    const type = request.resourceType();
+                    return normalizedTypes.has(type);
+                });
+            }
             response.push('## Network requests');
             if (requests.length) {
-                const paginationResult = paginate(requests, this.#networkRequestsPaginationOptions);
+                const paginationResult = paginate(requests, this.#networkRequestsOptions.pagination);
                 if (paginationResult.invalidPage) {
                     response.push('Invalid page number provided. Showing first page.');
                 }
                 const { startIndex, endIndex, currentPage, totalPages } = paginationResult;
                 response.push(`Showing ${startIndex + 1}-${endIndex} of ${requests.length} (Page ${currentPage + 1} of ${totalPages}).`);
-                if (this.#networkRequestsPaginationOptions) {
+                if (this.#networkRequestsOptions.pagination) {
                     if (paginationResult.hasNextPage) {
                         response.push(`Next page: ${currentPage + 1}`);
                     }

package/build/src/cli.js

@@ -46,8 +46,7 @@ export const cliOptions = {
     },
     logFile: {
         type: 'string',
-        describe: 'Save the logs to file.',
-        hidden: true,
+        describe: 'Path to a file to write debug logs to. Set the env variable `DEBUG` to `*` to enable verbose logs. Useful for submitting bug reports.',
     },
 };
 export function parseArguments(version, argv = process.argv) {

package/build/src/index.js

@@ -4,10 +4,14 @@
  * Copyright 2025 Google LLC
  * SPDX-License-Identifier: Apache-2.0
  */
-const [major, minor] = process.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.`);
+import { version } from 'node:process';
+const [major, minor] = version.substring(1).split('.').map(Number);
+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');
-export {};

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';
@@ -70,7 +71,7 @@ async function getContext() {
 const logDisclaimers = () => {
     console.error(`chrome-devtools-mcp exposes content of the browser instance to the MCP clients allowing them to inspect,
 debug, and modify any data in the browser or DevTools.
-Avoid sharing sensitive or personal information that you do want to share with MCP clients.`);
+Avoid sharing sensitive or personal information that you do not want to share with MCP clients.`);
 };
 const toolMutex = new Mutex();
 function registerTool(tool) {

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/network.js

@@ -6,6 +6,27 @@
 import z from 'zod';
 import { ToolCategories } from './categories.js';
 import { defineTool } from './ToolDefinition.js';
+const FILTERABLE_RESOURCE_TYPES = [
+    'document',
+    'stylesheet',
+    'image',
+    'media',
+    'font',
+    'script',
+    'texttrack',
+    'xhr',
+    'fetch',
+    'prefetch',
+    'eventsource',
+    'websocket',
+    'manifest',
+    'signedexchange',
+    'ping',
+    'cspviolationreport',
+    'preflight',
+    'fedcm',
+    'other',
+];
 export const listNetworkRequests = defineTool({
     name: 'list_network_requests',
     description: `List all requests for the currently selected page`,
@@ -26,11 +47,16 @@ export const listNetworkRequests = defineTool({
             .min(0)
             .optional()
             .describe('Page number to return (0-based). When omitted, returns the first page.'),
+        resourceTypes: z
+            .array(z.enum(FILTERABLE_RESOURCE_TYPES))
+            .optional()
+            .describe('Filter requests to only return requests of the specified resource types. When omitted or empty, returns all requests.'),
     },
     handler: async (request, response) => {
         response.setIncludeNetworkRequests(true, {
             pageSize: request.params.pageSize,
             pageIdx: request.params.pageIdx,
+            resourceTypes: request.params.resourceTypes,
         });
     },
 });

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/performance.js

@@ -10,7 +10,7 @@ import { ToolCategories } from './categories.js';
 import { defineTool } from './ToolDefinition.js';
 export const startTrace = defineTool({
     name: 'performance_start_trace',
-    description: 'Starts a performance trace recording on the selected page.',
+    description: 'Starts a performance trace recording on the selected page. This can be used to look for performance problems and insights to improve the performance of the page. It will also report Core Web Vital (CWV) scores for the page.',
     annotations: {
         category: ToolCategories.PERFORMANCE,
         readOnlyHint: true,
@@ -18,7 +18,7 @@ export const startTrace = defineTool({
     schema: {
         reload: z
             .boolean()
-            .describe('Determines if, once tracing has started, the page should be automatically reloaded'),
+            .describe('Determines if, once tracing has started, the page should be automatically reloaded.'),
         autoStop: z
             .boolean()
             .describe('Determines if the trace recording should be automatically stopped.'),

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/build/src/trace-processing/parse.js

@@ -49,11 +49,19 @@ export async function parseRawTraceBuffer(buffer) {
         };
     }
 }
+const extraFormatDescriptions = `Information on performance traces may contain main thread activity represented as call frames and network requests.
+
+${PerformanceTraceFormatter.callFrameDataFormatDescription}
+
+${PerformanceTraceFormatter.networkDataFormatDescription}
+`;
 export function getTraceSummary(result) {
     const focus = AgentFocus.fromParsedTrace(result.parsedTrace);
-    const formatter = new PerformanceTraceFormatter(focus, PerformanceInsightFormatter.create);
+    const formatter = new PerformanceTraceFormatter(focus);
     const output = formatter.formatTraceSummary();
-    return output;
+    return `${extraFormatDescriptions}
+
+${output}`;
 }
 export function getInsightOutput(result, insightName) {
     if (!result.insights) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "chrome-devtools-mcp",
-  "version": "0.3.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"
@@ -51,16 +53,16 @@
     "@types/yargs": "^17.0.33",
     "@typescript-eslint/eslint-plugin": "^8.43.0",
     "@typescript-eslint/parser": "^8.43.0",
-    "chrome-devtools-frontend": "1.0.1520139",
+    "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"