Chrome Devtools CLI

Chrome DevTools命令行界面

](https://npmjs.org/package/chrome-devtools-cli)

用于连接到Chrome DevTools并与之交互的命令行界面。此CLI为程序化浏览器控制提供了交互式REPL和无头执行模式。

特性

• 📡 与Chrome DevTools MCP服务器的持续连接
• 💻 用于浏览器控制的交互式REPL
• 🚀 无头模式用于一次性命令执行
• 🛠️ 26个浏览器控制工具（导航、交互、截图、性能等）
• 🔧 命令特定的帮助和文档

需求

• v20.19或更新版本 最新维护LTS 版本
• 铬 在端口9222上启用远程调试的浏览器

安装

npm install -g chrome-devtools-cli

快速开始

启动Chrome浏览器

在启用远程调试端口9222的情况下启动Chrome浏览器。启动前，请确保关闭所有正在运行的Chrome实例。

macOS

/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --remote-debugging-port=9222 --user-data-dir=/tmp/chrome-profile-stable

Linux

/usr/bin/google-chrome --remote-debugging-port=9222 --user-data-dir=/tmp/chrome-profile-stable

视窗

"C:\Program Files\Google\Chrome\Application\chrome.exe" --remote-debugging-port=9222 --user-data-dir="%TEMP%\chrome-profile-stable"

交互模式

启动CLI并通过REPL与Chrome交互：

npx chrome-devtools-cli

一旦开始，您将看到 chrome> 提示：

Chrome DevTools CLI

Usage:

commands         list all the available commands
 -h     quick help on 
   run  with argument
clear            clear the screen
exit, quit, q    exit the CLI

chrome> commands
# Lists all 26 available commands

chrome> navigate_page {"url":"https://example.com","type":"url"}
# Navigates to the specified URL

chrome> take_screenshot {"fullPage":true,"filePath":"./screenshot.png"}
# Takes a full-page screenshot

chrome> exit

无头模式

在不启动交互式REPL的情况下执行单个命令：

# General format
npx chrome-devtools-cli  ''

# Examples
npx chrome-devtools-cli navigate_page '{"url":"https://google.com","type":"url"}'
npx chrome-devtools-cli take_screenshot '{"fullPage":true,"filePath":"./test.png"}'
npx chrome-devtools-cli list_pages

# With headless browser flag
npx chrome-devtools-cli navigate_page '{"url":"https://example.com","type":"url"}' --headless

命令行选项

# Show version
npx chrome-devtools-cli --version
npx chrome-devtools-cli -v

# List all commands
npx chrome-devtools-cli --commands

# Get help for specific command
npx chrome-devtools-cli navigate_page -h

# General help
npx chrome-devtools-cli --help
npx chrome-devtools-cli -h

可用工具

CLI公开 26个浏览器控制工具 从Chrome DevTools MCP服务器：

导航和页面

• navigate_page -导航到URL、后退/前进或重新加载
• list_pages -获取浏览器中打开的页面列表
• new_page -创建新页面
• close_page -按索引关闭页面
• select_page -选择一个页面作为未来命令的上下文
• resize_page -将页面窗口调整为指定尺寸

用户交互

• click -点击一个元素（支持双击）
• hover -将鼠标悬停在元素上
• type -在输入/文本区域键入文本或选择选项
• fill -填写单个表单元素
• fill_form -一次填写多个表单元素
• drag -将一个元素拖到另一个元素上
• press_key -按一个键或组合键

内容和截图

• take_screenshot -截图（PNG/JPEG/WebP）
• take_snapshot -基于可访问性树拍摄文本快照
• get_page_content -提取页面内容
• get_page_info -获取当前页面信息

JavaScript执行

• evaluate_script -在浏览器上下文中执行JavaScript

控制台和网络

• list_console_messages -列出当前页面的控制台消息
• get_console_message -按ID获取特定控制台消息
• list_network_requests -列出当前页面的网络请求
• get_network_request -通过ID获取特定的网络请求

演出

• performance_start_trace -开始性能跟踪记录
• performance_stop_trace -停止性能跟踪记录
• performance_analyze_insight -获取详细的性能见解

高级功能

• handle_dialog -处理浏览器对话框（接受/关闭）
• upload_file -通过文件输入元素上传文件
• wait_for -等待指定文本出现在页面上
• emulate -模拟网络条件和CPU限制

许可证

阿帕奇-2.0