test: 重构测试体系 — 建立组件测试层、补充后端测试、清理低质量测试

- 新增 jsdom + @testing-library/react 组件测试环境
- 新增 12 个组件测试，覆盖所有前端组件
- 补充后端 middleware 和 helpers 单元测试
- 删除伪测试 use-target-detail-logic.test.ts
- 精简过度枚举的 color-threshold.test.ts
- 新增 bunfig.toml 配置测试 preload
- 更新 DEVELOPMENT.md 测试章节
- 安装 @types/jsdom 修复类型声明

DEVELOPMENT.md

@@ -993,11 +993,40 @@ bun run check         # 一键运行 schema:check + typecheck + lint + test
 
 ## 测试
 
+项目采用两层测试体系：单元测试 + 组件测试。所有测试使用 `bun:test` 运行。
+
+### 测试分层
+
+| 层级     | 覆盖范围               | 位置                                                                          | 命令                                          |
+| -------- | ---------------------- | ----------------------------------------------------------------------------- | --------------------------------------------- |
+| 单元测试 | 后端函数、纯函数、常量 | `tests/server/**/*.test.ts`、`tests/web/{constants,utils,hooks}/**/*.test.ts` | `bun test tests/server`、`bun test tests/web` |
+| 组件测试 | React 组件渲染和交互   | `tests/web/components/**/*.test.tsx`                                          | `bun test tests/web/components`               |
+
+### 运行命令
+
 ```bash
-bun run check    # 日常开发（类型检查 + lint（含格式） + 单元测试）
-bun run verify   # 完整验证（check + 构建）
+bun test           # 运行所有单元测试和组件测试
+bun test tests/server    # 只运行后端单元测试
+bun test tests/web       # 只运行前端测试（单元 + 组件）
+bun run check      # 日常开发（类型检查 + lint + 测试）
+bun run verify     # 完整验证（check + 构建）
 ```
 
+### 组件测试环境
+
+组件测试使用 jsdom 模拟浏览器环境，配置位于 `tests/setup.ts`（通过 `bunfig.toml` preload 加载）：
+
+- jsdom 提供完整的 DOM 环境
+- TDesign 组件所需的 polyfill：ResizeObserver、IntersectionObserver、matchMedia、attachEvent
+- recharts 图表组件被 mock 为占位元素（SVG 渲染在 jsdom 中不可靠）
+
+### 编写规范
+
+- **优先使用 `@testing-library/react`** 的语义化查询（getByText、getByRole）而非 CSS 选择器
+- **测试用户行为而非实现细节**：模拟用户点击、输入等操作，而非直接调用组件方法
+- **只 mock 系统边界**：mock fetch 返回预设响应，使用真实的 QueryClientProvider 包裹组件
+- **组件测试文件命名**：`tests/web/components/ComponentName.test.tsx`
+
 ## 已知限制
 
 当前不做告警通知、拨测目标动态增删、认证鉴权和分布式部署。