mirror of
https://github.com/Powerful-517/yys-editor.git
synced 2026-03-05 06:55:26 +00:00
rookie4show
9227a61c85
问题原因： 1. LogicFlow 的 render() 方法不会自动应用节点的 zIndex 属性 2. 切换标签时，LogicFlow Label 插件对空 _label 数组处理有误导致渲染失败 3. 渲染失败后节点 zIndex 被重置为默认值 1 解决方案： 1. 在 App.vue 中，render() 后立即从保存的数据中恢复每个节点的 zIndex 2. 在 normalizeGraphData() 中清理空的 _label 数组，避免 Label 插件报错 3. 简化 FlowEditor.vue 中的 normalizeAllNodes()，移除不必要的重新分配逻辑 4. 清理调试日志，保持代码整洁 测试： - 添加节点并调整图层顺序 - 切换标签页 - 刷新浏览器 - 确认图层顺序保持不变
94 lines
2.2 KiB
Markdown
94 lines
2.2 KiB
Markdown
# 测试指南
|
|
|
|
## 运行测试
|
|
|
|
项目已集成 Vitest 测试框架，支持以下测试命令：
|
|
|
|
```bash
|
|
# 运行所有测试（单次执行）
|
|
npm test
|
|
|
|
# 监听模式（文件变化时自动重新运行）
|
|
npm run test:watch
|
|
|
|
# 可视化界面运行测试
|
|
npm run test:ui
|
|
|
|
# 生成测试覆盖率报告
|
|
npm run test:coverage
|
|
```
|
|
|
|
## 测试文件结构
|
|
|
|
### 目录规范
|
|
|
|
所有单元测试文件统一放在 `src/__tests__/` 目录下：
|
|
|
|
```
|
|
src/
|
|
├── __tests__/
|
|
│ ├── schema.test.ts # 数据结构和类型验证测试
|
|
│ ├── useStore.test.ts # Store 状态管理和数据操作测试
|
|
│ ├── layer-management.spec.ts # 图层管理功能测试
|
|
│ └── ... # 其他功能模块测试
|
|
├── components/
|
|
├── ts/
|
|
└── ...
|
|
```
|
|
|
|
### 命名规则
|
|
|
|
- **单元测试**: `<功能模块名>.test.ts` 或 `<功能模块名>.spec.ts`
|
|
- **集成测试**: `<功能模块名>.integration.test.ts`
|
|
|
|
### 现有测试文件
|
|
|
|
- `schema.test.ts` - 数据结构和类型验证测试
|
|
- `useStore.test.ts` - Store 状态管理和数据操作测试
|
|
- `layer-management.spec.ts` - 图层管理功能测试（上移、下移、置顶、置底）
|
|
|
|
## 测试示例
|
|
|
|
### 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()` 模拟外部模块，保持测试纯粹
|