# 测试文档

本目录包含罗盘项目的所有测试用例。

## 测试文件结构

```
tests/
├── README.md                 # 本文档
├── constants.test.ts        # 常量和配置测试
├── utils.test.ts            # 工具函数单元测试
├── useLuopan.test.ts        # 组合函数业务逻辑测试
└── Luopan.test.ts           # Vue 组件测试
```

## 测试覆盖范围

### 1. constants.test.ts (22 个测试)
测试项目的常量配置和示例数据：
- 默认尺寸、文字位置等配置项的有效性
- 示例数据的完整性和正确性
- 角度数组和半径数组的有效性验证
- 不同类型示例的存在性检查

### 2. utils.test.ts (48 个测试)
测试所有工具函数的核心逻辑：
- **polarToXY**: 极坐标转换
- **normalizeDeg**: 角度归一化
- **annularSectorCentroid**: 扇形形心计算
- **annularSectorPath**: SVG 路径生成
- **annularSectorInsetPath**: 内缩路径生成
- **calculateLabelRotation**: 文字旋转角度
- **generateSectorColor**: 扇区颜色生成
- **generateTextPath**: 文字路径生成
- **generateVerticalTextPath**: 竖排文字路径
- **getTextColorForBackground**: 文字颜色适配
- **calculateSectorFontSize**: 字体大小计算

### 3. useLuopan.test.ts (32 个测试)
测试罗盘业务逻辑组合函数：
- 基本功能和返回值验证
- 扇区生成逻辑
- 文字位置模式（middle/centroid）
- 文字方向判断
- 竖排文字判断
- 内部填色逻辑
- 响应式更新
- 边界情况处理

### 4. Luopan.test.ts (57 个测试)
测试 Vue 组件的完整功能：
- 组件基本渲染
- 示例切换功能
- 辅助线显示/隐藏
- 文字位置模式选择
- 缩放功能（放大、缩小、重置）
- 鼠标滚轮缩放
- 鼠标拖拽平移
- 扇区渲染
- 文字渲染
- 辅助线渲染
- 说明文本
- 背景渲染
- 样式验证
- 边界情况
- 性能测试

## 运行测试

### 运行所有测试
```bash
npm test
```

### 运行单个测试文件
```bash
npm test tests/utils.test.ts
```

### 运行测试并监视文件变化
```bash
npm test -- --watch
```

### 生成测试覆盖率报告
```bash
npm test -- --coverage
```

## 测试统计

- **总测试文件**: 4 个
- **总测试用例**: 159 个
- **测试通过率**: 100%
- **测试运行时间**: ~1.8 秒

## 测试编写规范

1. **描述清晰**: 每个测试用例的描述应该清楚说明测试的内容
2. **独立性**: 测试用例之间应该相互独立，不依赖执行顺序
3. **覆盖全面**: 包括正常情况、边界情况和异常情况
4. **断言准确**: 使用合适的断言方法，确保测试的准确性
5. **可维护性**: 测试代码应该易于理解和维护

## 技术栈

- **测试框架**: Vitest
- **Vue 测试工具**: @vue/test-utils
- **测试环境**: happy-dom

## 贡献指南

添加新功能时，请确保：
1. 为新功能编写对应的测试用例
2. 确保所有现有测试通过
3. 测试覆盖率不低于当前水平
4. 测试用例描述清晰，易于理解