Ai Driven Test Automation With Playwright Cursor MCP Server

🚀 Playwright 测试框架项目

本项目运用 Playwright 开展 Zeigo 网络仪表盘的端到端（E2E）测试，涵盖 UI 测试与 API 测试，为现代 Web 应用的测试提供了可靠保障。

🚀 快速开始

先决条件

1. Node.js：需安装 Node.js v20 或更高版本。
2. 环境设置：创建一个 .env 文件，包含以下配置：

# 基础 URL
API_BASE_URL=https://your-api-url
UI_BASE_URL=https://your-ui-url

安装与配置

1. 安装 Playwright 和依赖项：

npm install
npx playwright install
npm install dotenv

2. 安装 VS Code Playwright 插件：

code --install-extension ms-playwright.playwright

3. 运行测试

测试执行选项

• UI 测试：通过 npm run test:ui 执行 UI 测试。
• API 测试：通过 npm run test:api 执行 API 测试。
• 调试：使用 Playwright 调试工具进行调试。

✨ 主要特性

Playwright 为现代 Web 应用提供了可靠的端到端测试功能，其特点包括：

• 支持多浏览器测试
• 支持跨平台测试
• 支持多种语言（TypeScript、JavaScript、Python、.NET、Java）
• 移动网页测试支持
• 并行测试执行
• 内置调试工具

📚 详细文档

文档资源

• Playwright 官方文档
• 运行测试指南

项目结构

• .vscode/：工作区特定设置。
• ui-tests/specs/：UI 测试规范文件。
• api-tests/specs/：API 测试规范文件。
• pages/：页面对象模型（POM）文件。
• utils/：工具函数或帮助程序。
• .env：环境变量文件。
• .gitignore：版本控制要排除的文件。

💻 使用示例

基础用法

按照上述快速入门步骤，即可使用 Playwright 进行基本的 UI 和 API 测试。

高级用法

创建自定义断言

// custom-assertions.ts
export async function customAssertion(page: Page, expectedText: string) {
  await page.waitForSelector('text=Hello World');
}

使用数据驱动测试

import { defineScenario } from 'playwright-cucumber';

defineScenario('数据驱动测试', ({ Given, When, Then }) => {
  Given('用户输入 {string} 和 {string}', async function (username, password) {
    // 测试步骤
  });
});

并行执行测试

npm run test --parallel=4

🔧 技术细节

两个 MCP 服务器的使用说明

Playwright 的调试命令

playwright codegen https://example.com

关闭正在运行的 Playwright 服务

pkill -f "node playwright"

使用 Playwright 拦截 API 请求

page.setRequestInterception(true);
page.on('request', request => {
  if (request.url().includes('api')) {
    request.respond({
      status: 200,
      body: JSON.stringify({ message: '测试响应' })
    });
  }
});

Playwright 的网络记录功能

playwright dev --trace-dir traces

如何同时运行两个 MCP 服务器

1. 打开两个终端窗口。
2. 在第一个终端中，启动 Context7 MCP 服务器：

npx -y @upstash/context7-mcp@latest

3. 在第二个终端中，启动 Playwright MCP 服务器：

npx playwright-mcp

注意事项

⚠️ 重要提示

• 同一终端：不能同时运行两个 MCP 服务器，因为每个服务器都会占用终端的输入/输出。
• 不同终端：可以分别在两个终端中运行这两个服务器。