🎭 Playwright Test Automation Framework

🎭 Playwright 测试自动化框架

🚀 这是一个功能强大的数据驱动测试自动化框架，使用 Playwright 和 TypeScript 构建，并借助 @executeautomation/playwright-mcp-server 增强测试录制和回放能力。采用页面对象模型设计模式，支持构建可扩展、易维护的自动化测试。

✨ 亮点

• 🏗️ 页面对象模型 - 构建简洁、易维护的测试架构
• 📊 数据驱动测试 - 借助外部测试数据轻松扩展测试
• 🔧 TypeScript 支持 - 提供可靠的类型检查和更好的 IDE 集成
• ♻️ 可复用组件 - 采用模块化设计，最大限度地复用代码
• 🎯 易于维护 - 集中管理定位器和数据
• 📈 可扩展设计 - 轻松添加新的测试场景
• 🎥 MCP 服务集成 - 增强测试录制和回放功能

🌟 主要特性

• 结构清晰、组织有序的测试架构
• 将测试数据与测试逻辑分离
• 提供常见操作的实用辅助方法
• 易于理解的页面对象模式实现
• 全面的测试数据管理
• 提供可直接使用的注册流程示例
• 使用 MCP 服务录制和回放测试
• 自动生成测试脚本

框架结构

tests/
├── data/                    # Test Data Layer
│   ├── interfaces/         
│   │   └── TestData.ts     # Data type definitions
│   ├── TestDataHelper.ts   # Helper class for data management
│   └── testData.ts         # Test scenarios data
├── pages/                   # Page Objects
│   ├── BasePage.ts         # Base page with common functionality
│   ├── LoginPage.ts        # Login page object
│   └── RegistrationPage.ts # Registration page object
└── specs/                   # Test Specifications
    └── registration.spec.ts # Test cases

特性

• 页面对象模型：将测试逻辑与页面交互分离
• 数据驱动测试：将测试数据与测试逻辑分离
• TypeScript：提供强类型和更好的 IDE 支持
• 可复用组件：在基类中封装通用功能
• 易于维护：集中管理定位器和数据
• 可扩展：轻松添加新的测试场景和页面对象

测试数据结构

该框架采用结构化方式管理测试数据：

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

当前测试场景：

1. 有效注册流程（男性用户）
2. 女性用户注册

设置

1. 克隆代码仓库：

git clone <repository-url>
cd playwrightMCP_Demo

2. 安装依赖：

npm install

3. 安装 Playwright 浏览器：

npx playwright install

运行测试

运行所有测试：

npx playwright test

运行指定测试文件：

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

以有头模式运行测试：

npx playwright test --headed

添加新的测试场景

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

{
    name: 'Your Scenario Name',
    login: {
        email: '[email protected]'
    },
    registration: {
        firstName: 'First',
        lastName: 'Last',
        address: 'Address',
        email: '[email protected]',
        phone: '1234567890',
        gender: 'Male' | 'Female',
        country: 'Country Name'
    }
}

2. 新增场景后，测试将自动执行。

框架组件

页面对象

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

数据管理

• TestData.ts：包含测试场景
• TestDataHelper：提供访问和管理测试数据的方法
• 接口：定义测试数据的结构

最佳实践

1. 页面对象应专注于特定页面的功能
2. 将测试数据与测试逻辑分开维护
3. 使用有意义的场景名称
4. 遵循 TypeScript 命名约定
5. 保持测试相互独立且粒度小

贡献

1. 为你的功能创建新分支
2. 添加或更新测试和页面对象
3. 根据需要更新测试数据
4. 提交拉取请求

依赖项

• Playwright
• TypeScript
• Node.js
• @executeautomation/playwright-mcp-server - 用于增强测试录制与回放
• @playwright/test - 核心测试框架

支持

如有任何疑问或问题，请在仓库中创建一个新 issue。