国庆那几天，刷抖音，偶然刷到了一个看起来挺🐂🍺的AI工具。

视频里，一个哥们只是发布了一个任务，Agent就自动打开了小红书网站，登录账号，上传图片，写入标题和笔记内容，最后自己点击发布。

整个过程，没有任何人工干预，一气呵成。

这个工具叫：Chrome DevTools MCP。

是谷歌官方在9月23号发布的

https://developer.chrome.com/blog/chrome-devtools-mcp?hl=zh-cn

一个月不到，就已经在Github狂揽了10.5K Star。

https://github.com/ChromeDevTools/chrome-devtools-mcp

Chrome浏览器，就是Google自己开发的。

那他们自家出品的Chrome自动化MCP工具，想必应该是最懂Chrome，最适配Chrome的那个。

这让我产生了强烈的好奇。

PS：这篇文章包含Chrome DevTools MCP介绍、官方经典用法、接入「claude code+glm-4.6」后的实测效果展示，和一些踩坑经验分享。

在这之前，我用过不少浏览器自动化的MCP，比如Playwright MCP、Browser MCP、Puppeteer MCP等等。

它们确实能在一定程度上解放双手，但总感觉差点意思。

谷歌这次发布的Chrome DevTools MCP，内置26个工具（是同类型中工具最多的），涵盖了浏览器自动化的方方面面。

有7种输入自动化工具，7种导航自动化工具，3种模拟工具，3种性能工具，2种网络工具，4种调试工具。

我们可以拿它来做什么呢？官方给了一些经典用法

实时测试bug修复

用Agent修复bug后，使用Chrome DevTools MCP自动验证解决方案是否按预期运行。

Prompt示例：

Verify in the browser that your change works as expected.

分析网络和控制台错误

让Agent能够分析网络请求以发现CORS（跨域）问题，或检查控制台日志以了解某项功能未按预期运行的原因。

比如直接读取浏览器的控制台信息，分析所有的网络请求，对页面进行截图，甚至录制完整的性能轨迹，并给出专业的分析洞察。

这个对于小白来说非常重要，很多朋友老是说AI写的功能需要反反复复修改，甚至都不成功。很多时候都是没有给出关键且正确的报错信息。

这个用法可以帮助小白朋友无感的找到很多关键报错。

Prompt示例（根据实际情况调整）：

A few images on localhost:8080 are not loading. What's happening?

模拟用户行为

导航、填写表单和点击按钮，重现bug并测试复杂的用户流程，同时检查运行时环境。

可以像人一样，在网页上进行点击，拖拽，填充表单，悬停，打开新页面，关闭旧页面，后退，前进，在多个标签页之间自由切换，甚至上传文件等等。

这个是自动干活的关键～

Prompt示例：

Why does submitting the form fail after entering an email address?

调试实时样式和布局问题

让Agent连接到实时网页，检查DOM和CSS，并根据浏览器中的实时数据获取具体建议，以解决复杂的布局问题，例如元素溢出。

Prompt示例：

The page on localhost:8080 looks strange and off. Check what's happening there.

自动执行性能审核

告诉Agent性能问题，分析结果，并调查特定的性能问题，例如 LCP 数值过高。

Prompt示例：

Localhost:8080 is loading slowly. Make it load faster.

这意味着，Coding Agent不仅仅能写代码，现在还增加了一个角色：测试。

它现在开发完成后，可以自己打开浏览器，看到代码运行的真实效果，分析网络请求，检查控制台报错，像一个资深的测试人员一样，去调试和诊断网页。

另外，可以更丝滑的操纵浏览器帮我们干活儿～

我越看越兴奋，于是，我立马就把它接入了我目前最高性价比的本地Agent组合：Claude Code + GLM-4.6。

不清楚Claude Code怎么接入GLM-4.6的朋友，可以去看我上一篇文章。

超高性价比本地Agent组合

