写测试先找稳定逻辑，不要先测样式

// ❌ 不值得测的：UI 渲染细节
test('renders button with correct class', () => {
  const { getByRole } = render(<Button variant="primary" />)
  expect(getByRole('button')).toHaveClass('bg-blue-500 text-white rounded-lg')
})
 
// ✅ 值得测的：纯函数逻辑
test('formatPrice formats number to currency string', () => {
  expect(formatPrice(1234.5, 'CNY')).toBe('¥1,234.50')
  expect(formatPrice(0, 'USD')).toBe('$0.00')
  expect(formatPrice(-100, 'EUR')).toBe('-€100.00')
})

// permissions.ts
export function canAccessDocument(
  user: { role: string; department: string },
  document: { visibility: 'public' | 'internal' | 'confidential'; ownerDept: string }
): boolean {
  if (document.visibility === 'public') return true
  if (document.visibility === 'confidential') {
    return user.role === 'admin' || user.department === document.ownerDept
  }
  // internal
  return user.role !== 'guest'
}
 
// permissions.test.ts
test('guest cannot access internal documents', () => {
  expect(canAccessDocument(
    { role: 'guest', department: 'engineering' },
    { visibility: 'internal', ownerDept: 'engineering' }
  )).toBe(false)
})
 
test('admin can access confidential documents from any department', () => {
  expect(canAccessDocument(
    { role: 'admin', department: 'engineering' },
    { visibility: 'confidential', ownerDept: 'finance' }
  )).toBe(true)
})

// error-mapping.ts
export function mapApiError(statusCode: number, body: { code?: string }): UserFacingError {
  switch (statusCode) {
    case 400:
      return { type: 'validation', message: '输入信息有误，请检查后重试' }
    case 401:
      return { type: 'auth', message: '登录已过期，请重新登录' }
    case 403:
      return { type: 'permission', message: '你没有权限执行此操作' }
    case 404:
      return { type: 'not_found', message: '请求的资源不存在' }
    case 429:
      return { type: 'rate_limit', message: '操作太频繁，请稍后再试' }
    default:
      if (body.code === 'PAYMENT_EXPIRED') {
        return { type: 'payment', message: '支付已过期，请重新发起' }
      }
      return { type: 'unknown', message: '服务暂时不可用，请稍后重试' }
  }
}

// 分页计算
function calculatePagination(total: number, page: number, pageSize: number) {
  const safePageSize = Math.max(1, Math.min(pageSize, 100))
  const totalPages = Math.ceil(total / safePageSize)
  const safePage = Math.max(1, Math.min(page, totalPages || 1))
 
  return {
    page: safePage,
    pageSize: safePageSize,
    totalPages,
    hasNext: safePage < totalPages,
    hasPrev: safePage > 1,
  }
}
 
test('clamps page to valid range when total is 0', () => {
  const result = calculatePagination(0, 5, 20)
  expect(result.page).toBe(1)
  expect(result.totalPages).toBe(0)
  expect(result.hasNext).toBe(false)
  expect(result.hasPrev).toBe(false)
})
 
test('clamps pageSize to max 100', () => {
  const result = calculatePagination(500, 1, 999)
  expect(result.pageSize).toBe(100)
})

// ❌ 测试实现细节：依赖组件内部结构
test('calls onSubmit when button is clicked', () => {
  const onSubmit = vi.fn()
  const { getByTestId } = render(<Form onSubmit={onSubmit} />)
  fireEvent.click(getByTestId('submit-button'))
  expect(onSubmit).toHaveBeenCalledTimes(1)
})
 
// ✅ 测试业务行为：验证表单提交后的状态变化
test('form submission creates a new record and shows success', async () => {
  const { user, getByText } = render(<Form />)
  await user.click(getByText('提交'))
  expect(getByText('提交成功')).toBeInTheDocument()
})

// ❌ 只测正常路径
test('calculates discount correctly', () => {
  expect(calculateDiscount(100, 0.1)).toBe(90)
})
 
// ✅ 覆盖边界和异常情况
test('calculateDiscount handles edge cases', () => {
  expect(calculateDiscount(100, 0)).toBe(100)       // 无折扣
  expect(calculateDiscount(100, 1)).toBe(0)         // 全额折扣
  expect(calculateDiscount(0, 0.5)).toBe(0)         // 原价为零
  expect(calculateDiscount(-50, 0.1)).toBe(-45)     // 负数金额
  expect(calculateDiscount(100, -0.1)).toBe(100)    // 负折扣率，应该当 0 处理
  expect(calculateDiscount(100, 1.5)).toBe(100)     // 超过 100% 折扣，应该封顶
})

// ❌ 测试渲染结果：绑定 CSS 类名
test('error message displays in red', () => {
  const { getByText } = render(<ErrorMessage text="出错了" />)
  const el = getByText('出错了')
  expect(el).toHaveClass('text-red-500')
})
 
// ✅ 测试映射逻辑：验证错误码到消息的转换
test('mapErrorCode returns user-facing message for each status', () => {
  expect(mapApiError(400, {}).message).toContain('输入')
  expect(mapApiError(401, {}).message).toContain('登录')
  expect(mapApiError(500, {}).message).toContain('服务')
  expect(mapApiError(503, { code: 'MAINTENANCE' }).message).toContain('维护')
})

// ❌ 测试 UI 切换细节
test('toggles dropdown open and closed', () => {
  const { getByRole } = render(<Dropdown />)
  expect(getByRole('listbox')).not.toBeVisible()
  fireEvent.click(getByRole('button'))
  expect(getByRole('listbox')).toBeVisible()
  fireEvent.click(getByRole('button'))
  expect(getByRole('listbox')).not.toBeVisible()
})
 
// ✅ 测试状态机转换
test('order state transitions follow valid paths', () => {
  expect(transitionOrderState('draft', 'SUBMIT')).toBe('pending_review')
  expect(transitionOrderState('pending_review', 'APPROVE')).toBe('confirmed')
  expect(transitionOrderState('pending_review', 'REJECT')).toBe('draft')
  expect(() => transitionOrderState('confirmed', 'SUBMIT')).toThrow(
    'INVALID_TRANSITION'
  )
})