返回市场
playwrightmcp演示版

playwrightmcp演示版

作者:GoldiSaini2 星标更新:2025-04-08

项目介绍

🎭 Playwright 测试自动化框架

🚀 一个基于 Playwright 和 TypeScript 构建的强大数据驱动测试自动化框架,利用 @executeautomation/playwright-mcp-server 增强了测试录制和回放功能。采用页面对象模型设计模式,实现可扩展和易于维护的自动化测试。

Playwright TypeScript Node.js MCP Server

✨ 高亮特性

  • 🏗️ 页面对象模型 - 清晰且易于维护的测试架构
  • 📊 数据驱动测试 - 使用外部测试数据轻松扩展测试
  • 🔧 TypeScript 支持 - 强大的类型检查和更好的IDE集成
  • ♻️ 可重用组件 - 模块化设计以最大化代码复用
  • 🎯 易于维护 - 中央化的定位器和数据管理
  • 📈 可扩展设计 - 轻松添加新的测试场景
  • 🎥 MCP Server 集成 - 增强的测试录制和回放功能

🌟 主要特点

  • 结构化和组织良好的测试架构
  • 测试数据与测试逻辑分离
  • 常见操作的强大辅助方法
  • 易于遵循的页面对象模式实现
  • 全面的测试数据管理
  • 准备好的注册流程示例
  • 使用 MCP Server 进行测试录制和回放
  • 自动化测试脚本生成

框架结构

tests/
├── data/                    # 测试数据层
│   ├── interfaces/         
│   │   └── TestData.ts     # 数据类型定义
│   ├── TestDataHelper.ts   # 数据管理辅助类
│   └── testData.ts         # 测试场景数据
├── pages/                   # 页面对象
│   ├── BasePage.ts         # 包含通用功能的基础页面
│   ├── LoginPage.ts        # 登录页面对象
│   └── RegistrationPage.ts # 注册页面对象
└── specs/                   # 测试规范
    └── registration.spec.ts # 测试用例

功能

  • 页面对象模型:分离测试逻辑与页面交互
  • 数据驱动测试:测试数据与测试逻辑分离
  • TypeScript:强类型检查和更好的IDE支持
  • 可重用组件:基础类中的通用功能
  • 易于维护:中央化的定位器和数据管理
  • 可扩展性:轻松添加新的测试场景和页面对象

测试数据结构

框架使用结构化的方法来管理测试数据:

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

当前测试场景:

  1. 合法注册流程(男性用户)
  2. 女性用户注册

安装

  1. 克隆仓库:
git clone <repository-url>
cd playwrightMCP_Demo
  1. 安装依赖:
npm install
  1. 安装 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: '您的场景名称',
    login: {
        email: 'your.email@test.com'
    },
    registration: {
        firstName: 'First',
        lastName: 'Last',
        address: 'Address',
        email: 'email@test.com',
        phone: '1234567890',
        gender: 'Male' | 'Female',
        country: '国家名称'
    }
}
  1. 新的测试场景将自动执行。

框架组件

页面对象

  • 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 - 核心测试框架

支持

如有任何问题或问题,请在仓库中创建一个新的问题。