袋鼠帝，公众号：袋鼠帝AI客栈这款国产编程模型在海外杀疯了！接入Claude Code是真香～

好了，话不多说，我们正式进入实操。

Agent自动测试也是相当耗token的，有时候甚至比写代码耗的还多，跑完之后，我很庆幸搞了智谱的Coding套餐，不然钱包估计着不住。

接入Claude Code

接入过程也非常简单，有两种方式

第一种方式三步搞定：

第一步，确保你的电脑里装了Claude Code，Chrome浏览器也是最新版。

第二步，然后在终端执行下面这行命令。

claude mcp add chrome-devtools npx chrome-devtools-mcp@latest

这行命令的意思是，在Claude Code里，添加一个名叫chrome-devtools的MCP服务，这个服务通过npx命令来启动最新版的chrome-devtools-mcp包。

第三步，验证安装。

添加成功后，启动Claude Code

我习惯用YOLO模式（跳过所有权限确认）启动

claude --dangerously-skip-permissions

输入/mcp命令，如果能在列表里看到绿色的chrome-devtools，那就说明成功啦

第二种方式：也可以在claude code的.claude.json文件中添加

如果你是Windows系统

路径一般是C:\Users\你的用户名.claude.json。

如果你是Mac系统，路径一般是~/.claude.json。

{
"mcpServers": {
"chrome-devtools": {
"command": "npx",
"args": [
"chrome-devtools-mcp@latest"
]
}
}
}

添加完毕保存，重启claude code即可。

如果使用Trae的话，配置起来就就更简单了

实测效果

/> 自动化测试电商下单流程

我把我之前用Kimi「OK Computer」做的一个虚拟商城项目丢给了它。

PS：在项目根目录，启动Cluade Code即可

让它帮我测试网站功能

Prompt：请你用浏览器打开页面进行一次全面的前后端联动测试

这个任务，完美地展现了Chrome DevTools MCP的闭环能力。

它接到任务后，先制定计划，然后一步一步执行：

它会先新开一个浏览器，然后打开项目网站，进行注册、登录、加购、下单流程，整个过程还是挺丝滑的。

一开始由于用户没有余额，所以我让它操作数据库，给自己充值了1000¥余额，然后顺利支付下单成功～

因为「OK Computer」生成的项目质量比较好，整个流程都是跑通的，，，没有发现bug。

整体来说，还是挺省心，但是那种alter的弹框它不会处理（比如弹框提示用户已存在等），需要我手动点击确定。

还有就是测试过程较慢（大约花了17分钟），感觉是写项目代码时间的两倍。

接下来我想获取需要登录的那种网页的数据。

比如获取X博主的推文，获取公众号后台数据，自动发布小红书等等。

说实话，这块踩坑了，花了不少时间：

一开始无论我怎么搞，它都会新开一个浏览器，每次都要重新登录，而且好多平台（比如X，知乎等）是登录不上的，估计检测到了自动化工具。

后面通过AI搜索，找到了解决方案：

就不能让它（Agent）自己新开一个浏览器，而是要指定浏览器打开，否则每次需要你重新登录，好多平台会有安全检测，会登录不了。

首先，需要在之前的mcp配置里面增加一项参数

“–browserUrl”,“http://127.0.0.1:9222”

{
"mcpServers": {
"chrome-devtools": {
"command": "npx",
"args": [
"chrome-devtools-mcp@latest",
"--browserUrl",
"http://127.0.0.1:9222"
]
}
}
}

这个参数是：告诉MCP不要自己启动浏览器，而是连接到我们手动启动的那个Chrome实例

而手动启动的浏览器（不是双击chrome打开的那个浏览器），需要通过一行指令来启动

PS：在执行这行指令之前，得把所有chrome浏览器退出

手动启动的浏览器 Mac版：

open -a "Google Chrome" --args --remote-debugging-port=9222 --user-data-dir="随便一个空目录"

手动启动的浏览器 Windows版：

