AI导哈

自动化测试套件

一个使用Playwright和TypeScript构建的SauceDemo.com端到端自动化测试套件，涵盖功能性和非功能性测试，包括用户认证、产品浏览、购物车操作、可访问性和安全性测试。

  • by jowan88
  • TypeScript
  • 本地部署
  • 更新于
在 GitHub 查看 jowan88/PW-MCP

使用说明

SauceDemo.com编剧测试套件

一套全面的端到端测试自动化套件 SauceDemo.com 使用剧作家。该项目展示了TypeScript和Playwright的现代测试自动化实践，重点关注健壮、可维护和全面的测试策略。

项目概述

此测试套件涵盖了SauceDemo.com电子商务演示网站的核心功能，包括：

  • 用户身份验证和会话管理
  • 产品库存浏览和排序
  • 购物车操作
  • 汉堡菜单导航
  • 可访问性和安全性测试

测试结构

测试套件分为功能测试和非功能测试：

功能测试(tests/functional/)

  • 汉堡菜单 (burger-menu.spec.ts)

    • 菜单导航和状态管理
    • 跨页面功能
    • 过渡处理
    • 键盘交互

  • 购物车 (cart.spec.ts)

    • 添加/删除项目
    • 数量更新
    • 结账流程

  • 边缘案例 (edge-cases.spec.ts)

    • 边界条件
    • 错误场景
    • 国家恢复

  • 库存 (inventory.spec.ts)

    • 产品列表和详细信息
    • 排序和过滤
    • 图像和内容验证

  • 登录 (login.spec.ts)

    • 身份验证流程
    • 用户角色和权限
    • 会话管理

非功能测试(tests/non-functional/)

  • 无障碍 (accessibility.spec.ts)

    • WCAG合规性检查
    • 屏幕阅读器兼容性
    • 键盘导航

  • 安全 (security.spec.ts)

    • 身份验证安全
    • 会话处理
    • 数据保护

入门指南

先决条件

  • Node.js（v14或更高版本）
  • npm（v6或更高版本）

安装

  1. 克隆存储库：

    git clone https://github.com/jowan88/PW-MCP.git
cd PW-MCP

  2. 安装依赖项：

    npm install

  3. 安装Playwright浏览器：

    npx playwright install

运行测试

运行所有测试：

npx playwright test

运行特定的测试文件：

npx playwright test tests/functional/login.spec.ts      # Run login tests
npx playwright test tests/functional/inventory.spec.ts  # Run inventory tests
npx playwright test tests/non-functional/*.spec.ts     # Run all non-functional tests

使用UI模式运行测试：

npx playwright test --ui

查看测试报告：

npx playwright show-report

格式代码：

npm run format        # Format all test files
npm run format:check  # Check formatting without making changes

项目结构

└── pw-mcp/
    ├── tests/
    │   ├── functional/
    │   │   ├── burger-menu.spec.ts
    │   │   ├── cart.spec.ts
    │   │   ├── edge-cases.spec.ts
    │   │   ├── inventory.spec.ts
    │   │   └── login.spec.ts
    │   └── non-functional/
    │       ├── accessibility.spec.ts
    │       └── security.spec.ts
    ├── playwright-report/     # Test execution reports
    ├── test-results/         # Test artifacts and screenshots
    ├── .prettierrc          # Code formatting rules
    ├── playwright.config.ts  # Playwright configuration
    ├── package.json         # Project dependencies
    └── README.md           # Project documentation

最近的更新

  • 将测试重新组织为功能和非功能类别
  • 添加了专用的边缘用例测试套件
  • 改进的汉堡菜单测试可靠性：
    • 增强导航操控
    • 更好的状态管理
    • 更可靠的选择器
    • 正确的过渡处理
  • 添加Prettier以实现一致的代码格式
  • 改进了测试结构，实现了更好的关注点分离
  • 添加了用于常见操作的npm脚本
  • 增强的错误处理和测试稳定性
  • 添加了全面的文档

测试设计原则

  • 隔离：每个测试都是独立的，可以以任何顺序运行
  • 可读性：清晰的测试描述和结构良好的代码
  • 可靠性：强大的选择器和适当的等待策略
  • 可维护性：模块化测试结构和可重用功能
  • 覆盖：对快乐路径和边缘情况进行全面测试

最佳实践

  • 使用适当的等待策略（waitForSelector、waitForNavigation等）
  • 正确处理页面转换和动画
  • 在afterEach钩子中实施可靠的测试清理
  • 使用有意义的测试描述
  • 遵循一致的代码格式
  • 保持测试独立性
  • 实施适当的错误处理
  • 使用适当的断言
  • 保持测试的重点和简洁

贡献

请随时提交问题和增强请求！

相关 MCP