DP/tests/测试文档.md

DesignerCEP 测试文档

📋 测试概述

本测试套件包含完整的前后端测试，覆盖：

• 后端API测试 (Pytest)
• 前端组件测试 (Vitest)
• 端到端集成测试 (E2E)

---

🎯 测试目标

后端测试覆盖

• ✅ 管理员配置API (功能/VIP/签到配置)
• ✅ 功能使用API (核心扣费逻辑)
• ✅ 签到API (签到/日历/历史)
• ✅ 用户资料API
• ✅ 统计API

前端测试覆盖

• ✅ HomePage组件
• ✅ Profile组件
• ✅ CheckIn组件
• ✅ 用户交互流程

集成测试覆盖

• ✅ 用户完整使用流程
• ✅ 管理员配置流程
• ✅ VIP功能测试

---

🚀 快速开始

1. 后端测试

环境准备

cd tests/backend
pip install -r requirements.txt

配置测试数据库

复制 .env.example 为 .env 并配置：

TEST_DB_HOST=localhost
TEST_DB_USER=root
TEST_DB_PASSWORD=your_password
TEST_DB_NAME=designercep_test
TEST_API_URL=https://backend.aidg168.uk/api/v1

运行测试

# Windows
run_tests.bat

# Linux/Mac
chmod +x run_tests.sh
./run_tests.sh

# 或直接运行pytest
pytest -v

查看覆盖率报告

测试完成后，打开 htmlcov/index.html 查看代码覆盖率。

---

2. 前端测试

环境准备

cd Designer
npm install

配置Vitest

前端项目已配置 Vitest，无需额外配置。

运行测试

# 运行所有测试
npm run test

# 监听模式
npm run test:watch

# 生成覆盖率报告
npm run test:coverage

单独运行某个测试文件

npx vitest tests/frontend/HomePage.test.ts

---

3. 集成测试

运行E2E测试

cd tests/integration
python e2e_test.py

注意: 集成测试需要：

1. 后端服务正常运行
2. 数据库已完成迁移
3. 测试用户已创建

---

📊 测试文件结构

tests/
├── backend/                  # 后端测试
│   ├── conftest.py          # Pytest配置和fixtures
│   ├── test_admin_config.py # 管理员配置测试
│   ├── test_feature.py      # 功能使用测试
│   ├── test_checkin.py      # 签到功能测试
│   ├── test_user_profile.py # 用户资料测试
│   ├── test_stats.py        # 统计功能测试
│   ├── requirements.txt     # Python依赖
│   └── run_tests.bat        # Windows测试脚本
│
├── frontend/                 # 前端测试
│   ├── HomePage.test.ts     # 首页组件测试
│   ├── Profile.test.ts      # 个人中心测试
│   └── CheckIn.test.ts      # 签到页面测试
│
├── integration/              # 集成测试
│   └── e2e_test.py          # 端到端测试
│
└── README.md                 # 测试说明文档

---

🧪 测试用例详解

后端测试

1. 管理员配置测试 (test_admin_config.py)

class TestFeaturesConfig:
    - test_get_features_config()        # 获取功能配置列表
    - test_create_feature_config()      # 创建新功能
    - test_update_feature_config()      # 更新功能配置
    - test_delete_feature_config()      # 删除功能配置
    - test_update_nonexistent_feature() # 更新不存在的功能

class TestVIPConfig:
    - test_get_vip_config()            # 获取VIP配置
    - test_update_vip_config()         # 更新VIP配置

class TestCheckInConfig:
    - test_get_checkin_config()        # 获取签到配置
    - test_create_checkin_config()     # 创建签到档位
    - test_update_checkin_config()     # 更新签到档位

2. 功能使用测试 (test_feature.py)

class TestFeatureUsage:
    - test_use_feature_normal_user()       # 普通用户使用功能
    - test_use_feature_insufficient_points() # 积分不足
    - test_use_feature_vip_user_with_quota() # VIP用户使用配额
    - test_use_disabled_feature()          # 使用已禁用功能
    - test_use_nonexistent_feature()       # 不存在的功能

3. 签到测试 (test_checkin.py)

class TestDailyCheckIn:
    - test_first_checkin()                 # 首次签到
    - test_duplicate_checkin()             # 重复签到
    - test_consecutive_checkin_calculation() # 连续天数计算
    - test_broken_consecutive_checkin()    # 中断连续签到
    - test_vip_multiplier()                # VIP倍数

前端测试

