From 99dc73fdd226edec781ec90dc2800c01b0c7c00e Mon Sep 17 00:00:00 2001 From: ojonesjr <50652264+ojonesjr@users.noreply.github.com> Date: Thu, 26 Mar 2026 18:28:06 -0400 Subject: [PATCH 1/3] docs: fix skill and reference documentation issues --- README.md | 4 ++-- docs/debugging-android.md | 15 ++++++++++----- docs/tool-reference.md | 12 ++++++------ docs/troubleshooting.md | 2 +- skills/chrome-devtools-cli/SKILL.md | 6 +++--- skills/debug-optimize-lcp/SKILL.md | 2 +- skills/memory-leak-debugging/SKILL.md | 2 +- src/bin/chrome-devtools-mcp-cli-options.ts | 2 +- src/bin/cliDefinitions.ts | 10 +++++----- src/tools/console.ts | 2 +- src/tools/emulation.ts | 2 +- src/tools/input.ts | 2 +- src/tools/memory.ts | 2 +- src/tools/screenshot.ts | 2 +- 14 files changed, 35 insertions(+), 30 deletions(-) diff --git a/README.md b/README.md index 7f6afebdd..a9acf6e33 100644 --- a/README.md +++ b/README.md @@ -28,7 +28,7 @@ Avoid sharing sensitive or personal information that you don't want to share wit MCP clients. `chrome-devtools-mcp` officially supports Google Chrome and [Chrome for Testing](https://developer.chrome.com/blog/chrome-for-testing/) only. -Other Chromium-based browser may work, but this is not guaranteed, and you may encounter unexpected behavior. Use at your own discretion. +Other Chromium-based browsers may work, but this is not guaranteed, and you may encounter unexpected behavior. Use at your own discretion. We are committed to providing fixes and support for the latest version of [Extended Stable Chrome](https://chromiumdash.appspot.com/schedule). Performance tools may send trace URLs to the Google CrUX API to fetch real-user @@ -474,7 +474,7 @@ The Chrome DevTools MCP server supports the following configuration option: - **`--autoConnect`/ `--auto-connect`** - If specified, automatically connects to a browser (Chrome 144+) running locally from the user data directory identified by the channel param (default channel is stable). Requires the remoted debugging server to be started in the Chrome instance via chrome://inspect/#remote-debugging. + If specified, automatically connects to a browser (Chrome 144+) running locally from the user data directory identified by the channel param (default channel is stable). Requires the remote debugging server to be started in the Chrome instance via chrome://inspect/#remote-debugging. - **Type:** boolean - **Default:** `false` diff --git a/docs/debugging-android.md b/docs/debugging-android.md index 979afc0d9..6447339a6 100644 --- a/docs/debugging-android.md +++ b/docs/debugging-android.md @@ -4,25 +4,30 @@ This is an experimental feature as Puppeteer does not officially support Chrome The workflow below works for most users. See [Troubleshooting: DevTools is not detecting the Android device for more help](https://developer.chrome.com/docs/devtools/remote-debugging#troubleshooting) for more help. -1. Open the Developer Options screen on your Android. See [Configure on-device developer Options](https://developer.android.com/studio/debug/dev-options.html). +1. Open the Developer Options screen on your Android. See [Configure on-device developer options](https://developer.android.com/studio/debug/dev-options.html). 2. Select Enable USB Debugging. 3. Connect your Android device directly to your development machine using a USB cable. -4. On your development machine setup port forwarding from your development machine to your android device: +4. On your development machine, set up port forwarding from your development machine to your Android device: ```shell adb forward tcp:9222 localabstract:chrome_devtools_remote ``` -5. Configure your MCP server to connect to the Chrome +5. Find the browser WebSocket endpoint: + ```shell + curl http://127.0.0.1:9222/json/version + ``` + Copy the `webSocketDebuggerUrl` value from the response. +6. Configure your MCP server to connect to Chrome: ```json "chrome-devtools": { "command": "npx", "args": [ "chrome-devtools-mcp@latest", - "--wsEndpoint=ws://127.0.0.1:9222/devtools/browser/" + "--wsEndpoint=ws://127.0.0.1:9222/devtools/browser/" ], "trust": true } ``` -6. Test your setup by running the following prompt in your coding agent: +7. Test your setup by running the following prompt in your coding agent: ```none Check the performance of developers.chrome.com ``` diff --git a/docs/tool-reference.md b/docs/tool-reference.md index 50b4c02c5..471372975 100644 --- a/docs/tool-reference.md +++ b/docs/tool-reference.md @@ -1,6 +1,6 @@ -# Chrome DevTools MCP Tool Reference (~6940 cl100k_base tokens) +# Chrome DevTools MCP Tool Reference (~6942 cl100k_base tokens) - **[Input automation](#input-automation)** (9 tools) - [`click`](#click) @@ -66,7 +66,7 @@ ### `fill` -**Description:** Type text into a input, text area or select an option from a <select> element. +**Description:** Type text into an input, text area or select an option from a <select> element. **Parameters:** @@ -223,7 +223,7 @@ - **colorScheme** (enum: "dark", "light", "auto") _(optional)_: [`Emulate`](#emulate) the dark or the light mode. Set to "auto" to reset to the default. - **cpuThrottlingRate** (number) _(optional)_: Represents the CPU slowdown factor. Omit or set the rate to 1 to disable throttling -- **geolocation** (string) _(optional)_: Geolocation (`<latitude>x<longitude>`) to [`emulate`](#emulate). Latitude between -90 and 90. Longitude between -180 and 180. Omit clear the geolocation override. +- **geolocation** (string) _(optional)_: Geolocation (`<latitude>x<longitude>`) to [`emulate`](#emulate). Latitude between -90 and 90. Longitude between -180 and 180. Omit to clear the geolocation override. - **networkConditions** (enum: "Offline", "Slow 3G", "Fast 3G", "Slow 4G", "Fast 4G") _(optional)_: Throttle network. Omit to disable throttling. - **userAgent** (string) _(optional)_: User agent to [`emulate`](#emulate). Set to empty string to clear the user agent override. - **viewport** (string) _(optional)_: [`Emulate`](#emulate) device viewports '<width>x<height>x<devicePixelRatio>[,mobile][,touch][,landscape]'. 'touch' and 'mobile' to [`emulate`](#emulate) mobile devices. 'landscape' to [`emulate`](#emulate) landscape mode. @@ -278,7 +278,7 @@ ### `take_memory_snapshot` -**Description:** Capture a memory heapsnapshot of the currently selected page to memory leak debugging +**Description:** Capture a memory heapsnapshot of the currently selected page for memory leak debugging **Parameters:** @@ -366,7 +366,7 @@ so returned values have to be JSON-serializable. - **includePreservedMessages** (boolean) _(optional)_: Set to true to return the preserved messages over the last 3 navigations. - **pageIdx** (integer) _(optional)_: Page number to return (0-based). When omitted, returns the first page. -- **pageSize** (integer) _(optional)_: Maximum number of messages to return. When omitted, returns all requests. +- **pageSize** (integer) _(optional)_: Maximum number of messages to return. When omitted, returns all messages. - **types** (array) _(optional)_: Filter messages to only return messages of the specified resource types. When omitted or empty, returns all messages. --- @@ -381,7 +381,7 @@ so returned values have to be JSON-serializable. - **format** (enum: "png", "jpeg", "webp") _(optional)_: Type of format to save the screenshot as. Default is "png" - **fullPage** (boolean) _(optional)_: If set to true takes a screenshot of the full page instead of the currently visible viewport. Incompatible with uid. - **quality** (number) _(optional)_: Compression quality for JPEG and WebP formats (0-100). Higher values mean better quality but larger file sizes. Ignored for PNG format. -- **uid** (string) _(optional)_: The uid of an element on the page from the page content snapshot. If omitted takes a pages screenshot. +- **uid** (string) _(optional)_: The uid of an element on the page from the page content snapshot. If omitted, takes a page screenshot. --- diff --git a/docs/troubleshooting.md b/docs/troubleshooting.md index a6b05ee2b..4b8c22578 100644 --- a/docs/troubleshooting.md +++ b/docs/troubleshooting.md @@ -98,7 +98,7 @@ Possible workarounds include: 3. Start `chrome-devtools-mcp` with: `npx chrome-devtools-mcp --browser-url http://127.0.0.1:9222` -- **Use Powershell or Git Bash** instead of WSL. +- **Use PowerShell or Git Bash** instead of WSL. ### Windows 10: Error during discovery for MCP server 'chrome-devtools': MCP error -32000: Connection closed diff --git a/skills/chrome-devtools-cli/SKILL.md b/skills/chrome-devtools-cli/SKILL.md index b6db1807a..2b251c69b 100644 --- a/skills/chrome-devtools-cli/SKILL.md +++ b/skills/chrome-devtools-cli/SKILL.md @@ -1,6 +1,6 @@ --- name: chrome-devtools-cli -description: Use this to skill to write shell scripts or run shell commands to automate tasks in the browser or otherwise use Chrome DevTools via CLI. +description: Use this skill to write shell scripts or run shell commands to automate tasks in the browser or otherwise use Chrome DevTools via CLI. --- The `chrome-devtools-mcp` CLI lets you interact with the browser from your terminal. @@ -74,7 +74,7 @@ chrome-devtools select_page 1 --bringToFront true # Select a page and bring it t ```bash chrome-devtools emulate --networkConditions "Offline" # Emulate network conditions -chrome-devtools emulate --cpuThrottlingRate 4 --geolocation "0,0" # Emulate CPU throttling and geolocation +chrome-devtools emulate --cpuThrottlingRate 4 --geolocation "0x0" # Emulate CPU throttling and geolocation chrome-devtools emulate --colorScheme "dark" --viewport "1920x1080" # Emulate color scheme and viewport chrome-devtools emulate --userAgent "Mozilla/5.0..." # Emulate user agent chrome-devtools resize_page 1920 1080 # Resizes the selected page's window @@ -107,7 +107,7 @@ chrome-devtools list_network_requests --includePreservedRequests true # Include ```bash chrome-devtools evaluate_script "() => document.title" # Evaluate a JavaScript function on the page -evaluate_script "(a) => a.innerText" --args 1_4 # Evaluate JS with UID arguments +chrome-devtools evaluate_script "(a) => a.innerText" --args 1_4 # Evaluate JS with UID arguments chrome-devtools get_console_message 1 # Gets a console message by its ID chrome-devtools lighthouse_audit --mode "navigation" # Run Lighthouse audit for navigation chrome-devtools lighthouse_audit --mode "snapshot" --device "mobile" # Run Lighthouse audit for a snapshot on mobile diff --git a/skills/debug-optimize-lcp/SKILL.md b/skills/debug-optimize-lcp/SKILL.md index 59071185f..ebd0aea32 100644 --- a/skills/debug-optimize-lcp/SKILL.md +++ b/skills/debug-optimize-lcp/SKILL.md @@ -50,7 +50,7 @@ Use `performance_analyze_insight` to drill into LCP-specific insights. Look for - **RenderBlocking** — Resources blocking the LCP element from rendering. - **LCPDiscovery** — Whether the LCP resource was discoverable early. -Call `performance_analyze_insight` with the insight name and the insight set ID from the trace results. +Call `performance_analyze_insight` with the insight set ID and the insight name from the trace results. ### Step 3: Identify the LCP Element diff --git a/skills/memory-leak-debugging/SKILL.md b/skills/memory-leak-debugging/SKILL.md index faa9957d9..c025e3325 100644 --- a/skills/memory-leak-debugging/SKILL.md +++ b/skills/memory-leak-debugging/SKILL.md @@ -44,7 +44,7 @@ If `memlab` is not available, you MUST use the fallback script in the references Run the script using Node.js: ```bash -node compare_snapshots.js +node skills/memory-leak-debugging/references/compare_snapshots.js ``` The script will analyze and output the top growing objects by size and highlight the 3 most common types of memory leaks (e.g., Detached DOM nodes, closures, Contexts) if they are present. diff --git a/src/bin/chrome-devtools-mcp-cli-options.ts b/src/bin/chrome-devtools-mcp-cli-options.ts index b4792629c..c2658e82c 100644 --- a/src/bin/chrome-devtools-mcp-cli-options.ts +++ b/src/bin/chrome-devtools-mcp-cli-options.ts @@ -11,7 +11,7 @@ export const cliOptions = { autoConnect: { type: 'boolean', description: - 'If specified, automatically connects to a browser (Chrome 144+) running locally from the user data directory identified by the channel param (default channel is stable). Requires the remoted debugging server to be started in the Chrome instance via chrome://inspect/#remote-debugging.', + 'If specified, automatically connects to a browser (Chrome 144+) running locally from the user data directory identified by the channel param (default channel is stable). Requires the remote debugging server to be started in the Chrome instance via chrome://inspect/#remote-debugging.', conflicts: ['isolated', 'executablePath', 'categoryExtensions'], default: false, coerce: (value: boolean | undefined) => { diff --git a/src/bin/cliDefinitions.ts b/src/bin/cliDefinitions.ts index d32705617..4c1921500 100644 --- a/src/bin/cliDefinitions.ts +++ b/src/bin/cliDefinitions.ts @@ -110,7 +110,7 @@ export const commands: Commands = { name: 'geolocation', type: 'string', description: - 'Geolocation (`x`) to emulate. Latitude between -90 and 90. Longitude between -180 and 180. Omit clear the geolocation override.', + 'Geolocation (`x`) to emulate. Latitude between -90 and 90. Longitude between -180 and 180. Omit to clear the geolocation override.', required: false, }, userAgent: { @@ -159,7 +159,7 @@ export const commands: Commands = { }, fill: { description: - 'Type text into a input, text area or select an option from a element.', category: 'Input automation', args: { uid: { @@ -305,7 +305,7 @@ export const commands: Commands = { name: 'pageSize', type: 'integer', description: - 'Maximum number of messages to return. When omitted, returns all requests.', + 'Maximum number of messages to return. When omitted, returns all messages.', required: false, }, pageIdx: { @@ -582,7 +582,7 @@ export const commands: Commands = { }, take_memory_snapshot: { description: - 'Capture a memory heapsnapshot of the currently selected page to memory leak debugging', + 'Capture a memory heapsnapshot of the currently selected page for memory leak debugging', category: 'Performance', args: { filePath: { @@ -618,7 +618,7 @@ export const commands: Commands = { name: 'uid', type: 'string', description: - 'The uid of an element on the page from the page content snapshot. If omitted takes a pages screenshot.', + 'The uid of an element on the page from the page content snapshot. If omitted, takes a page screenshot.', required: false, }, fullPage: { diff --git a/src/tools/console.ts b/src/tools/console.ts index a6a1799a4..dd8059bbf 100644 --- a/src/tools/console.ts +++ b/src/tools/console.ts @@ -52,7 +52,7 @@ export const listConsoleMessages = definePageTool({ .positive() .optional() .describe( - 'Maximum number of messages to return. When omitted, returns all requests.', + 'Maximum number of messages to return. When omitted, returns all messages.', ), pageIdx: zod .number() diff --git a/src/tools/emulation.ts b/src/tools/emulation.ts index 66eaa849d..c9d0ea859 100644 --- a/src/tools/emulation.ts +++ b/src/tools/emulation.ts @@ -44,7 +44,7 @@ export const emulate = definePageTool({ .optional() .transform(geolocationTransform) .describe( - 'Geolocation (`x`) to emulate. Latitude between -90 and 90. Longitude between -180 and 180. Omit clear the geolocation override.', + 'Geolocation (`x`) to emulate. Latitude between -90 and 90. Longitude between -180 and 180. Omit to clear the geolocation override.', ), userAgent: zod .string() diff --git a/src/tools/input.ts b/src/tools/input.ts index 492d55378..9e714e191 100644 --- a/src/tools/input.ts +++ b/src/tools/input.ts @@ -219,7 +219,7 @@ async function fillFormElement( export const fill = definePageTool({ name: 'fill', - description: `Type text into a input, text area or select an option from a element.`, annotations: { category: ToolCategory.INPUT, readOnlyHint: false, diff --git a/src/tools/memory.ts b/src/tools/memory.ts index 406354d28..be32332e4 100644 --- a/src/tools/memory.ts +++ b/src/tools/memory.ts @@ -11,7 +11,7 @@ import {definePageTool} from './ToolDefinition.js'; export const takeMemorySnapshot = definePageTool({ name: 'take_memory_snapshot', - description: `Capture a memory heapsnapshot of the currently selected page to memory leak debugging`, + description: `Capture a memory heapsnapshot of the currently selected page for memory leak debugging`, annotations: { category: ToolCategory.PERFORMANCE, readOnlyHint: true, diff --git a/src/tools/screenshot.ts b/src/tools/screenshot.ts index 764abde4b..2e648531c 100644 --- a/src/tools/screenshot.ts +++ b/src/tools/screenshot.ts @@ -35,7 +35,7 @@ export const screenshot = definePageTool({ .string() .optional() .describe( - 'The uid of an element on the page from the page content snapshot. If omitted takes a pages screenshot.', + 'The uid of an element on the page from the page content snapshot. If omitted, takes a page screenshot.', ), fullPage: zod .boolean() From f5766345665e41da9614dd62ae7836b96d95c3de Mon Sep 17 00:00:00 2001 From: ojonesjr <50652264+ojonesjr@users.noreply.github.com> Date: Tue, 31 Mar 2026 22:46:46 -0400 Subject: [PATCH 2/3] docs: revert Android debugging updates --- docs/debugging-android.md | 15 +++++---------- 1 file changed, 5 insertions(+), 10 deletions(-) diff --git a/docs/debugging-android.md b/docs/debugging-android.md index 6447339a6..979afc0d9 100644 --- a/docs/debugging-android.md +++ b/docs/debugging-android.md @@ -4,30 +4,25 @@ This is an experimental feature as Puppeteer does not officially support Chrome The workflow below works for most users. See [Troubleshooting: DevTools is not detecting the Android device for more help](https://developer.chrome.com/docs/devtools/remote-debugging#troubleshooting) for more help. -1. Open the Developer Options screen on your Android. See [Configure on-device developer options](https://developer.android.com/studio/debug/dev-options.html). +1. Open the Developer Options screen on your Android. See [Configure on-device developer Options](https://developer.android.com/studio/debug/dev-options.html). 2. Select Enable USB Debugging. 3. Connect your Android device directly to your development machine using a USB cable. -4. On your development machine, set up port forwarding from your development machine to your Android device: +4. On your development machine setup port forwarding from your development machine to your android device: ```shell adb forward tcp:9222 localabstract:chrome_devtools_remote ``` -5. Find the browser WebSocket endpoint: - ```shell - curl http://127.0.0.1:9222/json/version - ``` - Copy the `webSocketDebuggerUrl` value from the response. -6. Configure your MCP server to connect to Chrome: +5. Configure your MCP server to connect to the Chrome ```json "chrome-devtools": { "command": "npx", "args": [ "chrome-devtools-mcp@latest", - "--wsEndpoint=ws://127.0.0.1:9222/devtools/browser/" + "--wsEndpoint=ws://127.0.0.1:9222/devtools/browser/" ], "trust": true } ``` -7. Test your setup by running the following prompt in your coding agent: +6. Test your setup by running the following prompt in your coding agent: ```none Check the performance of developers.chrome.com ``` From 8cce2cb115b684dc8fe8438e4c646db72ed789d1 Mon Sep 17 00:00:00 2001 From: ojonesjr <50652264+ojonesjr@users.noreply.github.com> Date: Thu, 2 Apr 2026 10:10:55 -0400 Subject: [PATCH 3/3] docs: regenerate tool reference --- docs/tool-reference.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/tool-reference.md b/docs/tool-reference.md index 385eb6383..b09307da8 100644 --- a/docs/tool-reference.md +++ b/docs/tool-reference.md @@ -1,6 +1,6 @@ -# Chrome DevTools MCP Tool Reference (~6949 cl100k_base tokens) +# Chrome DevTools MCP Tool Reference (~6951 cl100k_base tokens) - **[Input automation](#input-automation)** (9 tools) - [`click`](#click)