mirror of
https://github.com/Powerful-517/yys-editor.git
synced 2026-03-05 06:55:26 +00:00
test: 集成 Vitest 测试框架和开发规范
- 安装 vitest, @vue/test-utils, jsdom 等测试依赖 - 配置 vitest.config.js 测试环境 - 添加 schema.test.ts (7个数据结构验证测试) - 添加 useStore.test.ts (7个状态管理测试) - 创建测试指南文档 (docs/testing.md) - 创建测试规范文档 (docs/testing-rules.md) - 创建开发规范文档 (docs/development-rules.md) - 创建开发工作流程文档 (docs/1management/workflow.md) - 添加测试相关 npm scripts (test, test:watch, test:ui, test:coverage) - 所有测试通过 (14/14)
This commit is contained in:
71
docs/testing.md
Normal file
71
docs/testing.md
Normal file
@@ -0,0 +1,71 @@
|
||||
# 测试指南
|
||||
|
||||
## 运行测试
|
||||
|
||||
项目已集成 Vitest 测试框架,支持以下测试命令:
|
||||
|
||||
```bash
|
||||
# 运行所有测试(单次执行)
|
||||
npm test
|
||||
|
||||
# 监听模式(文件变化时自动重新运行)
|
||||
npm run test:watch
|
||||
|
||||
# 可视化界面运行测试
|
||||
npm run test:ui
|
||||
|
||||
# 生成测试覆盖率报告
|
||||
npm run test:coverage
|
||||
```
|
||||
|
||||
## 测试文件结构
|
||||
|
||||
测试文件位于 `src/__tests__/` 目录:
|
||||
|
||||
- `schema.test.ts` - 数据结构和类型验证测试
|
||||
- `useStore.test.ts` - Store 状态管理和数据操作测试
|
||||
|
||||
## 测试示例
|
||||
|
||||
### 1. Schema 数据结构测试
|
||||
|
||||
验证数据模型的正确性:
|
||||
- 默认值检查
|
||||
- 类型定义验证
|
||||
- 式神/御魂数据结构
|
||||
|
||||
### 2. Store 状态管理测试
|
||||
|
||||
验证核心业务逻辑:
|
||||
- 文件列表的增删改查
|
||||
- 文件切换和重命名
|
||||
- 数据导入导出
|
||||
- localStorage 持久化
|
||||
|
||||
## 编写新测试
|
||||
|
||||
在 `src/__tests__/` 目录创建 `*.test.ts` 文件:
|
||||
|
||||
```typescript
|
||||
import { describe, it, expect } from 'vitest'
|
||||
|
||||
describe('功能模块名称', () => {
|
||||
it('应该做某件事', () => {
|
||||
// 准备数据
|
||||
const input = { /* ... */ }
|
||||
|
||||
// 执行操作
|
||||
const result = someFunction(input)
|
||||
|
||||
// 验证结果
|
||||
expect(result).toBe(expectedValue)
|
||||
})
|
||||
})
|
||||
```
|
||||
|
||||
## 最佳实践
|
||||
|
||||
1. **数据验证优先** - 先测试数据层逻辑,确保核心功能正确
|
||||
2. **独立测试** - 每个测试用例应该独立运行,不依赖其他测试
|
||||
3. **清晰命名** - 测试描述应该清楚说明测试的内容和预期
|
||||
4. **Mock 外部依赖** - 使用 `vi.mock()` 模拟外部模块,保持测试纯粹
|
||||
Reference in New Issue
Block a user