chrome-devtools-mcp 0.10.1 → 0.11.0

package/build/src/formatters/consoleFormatter.js

@@ -5,6 +5,9 @@
  */
 // The short format for a console message, based on a previous format.
 export function formatConsoleEventShort(msg) {
+    if (msg.type === 'issue') {
+        return `msgid=${msg.consoleMessageStableId} [${msg.type}] ${msg.message} (count: ${msg.count})`;
+    }
     return `msgid=${msg.consoleMessageStableId} [${msg.type}] ${msg.message} (${msg.args?.length ?? 0} args)`;
 }
 function getArgs(msg) {
@@ -16,11 +19,12 @@ function getArgs(msg) {
     return args;
 }
 // The verbose format for a console message, including all details.
-export function formatConsoleEventVerbose(msg) {
+export function formatConsoleEventVerbose(msg, context) {
+    const aggregatedIssue = msg.item;
     const result = [
         `ID: ${msg.consoleMessageStableId}`,
-        `Message: ${msg.type}> ${msg.message}`,
-        formatArgs(msg),
+        `Message: ${msg.type}> ${aggregatedIssue ? formatIssue(aggregatedIssue, msg.description, context) : msg.message}`,
+        aggregatedIssue ? undefined : formatArgs(msg),
     ].filter(line => !!line);
     return result.join('\n');
 }
@@ -38,3 +42,80 @@ function formatArgs(consoleData) {
     }
     return result.join('\n');
 }
+export function formatIssue(issue, description, context) {
+    const result = [];
+    let processedMarkdown = description?.trim();
+    // Remove heading in order not to conflict with the whole console message response markdown
+    if (processedMarkdown?.startsWith('# ')) {
+        processedMarkdown = processedMarkdown.substring(2).trimStart();
+    }
+    if (processedMarkdown)
+        result.push(processedMarkdown);
+    const links = issue.getDescription()?.links;
+    if (links && links.length > 0) {
+        result.push('Learn more:');
+        for (const link of links) {
+            result.push(`[${link.linkTitle}](${link.link})`);
+        }
+    }
+    const issues = issue.getAllIssues();
+    const affectedResources = [];
+    for (const singleIssue of issues) {
+        const details = singleIssue.details();
+        if (!details)
+            continue;
+        // We send the remaining details as untyped JSON because the DevTools
+        // frontend code is currently not re-usable.
+        // eslint-disable-next-line
+        const data = structuredClone(details);
+        let uid;
+        let request;
+        if ('violatingNodeId' in details && details.violatingNodeId && context) {
+            uid = context.resolveCdpElementId(details.violatingNodeId);
+            delete data.violatingNodeId;
+        }
+        if ('nodeId' in details && details.nodeId && context) {
+            uid = context.resolveCdpElementId(details.nodeId);
+            delete data.nodeId;
+        }
+        if ('documentNodeId' in details && details.documentNodeId && context) {
+            uid = context.resolveCdpElementId(details.documentNodeId);
+            delete data.documentNodeId;
+        }
+        if ('request' in details && details.request) {
+            request = details.request.url;
+            if (details.request.requestId && context) {
+                const resolvedId = context.resolveCdpRequestId(details.request.requestId);
+                if (resolvedId) {
+                    request = resolvedId;
+                    delete data.request.requestId;
+                }
+            }
+        }
+        // These fields has no use for the MCP client (redundant or irrelevant).
+        delete data.errorType;
+        delete data.frameId;
+        affectedResources.push({
+            uid,
+            data: data,
+            request,
+        });
+    }
+    if (affectedResources.length) {
+        result.push('### Affected resources');
+    }
+    result.push(...affectedResources.map(item => {
+        const details = [];
+        if (item.uid)
+            details.push(`uid=${item.uid}`);
+        if (item.request) {
+            details.push((typeof item.request === 'number' ? `reqid=` : 'url=') + item.request);
+        }
+        if (item.data)
+            details.push(`data=${JSON.stringify(item.data)}`);
+        return details.join(' ');
+    }));
+    if (result.length === 0)
+        return 'No affected resources found';
+    return result.join('\n');
+}

package/build/src/formatters/snapshotFormatter.js

@@ -1,5 +1,19 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
 export function formatSnapshotNode(root, snapshot, depth = 0) {
-    let result = '';
+    const chunks = [];
+    if (depth === 0) {
+        // Top-level content of the snapshot.
+        if (snapshot?.verbose &&
+            snapshot?.hasSelectedElement &&
+            !snapshot.selectedElementUid) {
+            chunks.push(`Note: there is a selected element in the DevTools Elements panel but it is not included into the current a11y tree snapshot.
+Get a verbose snapshot to include all elements if you are interested in the selected element.\n\n`);
+        }
+    }
     const attributes = getAttributes(root);
     const line = ' '.repeat(depth * 2) +
         attributes.join(' ') +
@@ -7,11 +21,11 @@ export function formatSnapshotNode(root, snapshot, depth = 0) {
             ? ' [selected in the DevTools Elements panel]'
             : '') +
         '\n';
-    result += line;
+    chunks.push(line);
     for (const child of root.children) {
-        result += formatSnapshotNode(child, snapshot, depth + 1);
+        chunks.push(formatSnapshotNode(child, snapshot, depth + 1));
     }
-    return result;
+    return chunks.join('');
 }
 function getAttributes(serializedAXNodeRoot) {
     const attributes = [`uid=${serializedAXNodeRoot.id}`];

package/build/src/issue-descriptions.js

@@ -0,0 +1,39 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import * as fs from 'node:fs';
+import * as path from 'node:path';
+const DESCRIPTIONS_PATH = path.join(import.meta.dirname, '../node_modules/chrome-devtools-frontend/front_end/models/issues_manager/descriptions');
+let issueDescriptions = {};
+/**
+ * Reads all issue descriptions from the filesystem into memory.
+ */
+export async function loadIssueDescriptions() {
+    if (Object.keys(issueDescriptions).length > 0) {
+        return;
+    }
+    const files = await fs.promises.readdir(DESCRIPTIONS_PATH);
+    const descriptions = {};
+    for (const file of files) {
+        if (!file.endsWith('.md')) {
+            continue;
+        }
+        const content = await fs.promises.readFile(path.join(DESCRIPTIONS_PATH, file), 'utf-8');
+        descriptions[file] = content;
+    }
+    issueDescriptions = descriptions;
+}
+/**
+ * Gets an issue description from the in-memory cache.
+ * @param fileName The file name of the issue description.
+ * @returns The description of the issue, or null if it doesn't exist.
+ */
+export function getIssueDescription(fileName) {
+    return issueDescriptions[fileName] ?? null;
+}
+export const ISSUE_UTILS = {
+    loadIssueDescriptions,
+    getIssueDescription,
+};

package/build/src/main.js

@@ -6,24 +6,17 @@
 import './polyfill.js';
 import { ensureBrowserConnected, ensureBrowserLaunched } from './browser.js';
 import { parseArguments } from './cli.js';
+import { loadIssueDescriptions } from './issue-descriptions.js';
 import { logger, saveLogsToFile } from './logger.js';
 import { McpContext } from './McpContext.js';
 import { McpResponse } from './McpResponse.js';
 import { Mutex } from './Mutex.js';
 import { McpServer, StdioServerTransport, SetLevelRequestSchema, } from './third_party/index.js';
 import { ToolCategory } from './tools/categories.js';
-import * as consoleTools from './tools/console.js';
-import * as emulationTools from './tools/emulation.js';
-import * as inputTools from './tools/input.js';
-import * as networkTools from './tools/network.js';
-import * as pagesTools from './tools/pages.js';
-import * as performanceTools from './tools/performance.js';
-import * as screenshotTools from './tools/screenshot.js';
-import * as scriptTools from './tools/script.js';
-import * as snapshotTools from './tools/snapshot.js';
+import { tools } from './tools/tools.js';
 // If moved update release-please config
 // x-release-please-start-version
-const VERSION = '0.10.1';
+const VERSION = '0.11.0';
 // x-release-please-end
 export const args = parseArguments(VERSION);
 const logFile = args.logFile ? saveLogsToFile(args.logFile) : undefined;
@@ -54,7 +47,8 @@ async function getContext() {
             headless: args.headless,
             executablePath: args.executablePath,
             channel: args.channel,
-            isolated: args.isolated,
+            isolated: args.isolated ?? false,
+            userDataDir: args.userDataDir,
             logFile,
             viewport: args.viewport,
             args: extraArgs,
@@ -103,51 +97,33 @@ function registerTool(tool) {
             await tool.handler({
                 params,
             }, response, context);
-            try {
-                const content = await response.handle(tool.name, context);
-                return {
-                    content,
-                };
-            }
-            catch (error) {
-                const errorText = error instanceof Error ? error.message : String(error);
-                return {
-                    content: [
-                        {
-                            type: 'text',
-                            text: errorText,
-                        },
-                    ],
-                    isError: true,
-                };
-            }
+            const content = await response.handle(tool.name, context);
+            return {
+                content,
+            };
         }
         catch (err) {
-            logger(`${tool.name} error: ${err.message}`);
-            throw err;
+            logger(`${tool.name} error:`, err, err?.stack);
+            const errorText = err && 'message' in err ? err.message : String(err);
+            return {
+                content: [
+                    {
+                        type: 'text',
+                        text: errorText,
+                    },
+                ],
+                isError: true,
+            };
         }
         finally {
             guard.dispose();
         }
     });
 }
-const tools = [
-    ...Object.values(consoleTools),
-    ...Object.values(emulationTools),
-    ...Object.values(inputTools),
-    ...Object.values(networkTools),
-    ...Object.values(pagesTools),
-    ...Object.values(performanceTools),
-    ...Object.values(screenshotTools),
-    ...Object.values(scriptTools),
-    ...Object.values(snapshotTools),
-];
-tools.sort((a, b) => {
-    return a.name.localeCompare(b.name);
-});
 for (const tool of tools) {
     registerTool(tool);
 }
+await loadIssueDescriptions();
 const transport = new StdioServerTransport();
 await server.connect(transport);
 logger('Chrome DevTools MCP Server connected');