1. 为什么 Cursor Playwright MCP 能解决元素定位的老大难UI 自动化最让人头疼的从来不是写断言而是元素定位。页面结构一改昨天还能跑的脚本今天就报TimeoutError一个按钮没有 id、没有 name只能靠一长串 XPath 硬撑维护成本高得离谱。传统做法是打开 DevTools 一层层扒 DOM找到相对稳定的属性再手写 locator一个页面十几个元素半天就没了。Cursor 是一个类 VSCode 的智能编程 IDE内置了大语言模型支持自然语言编程和代码重构。Playwright MCP 则是基于 Model Context Protocol 的浏览器自动化服务器它把 Playwright 的浏览器控制能力通过结构化命令暴露给 LLM核心依赖浏览器的可访问性树Accessibility Tree而不是视觉模型。两者结合后你可以在 Cursor 的对话里用自然语言描述点击登录按钮MCP 会实时读取页面结构返回语义化的定位建议甚至直接帮你把 locator 写进代码文件。这套组合适合谁测试工程师想把手工用例快速转成自动化脚本、前端想在重构后快速回归关键路径、或者任何被 XPath 折磨过的开发者。目标很明确让 AI 帮你完成从看到页面到定位元素再到生成可执行用例的最小闭环。下面我把 config.toml 骨架、Cursor 的 MCP 配置片段、以及一次完整的元素定位验证动作拆开讲照着做就能跑通。2. 前置准备TaoToken 接入与 Playwright MCP 环境在配置 MCP 之前先解决模型调用的问题。Cursor 本身可以接自己的模型但如果你想让 MCP 的调用链路更稳定、成本更可控建议通过 TaoToken 来统一管理 API Key。TaoToken 提供兼容 OpenAI 风格的接口配置简单适合在 Cursor 里作为自定义模型端点使用。你需要先拿到一个 API Key。访问 https://taotoken.net/api-keys 创建密钥然后在 Cursor 的模型设置里填入。TaoToken 的 API 地址是 https://taotoken.net/api注意这个地址不带任何查询参数直接作为 base_url 使用即可。如果你对模型对话能力还不熟悉可以先到 https://taotoken.net/models 体验一下确认模型能正常响应后再接入 Cursor。环境侧需要准备两样东西Node.js建议 18 以上和 Playwright 的浏览器依赖。Playwright MCP 本质上是一个 Node 服务通过 stdio 和 Cursor 通信。安装命令如下npm install -g playwright/mcp npx playwright install chromium第一条命令全局安装 MCP 服务第二条确保 Chromium 内核就位。如果你之前装过 Playwright这一步可以跳过。装完后用npx playwright/mcp --version验证一下能输出版本号就说明环境没问题。注意Playwright MCP 默认使用 Chromium如果你需要测试其他内核可以在启动参数里指定--browser firefox或--browser webkit但对应的浏览器依赖也要提前装好。3. 可复制的 config.toml 骨架与 Cursor MCP 配置Cursor 的 MCP 配置有两种方式一种是在项目根目录建.cursor/mcp.json另一种是全局配置。这里我推荐项目级配置方便团队共享。但既然标题提到 config.toml我先给一份通用的 TOML 骨架你可以把它放在项目config/目录下作为 MCP 启动参数的集中管理文件。# config/mcp_config.toml [mcp] name playwright command npx args [playwright/mcplatest, --headless, --isolated] [mcp.env] PLAYWRIGHT_HEADLESS true PLAYWRIGHT_TIMEOUT 30000 [browser] viewport_width 1440 viewport_height 900 user_agent Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 [locator] priority [role, label, placeholder, text, alt, title, xpath, css]这份 TOML 不是 Cursor 直接读取的而是给你自己看的参数源。真正生效的是 Cursor 的 MCP 配置文件。在项目根目录创建.cursor/mcp.json内容如下{ mcpServers: { playwright: { command: npx, args: [playwright/mcplatest, --headless, --isolated], env: { PLAYWRIGHT_HEADLESS: true, PLAYWRIGHT_TIMEOUT: 30000 } } } }保存后重启 Cursor在设置里的 MCP 面板应该能看到playwright服务处于 running 状态。如果显示 failed先检查npx是否在 PATH 里再确认 Node 版本。--isolated参数的作用是每次启动用全新的浏览器上下文避免缓存干扰定位结果调试阶段建议保留。接下来把 TaoToken 的模型接入 Cursor。在 Cursor 设置里找到 Models添加自定义模型Base URL 填https://taotoken.net/apiAPI Key 填你刚才创建的密钥模型名按 TaoToken 文档里支持的填写。配置完成后在对话里发一句你好确认模型能正常回复。4. 验证请求从元素定位到用例执行的最小链路环境配好后我们来跑一次完整的验证。假设你要测试一个登录页面目标是定位用户名输入框、密码输入框和登录按钮然后生成一个可执行的 Playwright 脚本。第一步在 Cursor 对话里输入请用 Playwright MCP 打开 https://example.com/login分析页面可访问性树 找出用户名输入框、密码输入框、登录按钮的语义化定位方式 按 role label placeholder text 的优先级给出 locator。MCP 会启动浏览器、访问页面、读取可访问性树然后返回类似这样的结果用户名输入框page.get_by_label(用户名) 密码输入框page.get_by_label(密码) 登录按钮page.get_by_role(button, name登录)第二步让 AI 把定位写进你的项目结构。假设你的项目有locators/login_locators.py直接说把上面三个定位写入 locators/login_locators.py 用类属性封装命名遵循 login_username_input、login_password_input、login_submit_btn。AI 会生成类似这样的代码# locators/login_locators.py class LoginLocators: login_username_input (label, 用户名) login_password_input (label, 密码) login_submit_btn (role, button, 登录)第三步生成页面操作层和测试用例。继续在对话里说在 pages/login_page.py 里封装 login 方法 接收 username 和 password调用上面的 locator 完成登录。 然后在 testcases/test_login.py 里写一个测试用例 用已知账号 admin/123456 登录断言登录后 URL 包含 /dashboard。AI 会补全login_page.py和test_login.py。最后你直接运行pytest testcases/test_login.py -v如果一切正常你会看到测试通过浏览器自动完成登录并跳转。整个过程你只输入了自然语言没有手写一行 locator。这就是 Cursor Playwright MCP 的最小闭环描述需求 → MCP 读取页面 → AI 生成代码 → 执行验证。提示第一次跑的时候建议加--headed参数肉眼确认浏览器操作是否符合预期。稳定后再切回 headless 模式。5. 本篇常见错排查MCP 服务启动失败Cursor 里显示红色。最常见的原因是npx路径问题。在终端里执行which npx把绝对路径填到mcp.json的command字段里。Windows 下可能是npx.cmd注意后缀。定位返回空结果或超时。检查页面是否需要登录才能访问。Playwright MCP 启动的是全新上下文没有你的登录态。解决办法是在对话里先让 MCP 执行登录动作再分析目标页面。或者用--storage-state参数加载已保存的登录状态。AI 生成的 locator 用了 XPath 而不是语义化定位。这通常是因为页面可访问性树不完整比如按钮没有role或name。这时候需要在对话里明确要求如果语义化定位不可用请说明原因并给出备选方案。 同时检查你的.cursor/rules里有没有写定位优先级规则没有的话 AI 会自由发挥。TaoToken 接口返回 401 或 404。确认 Base URL 是https://taotoken.net/api不要多加/v1或斜杠。API Key 是否复制完整有没有多余空格。如果还是不通到 https://taotoken.net/doc 对照文档检查请求格式。测试执行时元素找到了但点击无效。可能是元素被遮挡或还没渲染完。在 locator 后面加.wait_for(statevisible)或者用page.wait_for_load_state(networkidle)等页面稳定。Playwright MCP 返回的定位是静态分析结果实际执行时仍需考虑动态加载。6. 把 MCP 用进日常编码流跑通最小链路后你可以把这套流程固化到项目里。我的做法是在.cursor/rules下放三个 mdc 文件一个管代码风格一个管任务拆解一个专门管 UI 自动化定位优先级。这样每次让 AI 写代码它都会先复述需求、列出待办、按 role label placeholder 的顺序选定位方式不会乱改核心模块。如果你需要长期做编码和 Agent 任务可以考虑 TaoToken 的 Coding Plan地址是 https://taotoken.net/coding-plan适合高频调用场景。日常调试模型能力的话直接到 https://taotoken.net/models 对话验证就行。接入文档在 https://taotoken.net/docAPI Key 管理在 https://taotoken.net/api-keys按需取用。下一步可以尝试把手工测试用例写成 Excel让 AI 读取表格批量生成 testcases 下的脚本真正实现零代码写 UI 自动化。这个方向我还在试等跑顺了再单独写一篇。