start chrome --remote-debugging-port=9222 --user-data-dir="随便一个空目录"

或者

"C:\Program Files\Google\Chrome\Application\chrome.exe" --remote-debugging-port=9222 --user-data-dir="随便一个空目录"

执行之后就会打开一个新的chrome浏览器

我们可以在这个新的浏览器登录X，登录公众号后台，登录小红书等等。

后续mcp就会直接打开这个浏览器进行操作，而不会新开一个没有任何登录态的浏览器。

/> 获取X博主的推文

找了常看的一些X博主，来测试获取网页数据的能力。

Prompt：Sam Altman（Id：sama）,向阳乔木（Id：vista8）,歸藏(guizang.ai)（Id：op7418）,Elon Musk（Id：elonmusk）

打开浏览器，进入X，接下来的所有操作都通过chrome devtools mcp工具来完成：帮我获取以上X博主最新的3条推文信息（博主名称、推文内容、推文链接、发布时间、回复数、转发数、点赞数、浏览数、推文类型、数据获取时间）注意需要滚动加载推文，以免遗漏，推文内容如果是英文，在推文内容中加入译文（也就是双语）。最后保存到Excel中。

还是先规划了任务，然后开始执行

跑了大概5分钟，这个任务跑的还不错，该获取的数据，都获取到了，每个博主也都是3条推文。

就是在时间的准确度上，有时候不太准，可能会抓到一些较旧的数据。

/> 获取公众号后台数据

接下来想试试它能不能分页获取我的公众号后台的文章数据

公众号后台链接：xxxxx

浏览器打开上面这个链接（是我的公众号后台，发表记录页），接下来的所有操作都通过chrome devtools mcp工具来完成：获取第1、2、3页的每篇文章的详细数据，并保存到Excel表格中。

整个执行过程大约5分钟，也还不错，准确的把30篇文章的阅读量，点赞、在看、转发，打赏收益，发布时间，等等数据都准确获取到了。

最后

一顿操作下来，我感觉Chrome DevTools MCP还是不错的。

非常善于做一些模拟用户的浏览器自动化操作

但是如果想要准确获取大批量的数据，还是比较困难，而且速度较慢。

可以做一些少量数据的抓取和分析，但最好不要把它当爬虫工具来用，。

另外我觉得，这套Claude Code+GLM-4.6+Chrome DevTools MCP，对于下面几类人群来说，非常有必要试试。

第一，开发者。无论是性能优化，还是UI bug调试，它都能帮你把大量重复性的，繁琐的测试工作自动化，让你能更专注于核心的逻辑实现。

第二，QA测试工程师。你可以用自然语言，编写各种复杂的端到端测试用例，让AI帮你自动执行和验证，极大地提升测试效率。

第三，独立开发者和创业者。它能让你一个人，就拥有一整个开发+测试团队的战斗力，快速地把想法变成高质量的产品。

Google这次，算是把Coding Agent，从一个全栈开发工程师，扩展成了一个小开发团队了。

这下本地Agent不仅能帮我们写代码，还能自动测试，找bug，做优化了～

能看到这里的都是凤毛麟角的存在！

想入门 AI 大模型却找不到清晰方向？备考大厂 AI 岗还在四处搜集零散资料？别再浪费时间啦！2025 年 AI 大模型全套学习资料已整理完毕，从学习路线到面试真题，从工具教程到行业报告，一站式覆盖你的所有需求，现在全部免费分享！

👇👇扫码免费领取全部内容👇👇

​

一、学习必备：100+本大模型电子书+26 份行业报告 + 600+ 套技术PPT，帮你看透 AI 趋势

想了解大模型的行业动态、商业落地案例？大模型电子书？这份资料帮你站在 “行业高度” 学 AI：

1. 100+本大模型方向电子书

2. 26 份行业研究报告：覆盖多领域实践与趋势

报告包含阿里、DeepSeek 等权威机构发布的核心内容，涵盖：

