前言
前些日子将团队内的 UI 自动化完成了重构，由之前使用的 Selenium 迁移到了新生的工具 Playwright。在 AI 大模型的加持下，脚本质量稳定和编写效率上得到了明显提升。本文从 Playwright 与 Selenium 对比出发，尽量用简单语言来描述，更多的是思路与设计的分享。
一、Playwright 与 Selenium 对比
关于对比，核心差异在于底层原理。Selenium 使用'代理'WebDriver 协议来统一接口对接不同厂家的浏览器，而 Playwright 直接和各个浏览器原生底层调试协议来通信，比如 CDP (Chrome Devtools Protocol)。
从原理上对比不难看出，Selenium 其实是在众多浏览器中采用'套一层'去解决自动化问题的，那么浏览器很多原生的底层数据 Selenium 根本无法实现，比如网络请求参数、控制台信息等等。而且执行速度上也天然的没有 Playwright 快。在 AI 时代，个人感觉因为 Selenium 底层原理，导致目前相关的 AI 应用难有明显的成果。反观 Playwright，结合 AI 的应用有很多亮点之处，所以近期在团队内部已经将驱动 UI 的底层重构，切换为 Playwright。
二、AI + Playwright MCP
那么如何让 AI 与 Web 自动化有效的结合，并带来效率、准确度上的提升呢？其实利用 MCP (Model Context Protocol) 是目前的解决方式之一。让 AI 模型分析页面的 DOM 元素，利用 MCP 来驱动浏览器，告诉 AI 模型记住页面交互的细节，它会抓取页面的情况并帮助你分析页面的元素结构和交互的过程。
有了这些源数据以后，它会很好帮助你编写 UI 自动化测试。如果你之前有很好的代码结构，它会让你在编写脚本的过程中减轻很多的工作量。
至于哪个模型能力最强等等话题，在现在各种 LLM 百花齐放的情况下，对于第一批梯队的大模型，我觉得对于普通人来说差异不大。当然还是有差距的，建议喜欢哪个，用哪个顺手就用哪个好了。
AI 模型也会犯错，而且会犯很多错，还有可能在跑偏的路上一直带歪你，所以如果利用好 AI 也是门学问。目前 AI 发展的情况，个人建议记住一个原则一定是 AI 辅助，半自动档位配合你工作，不要偷懒不去 Review AI 生成的代码，有错误必须反馈；积累好有效的 Prompt；在 AI 生成的代码毫无逻辑下，立即停止，手动 Coding 教会它如何去写；在 AI 生成代码很复杂的情况下，手动拆分模式加入合理设计模型，这样会更高效的协助你 Coding。
Demo 演示
如何安装 Playwright MCP 请参考 Node 环境的 MCP Server 安装指南。其实我也调研过目前市面上一些比较火的 AI 测试工具如 TestCraft、Testim.ai、Applitools 等等，封闭式的测试用例管理和编写方面，封装和封闭性太强了，而且收费，我觉得很难适合大多数业务的需求。下面使用一个 Demo 来演示一下如何使用 Playwright MCP。
OK 让我们试运行一下生成的脚本看看
完美运行！！！在实际业务中还是要修改的，Demo 演示的是 AI 分析页面并输出脚本的能力，大家可以举一反三。
三、Playwright 封装设计建议
分层设计思想的指导下，考虑到可维护性和可扩展性等，主要的封装思路如下，供参考：
- Playwright 提供了原生操作浏览器的能力，比如点击 click、输入 input 等等。那么基于底层封装一个你们业务的 Playwright 即 XxxPlayWright。