1. HomePage测试 (HomePage.test.ts)

describe('HomePage', () => {
  - it('应该正确渲染组件')
  - it('应该显示欢迎信息')
  - it('应该显示正确的积分数量')
  - it('应该显示VIP状态')
  - it('点击功能卡片应该调用使用功能API')
  - it('积分不足时应该显示错误提示')
})

2. Profile测试 (Profile.test.ts)

describe('Profile', () => {
  - it('应该显示用户基本信息')
  - it('应该显示统计数据卡片')
  - it('应该能够编辑资料')
  - it('应该显示积分历史列表')
})

3. CheckIn测试 (CheckIn.test.ts)

describe('CheckIn', () => {
  - it('应该显示签到状态')
  - it('未签到时应该显示签到按钮')
  - it('点击签到按钮应该调用签到API')
  - it('应该显示签到日历')
  - it('应该显示签到历史记录')
})

---

🔧 测试工具和技术

后端测试技术栈

• Pytest: Python测试框架
• Requests: HTTP客户端
• PyMySQL: 数据库连接
• pytest-cov: 代码覆盖率
• pytest-html: HTML测试报告

前端测试技术栈

• Vitest: Vue3测试框架
• @vue/test-utils: Vue组件测试工具
• jsdom: DOM环境模拟

---

📝 编写新测试

后端测试示例

def test_your_api(test_user):
    """测试你的API"""
    # 1. 准备数据
    request_data = {
        'username': test_user['username'],
        'param': 'value'
    }
    
    # 2. 调用API
    response = requests.post(
        f"{API_BASE_URL}/your/endpoint",
        json=request_data
    )
    
    # 3. 断言结果
    assert response.status_code == 200
    data = response.json()
    assert data['code'] == 200
    assert data['data']['field'] == expected_value

前端测试示例

it('应该测试你的功能', async () => {
  // 1. Mock API
  ;(axios.get as any).mockResolvedValue({
    data: { code: 200, data: mockData }
  })
  
  // 2. 挂载组件
  const wrapper = mount(YourComponent)
  await new Promise(resolve => setTimeout(resolve, 100))
  
  // 3. 断言
  expect(wrapper.text()).toContain('期望文本')
})

---

⚠️ 注意事项

1. 测试数据隔离

• 后端测试使用独立的测试数据库
• 每个测试用例结束后自动回滚数据
• 测试用户名以 test_ 开头

2. 异步操作

# 后端：等待数据库更新
time.sleep(1)

# 前端：等待组件更新
await new Promise(resolve => setTimeout(resolve, 100))

3. 测试环境变量

确保测试环境不会影响生产数据：

ENV=test
DB_NAME=designercep_test
API_URL=https://test.backend.aidg168.uk

4. Mock外部依赖

// Mock axios
vi.mock('axios')

// Mock router
vi.mock('vue-router', () => ({
  useRouter: () => mockRouter
}))

---

📈 测试覆盖率目标

模块	目标覆盖率	当前状态
后端API	> 80%	✅ 已达标
前端组件	> 70%	✅ 已达标
集成测试	核心流程全覆盖	✅ 已达标

---

🐛 问题排查

后端测试失败

问题1: 数据库连接失败

解决: 检查 .env 配置，确保测试数据库存在

问题2: API返回500错误

解决: 检查后端服务是否正常运行

前端测试失败

问题1: 组件挂载失败

解决: 检查是否正确Mock了所有依赖

问题2: 异步断言失败

解决: 增加等待时间或使用 waitFor()

---

📊 CI/CD集成

GitHub Actions示例

name: Tests

on: [push, pull_request]

jobs:
  backend-tests:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - name: Set up Python
        uses: actions/setup-python@v2
      - name: Install dependencies
        run: |
          cd tests/backend
          pip install -r requirements.txt
      - name: Run tests
        run: pytest -v --cov

  frontend-tests:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - name: Set up Node.js
        uses: actions/setup-node@v2
      - name: Install dependencies
        run: |
          cd Designer
          npm install
      - name: Run tests
        run: npm run test

---

✅ 测试检查清单

提交代码前

• 所有测试通过
• 新功能已添加测试
• 测试覆盖率达标
• 无eslint/pylint警告

发布前

• 运行完整测试套件
• 运行E2E集成测试
• 检查测试报告
• 验证关键流程

---

📚 参考资料

• Pytest文档
• Vitest文档
• Vue Test Utils
• Testing Best Practices

---

测试是质量的保证！ 🎯