• 职业趋势：《AI + 职业趋势报告》《中国 AI 人才粮仓模型解析》；
• 商业落地：《生成式 AI 商业落地白皮书》《AI Agent 应用落地技术白皮书》；
• 领域细分：《AGI 在金融领域的应用报告》《AI GC 实践案例集》；
• 行业监测：《2024 年中国大模型季度监测报告》《2025 年中国技术市场发展趋势》。

3. 600+套技术大会 PPT：听行业大咖讲实战

PPT 整理自 2024-2025 年热门技术大会，包含百度、腾讯、字节等企业的一线实践：

• 安全方向：《端侧大模型的安全建设》《大模型驱动安全升级（腾讯代码安全实践）》；
• 产品与创新：《大模型产品如何创新与创收》《AI 时代的新范式：构建 AI 产品》；
• 多模态与 Agent：《Step-Video 开源模型（视频生成进展）》《Agentic RAG 的现在与未来》；
• 工程落地：《从原型到生产：AgentOps 加速字节 AI 应用落地》《智能代码助手 CodeFuse 的架构设计》。

二、求职必看：大厂 AI 岗面试 “弹药库”，300 + 真题 + 107 道面经直接抱走

想冲字节、腾讯、阿里、蔚来等大厂 AI 岗？这份面试资料帮你提前 “押题”，拒绝临场慌！

1. 107 道大厂面经：覆盖 Prompt、RAG、大模型应用工程师等热门岗位

面经整理自 2021-2025 年真实面试场景，包含 TPlink、字节、腾讯、蔚来、虾皮、中兴、科大讯飞、京东等企业的高频考题，每道题都附带思路解析：

2. 102 道 AI 大模型真题：直击大模型核心考点

针对大模型专属考题，从概念到实践全面覆盖，帮你理清底层逻辑：

3. 97 道 LLMs 真题：聚焦大型语言模型高频问题

专门拆解 LLMs 的核心痛点与解决方案，比如让很多人头疼的 “复读机问题”：

三、路线必明： AI 大模型学习路线图，1 张图理清核心内容

刚接触 AI 大模型，不知道该从哪学起？这份「AI大模型 学习路线图」直接帮你划重点，不用再盲目摸索！

路线图涵盖 5 大核心板块，从基础到进阶层层递进：一步步带你从入门到进阶，从理论到实战。

L1阶段:启航篇丨极速破界AI新时代

L1阶段：了解大模型的基础知识，以及大模型在各个行业的应用和分析，学习理解大模型的核心原理、关键技术以及大模型应用场景。

L2阶段：攻坚篇丨RAG开发实战工坊

L2阶段：AI大模型RAG应用开发工程，主要学习RAG检索增强生成：包括Naive RAG、Advanced-RAG以及RAG性能评估，还有GraphRAG在内的多个RAG热门项目的分析。

L3阶段：跃迁篇丨Agent智能体架构设计

L3阶段：大模型Agent应用架构进阶实现，主要学习LangChain、 LIamaIndex框架，也会学习到AutoGPT、 MetaGPT等多Agent系统，打造Agent智能体。

L4阶段：精进篇丨模型微调与私有化部署

L4阶段：大模型的微调和私有化部署，更加深入的探讨Transformer架构，学习大模型的微调技术，利用DeepSpeed、Lamam Factory等工具快速进行模型微调，并通过Ollama、vLLM等推理部署框架，实现模型的快速部署。

L5阶段：专题集丨特训篇 【录播课】

四、资料领取：全套内容免费抱走，学 AI 不用再找第二份

不管你是 0 基础想入门 AI 大模型，还是有基础想冲刺大厂、了解行业趋势，这份资料都能满足你！
现在只需按照提示操作，就能免费领取：

👇👇扫码免费领取全部内容👇👇

​

2025 年想抓住 AI 大模型的风口？别犹豫，这份免费资料就是你的 “起跑线”！