🚀 🎭 Playwright 测试自动化框架

这是一个强大且数据驱动的测试自动化框架，使用 Playwright 和 TypeScript 构建。结合 @executeautomation/playwright-mcp-server，它实现了增强的测试录制和播放功能。采用页面对象模型（Page Object Model）设计模式，让自动化测试具备可扩展性且易于维护。

L(7,14)M(0,7)L(14,7)'/%3E%3C/g%3E%3C/svg%3E)

🚀 快速开始

安装依赖

npm install playwright @executeautomation/playwright-mcp-server typescript --save-dev

创建配置文件

创建 Playwright 配置文件（playwright.config.ts）。

启动测试

npx playwright test

✨ 主要特性

• 强大且灵活：利用 Playwright 的多浏览器支持和强大的自动化能力。
• 数据驱动：通过测试数据实现高效的用例执行。
• 易于维护：采用页面对象模型（Page Object Model）设计模式，提高代码复用性和可维护性。
• 扩展性强：方便添加新的测试场景和功能。

📦 安装指南

依赖安装

npm install playwright @executeautomation/playwright-mcp-server typescript --save-dev

配置文件创建

创建 playwright.config.ts 文件用于配置 Playwright。

💻 使用示例

执行所有测试

npx playwright test

执行特定测试文件

npx playwright test tests/specs/registration.spec.ts

以有头模式运行（显示浏览器窗口）

npx playwright test --headed

添加新测试场景

在 tests/data/testData.ts 中添加新的测试数据：

{
  name: 'Your Scenario Name',
  login: {
    email: 'your.email@test.com'
  },
  registration: {
    firstName: 'First',
    lastName: 'Last',
    address: 'Address',
    email: 'email@test.com',
    phone: '1234567890',
    gender: 'Male' | 'Female',
    country: 'Country Name'
  }
}

新增的测试场景将自动执行。

📚 详细文档

框架结构

playwright-test-frame/
├── playwright.config.ts
├── tests/
│   ├── specs/
│   │   └── registration.spec.ts
│   └── data/
│       └── testData.ts
└── package.json

功能模块

页面对象

• BasePage：包含通用方法和工具。
• LoginPage：处理登录功能。
• RegistrationPage：管理注册表单交互。

数据管理

• TestData.ts：存储测试场景数据。
• TestDataHelper：提供数据访问和管理的方法。
• 接口定义：使用 TypeScript 接口定义数据结构，确保代码一致性。

测试数据结构

interface LoginData {
  email: string;
  password?: string;
}

interface RegistrationData {
  firstName: string;
  lastName: string;
  address: string;
  email: string;
  phone: string;
  gender: 'Male' | 'Female';
  country: string;
}

interface TestData {
  name: string;
  login: LoginData;
  registration: RegistrationData;
}

🔧 技术细节

最佳实践

• 保持页面对象专注于特定功能。
• 将测试数据独立于测试逻辑存储。
• 使用有意义的场景名称。
• 遵循 TypeScript 命名规范。
• 确保每个测试用例独立且原子化。

贡献指南

1. 为新特性创建新的分支。
2. 更新或添加测试和页面对象。
3. 提交代码并发起拉取请求。

依赖说明

• Playwright：测试框架。
• Execute Automation MCP Server：提供额外的扩展功能（可选）。
• TypeScript：用于定义接口和类型，确保代码规范性。

通过以上配置和实践，您可以轻松构建一个高效、灵活且易于维护的测试自动化框架。