209 lines
5.1 KiB
Markdown
209 lines
5.1 KiB
Markdown
# E2E 测试项目
|
||
|
||
这是一个采用 Page Object Model (POM) 设计模式的 Playwright E2E 测试项目，具有良好的可扩展性、可维护性和可读性。
|
||
|
||
## 项目结构
|
||
|
||
```
|
||
e2e/
|
||
├── config/
|
||
│ └── test.config.ts # 测试配置文件（环境、超时、测试数据等）
|
||
├── pages/
|
||
│ ├── BasePage.ts # 页面基类
|
||
│ ├── LoginPage.ts # 登录页面对象
|
||
│ ├── StudentPage.ts # 学生管理页面对象
|
||
│ ├── DreamiExplorePage.ts # DreamiExplore 页面对象
|
||
│ └── EssayWritingPage.ts # Essay Writing 页面对象
|
||
├── utils/
|
||
│ └── error-handler.ts # 错误处理工具类
|
||
├── test-1.spec.ts # 原始测试文件
|
||
├── 文书管理.spec.ts # 原始文书管理测试
|
||
├── 文书管理-refactored.spec.ts # 重构后的文书管理测试
|
||
└── README.md # 本文档
|
||
|
||
根目录/
|
||
├── run-tests.bat # Windows 一键运行脚本
|
||
├── run-tests.sh # Linux/Mac 一键运行脚本
|
||
└── playwright.config.ts # Playwright 配置文件
|
||
```
|
||
|
||
## 设计特点
|
||
|
||
### 1. Page Object Model (POM)
|
||
- **职责分离**：每个页面有独立的 Page Object 类
|
||
- **代码复用**：页面操作封装为可复用的方法
|
||
- **易于维护**：UI 变化只需修改对应的 Page Object
|
||
|
||
### 2. 配置集中管理
|
||
- 所有配置信息集中在 `config/test.config.ts`
|
||
- 包括：环境 URL、登录凭证、超时设置、测试数据等
|
||
- 方便切换不同环境和调整参数
|
||
|
||
### 3. 错误处理机制
|
||
- 专门的 `ErrorHandler` 类管理错误
|
||
- 自动捕获错误并继续执行
|
||
- 生成详细的错误报告文件
|
||
- 清理错误信息，去除技术细节
|
||
|
||
### 4. 可读性强
|
||
- 测试步骤清晰明了
|
||
- 采用描述性方法名
|
||
- 良好的代码注释
|
||
|
||
## 快速开始
|
||
|
||
### 安装依赖
|
||
```bash
|
||
npm install
|
||
```
|
||
|
||
### 运行测试
|
||
|
||
#### Windows 用户
|
||
双击运行 `run-tests.bat`，或在命令行执行：
|
||
```cmd
|
||
run-tests.bat
|
||
```
|
||
|
||
#### Linux/Mac 用户
|
||
首先给脚本添加执行权限：
|
||
```bash
|
||
chmod +x run-tests.sh
|
||
```
|
||
|
||
然后运行：
|
||
```bash
|
||
./run-tests.sh
|
||
```
|
||
|
||
### 手动运行测试
|
||
|
||
运行所有测试：
|
||
```bash
|
||
npx playwright test
|
||
```
|
||
|
||
运行特定测试文件：
|
||
```bash
|
||
# 运行重构版本
|
||
npx playwright test e2e/文书管理-refactored.spec.ts
|
||
|
||
# 运行原始版本
|
||
npx playwright test e2e/文书管理.spec.ts
|
||
npx playwright test e2e/test-1.spec.ts
|
||
```
|
||
|
||
查看测试报告：
|
||
```bash
|
||
npx playwright show-report
|
||
```
|
||
|
||
## 配置说明
|
||
|
||
### 修改测试环境
|
||
编辑 `e2e/config/test.config.ts`：
|
||
|
||
```typescript
|
||
export const TestConfig = {
|
||
env: {
|
||
baseUrl: 'https://pre.prodream.cn/en', // 修改为你的测试环境
|
||
loginUrl: 'https://pre.prodream.cn/en',
|
||
},
|
||
credentials: {
|
||
email: 'your-email@example.com', // 修改登录账号
|
||
password: 'your-password',
|
||
},
|
||
// ... 其他配置
|
||
};
|
||
```
|
||
|
||
### 调整超时设置
|
||
在 `test.config.ts` 中的 `timeouts` 部分调整各个操作的超时时间。
|
||
|
||
### 修改测试数据
|
||
在 `test.config.ts` 中的 `testData` 部分修改测试使用的数据。
|
||
|
||
## 添加新的测试
|
||
|
||
### 1. 创建新的 Page Object
|
||
在 `e2e/pages/` 目录下创建新的页面类：
|
||
|
||
```typescript
|
||
import { Page, expect } from '@playwright/test';
|
||
import { BasePage } from './BasePage';
|
||
|
||
export class YourPage extends BasePage {
|
||
constructor(page: Page) {
|
||
super(page);
|
||
}
|
||
|
||
async yourMethod(): Promise<void> {
|
||
// 实现页面操作
|
||
}
|
||
}
|
||
```
|
||
|
||
### 2. 在测试中使用
|
||
在测试文件中导入并使用：
|
||
|
||
```typescript
|
||
import { YourPage } from './pages/YourPage';
|
||
|
||
test('your test', async ({ page }) => {
|
||
const yourPage = new YourPage(page);
|
||
await yourPage.yourMethod();
|
||
});
|
||
```
|
||
|
||
## 错误报告
|
||
|
||
测试完成后会自动生成错误报告文件：
|
||
- 文件名格式：`test-error-report-{timestamp}.txt`
|
||
- 包含内容：
|
||
- 登录账号信息
|
||
- 每个失败步骤的详细信息
|
||
- 错误发生时的页面 URL
|
||
- 错误时间戳
|
||
|
||
## 最佳实践
|
||
|
||
1. **保持 Page Object 简洁**：每个方法只做一件事
|
||
2. **使用有意义的方法名**：让测试代码像文档一样可读
|
||
3. **集中管理配置**：避免硬编码
|
||
4. **合理设置超时**：根据实际情况调整
|
||
5. **错误处理**：利用 `executeStep` 包装测试步骤
|
||
6. **定期维护**：随 UI 变化更新 Page Object
|
||
|
||
## 常见问题
|
||
|
||
### Q: 测试超时怎么办？
|
||
A: 在 `test.config.ts` 中调整对应操作的超时时间。
|
||
|
||
### Q: 如何调试失败的测试？
|
||
A:
|
||
1. 查看生成的错误报告文件
|
||
2. 使用 Playwright 的调试模式：`npx playwright test --debug`
|
||
3. 查看 HTML 报告：`npx playwright show-report`
|
||
|
||
### Q: 如何只运行单个测试？
|
||
A: 使用 `.only`：
|
||
```typescript
|
||
test.only('your test', async ({ page }) => {
|
||
// ...
|
||
});
|
||
```
|
||
|
||
## 贡献指南
|
||
|
||
1. 遵循现有的代码风格
|
||
2. 为新功能添加适当的注释
|
||
3. 更新相关文档
|
||
4. 确保所有测试通过
|
||
|
||
## 技术栈
|
||
|
||
- **Playwright**: E2E 测试框架
|
||
- **TypeScript**: 类型安全的 JavaScript
|
||
- **Page Object Model**: 设计模式
|
||
- **Node.js**: 运行环境
|