← 返回 Skills 市场
podcasting101

Chrome Devtools

作者 podcasting101 · GitHub ↗ · v0.1.1
cross-platform ⚠ suspicious
2270
总下载
2
收藏
20
当前安装
2
版本数
在 OpenClaw 中安装
/install chrome-devtools
功能描述
Uses Chrome DevTools via MCP for efficient debugging, troubleshooting and browser automation. Use when debugging web pages, automating browser interactions,...
使用说明 (SKILL.md)

Core Concepts

Browser lifecycle: Browser starts automatically on first tool call using a persistent Chrome profile. Configure via CLI args in the MCP server configuration: npx chrome-devtools-mcp@latest --help.

Page selection: Tools operate on the currently selected page. Use list_pages to see available pages, then select_page to switch context.

Element interaction: Use take_snapshot to get page structure with element uids. Each element has a unique uid for interaction. If an element isn't found, take a fresh snapshot - the element may have been removed or the page changed.

Workflow Patterns

Before interacting with a page

  1. Navigate: navigate_page or new_page
  2. Wait: wait_for to ensure content is loaded if you know what you look for.
  3. Snapshot: take_snapshot to understand page structure
  4. Interact: Use element uids from snapshot for click, fill, etc.

Efficient data retrieval

  • Use filePath parameter for large outputs (screenshots, snapshots, traces)
  • Use pagination (pageIdx, pageSize) and filtering (types) to minimize data
  • Set includeSnapshot: false on input actions unless you need updated page state

Tool selection

  • Automation/interaction: take_snapshot (text-based, faster, better for automation)
  • Visual inspection: take_screenshot (when user needs to see visual state)
  • Additional details: evaluate_script for data not in accessibility tree

Parallel execution

You can send multiple tool calls in parallel, but maintain correct order: navigate → wait → snapshot → interact.

Troubleshooting

If chrome-devtools-mcp is insufficient, guide users to use Chrome DevTools UI:

If there are errors launching chrome-devtools-mcp or Chrome, refer to https://github.com/ChromeDevTools/chrome-devtools-mcp/blob/main/docs/troubleshooting.md.

安全使用建议
This skill appears to do what it says (control Chrome DevTools), but consider these risks before installing: - Supply-chain: skill.json uses `npx ...@latest` which fetches the latest package each run. Prefer a pinned version or preinstall/verify the package to avoid unexpected code changes. - Sandbox: it launches Chrome with `--no-sandbox` and `--disable-setuid-sandbox`. Running Chrome without sandboxing increases risk — run the skill only in isolated, ephemeral containers or VMs. - Privacy: the SKILL.md mentions a persistent Chrome profile. That profile can contain history, cookies, and credentials. Ensure the MCP configuration uses an isolated/profile dedicated to the agent, or explicitly document the profile path and access controls. - Disk and network egress: the skill suggests writing large outputs to filePath; control where files are written and monitor network egress for the MCP process. - What to ask the maintainer: request a pinned package version, a reproducible install method (not implicit npx@latest), explicit documentation of what profile/path the MCP server uses, and justification for the `--no-sandbox` flags. If you can't get those, run the skill in a tightly sandboxed environment or avoid installing it.
功能分析
Type: OpenClaw Skill Name: chrome-devtools Version: 0.1.1 The skill is classified as suspicious due to two main security concerns found in `skill.json`. First, it uses `npx chrome-devtools-mcp@latest`, which introduces a supply chain risk as the skill's behavior can change without explicit review if the `latest` version of the npm package is compromised. Second, and more critically, it launches Chrome with `--chrome-arg=--no-sandbox` and `--chrome-arg=--disable-setuid-sandbox`. These flags disable critical security sandboxing, making the agent highly vulnerable to browser exploits that could lead to arbitrary code execution on the host system if it interacts with a malicious webpage. This constitutes a severe vulnerability.
能力评估
Purpose & Capability
Name and description align with the actual runtime command (npx chrome-devtools-mcp@latest). The skill is designed to control Chrome DevTools via MCP and the instructions describe the expected tool calls and workflow.
Instruction Scope
SKILL.md stays within the claimed scope (navigation, snapshot, snapshot-based element interaction, screenshots, evaluate_script). However it references using a persistent Chrome profile and writing large outputs to file paths (filePath), which implies access to local profile data and disk storage; those data-access implications are not declared in requires.env or required config paths.
Install Mechanism
There is no static install spec, but skill.json causes runtime execution of `npx chrome-devtools-mcp@latest`. Fetching an unpinned `@latest` package via npx at runtime is a supply-chain risk (package content can change between runs). This dynamic retrieval is higher risk than a pinned release or vendored dependency.
Credentials
The skill declares no environment variables or config paths, but SKILL.md's use of a persistent Chrome profile implicitly requires access to a Chrome profile directory (browsing history, cookies, saved credentials). That implicit access is not documented as required configuration or limited, which is a privacy/credential exposure concern.
Persistence & Privilege
always:false (good) and autonomous invocation is allowed (normal). However, autonomous runs will dynamically download and execute an unpinned npm package and launch Chrome with `--no-sandbox`/`--disable-setuid-sandbox`, which increases the blast radius if the fetched package or page contents are malicious. The lack of explicit sandboxing or pinned artifacts elevates risk.
如何使用
  1. 确保已安装 OpenClaw(本地或 Docker 部署)
  2. 在对话框中输入安装命令:/install chrome-devtools
  3. 安装完成后,直接呼叫该 Skill 的名称或使用 /chrome-devtools 触发
  4. 根据 Skill 的参数说明提供必要输入,即可获得结构化输出
版本历史
v0.1.1
- Added skill.json file to define or enhance skill metadata. - No changes made to functionality or documentation in SKILL.md.
v0.1.0
Initial release of chrome-devtools skill. - Enables web page automation, debugging, and performance analysis using Chrome DevTools via MCP. - Supports lifecycle management, multi-page handling, and unique element interaction using persistent Chrome profiles. - Provides efficient data retrieval methods, parallel tool calls, and both automation (structure/text-based) and visual inspection (screenshots). - Offers troubleshooting steps and links to detailed Chrome DevTools documentation for advanced help.
元数据
Slug chrome-devtools
版本 0.1.1
许可证
累计安装 22
当前安装数 20
历史版本数 2
常见问题

Chrome Devtools 是什么?

Uses Chrome DevTools via MCP for efficient debugging, troubleshooting and browser automation. Use when debugging web pages, automating browser interactions,... 它是一个面向 Claude Code / OpenClaw 的 AI Agent Skill 插件,目前累计下载 2270 次。

如何安装 Chrome Devtools?

在 OpenClaw 或 Claude Code 对话框中运行命令「/install chrome-devtools」即可一键安装,无需额外配置。

Chrome Devtools 是免费的吗?

是的,Chrome Devtools 完全免费(开源免费),可自由下载、安装和使用。

Chrome Devtools 支持哪些平台?

Chrome Devtools 跨平台运行,可在任意部署了 OpenClaw / Claude Code 的环境中使用(cross-platform)。

谁开发了 Chrome Devtools?

由 podcasting101(@podcasting101)开发并维护,当前版本 v0.1.1。

💬 留言讨论