/** * UserInfoHeader 组件测试 */ import React from 'react' import { render, screen } from '@testing-library/react' import '@testing-library/jest-dom' import UserInfoHeader from '../../../src/components/UserInfoHeader' import { PersonalInfoResponse } from '../../../src/components/PersonalBasicInfo' describe('UserInfoHeader', () => { const mockPersonalInfo: PersonalInfoResponse = { name: '张三', gender: '男', idCard: '110101199001011234', disabilityId: 'D12345678901', disabilityType: '肢体残疾', disabilityLevel: '三级', phone: '13800138000', province: '北京市', city: '北京市', district: '朝阳区', detailedAddress: '某某街道123号', birthDate: '1990-01-01', idAddress: '北京市朝阳区某某街道123号', idValidDate: '2030-01-01', disabilityValidDate: '2025-12-31', canDirectContact: 1, isMarried: 0, nation: '汉族', jobStatus: 1, specificDisability: '左腿小腿截肢' } it('应该正确渲染用户信息区域', () => { const { container } = render( ) // 检查用户名 expect(screen.getByText('张三')).toBeInTheDocument() // 检查用户状态 expect(screen.getByText('肢体残疾 · 三级 · 在职')).toBeInTheDocument() // 检查渐变背景 const gradientElement = container.querySelector('.bg-gradient-to-b') expect(gradientElement).toBeInTheDocument() // 检查头像 (姓名首字) expect(screen.getByText('张')).toBeInTheDocument() }) it('应该显示loading状态', () => { const { container } = render( ) // 检查loading动画类 const pulseElement = container.querySelector('.animate-pulse') expect(pulseElement).toBeInTheDocument() }) it('应该在personalInfo为null时显示默认值', () => { const { container } = render( ) // 应该显示默认值而不是null expect(screen.getByText('未知用户')).toBeInTheDocument() expect(screen.getByText('状态未知')).toBeInTheDocument() expect(screen.getByText('?')).toBeInTheDocument() // 检查渐变背景 const gradientElement = container.querySelector('.bg-gradient-to-b') expect(gradientElement).toBeInTheDocument() }) it('应该正确提取姓名首字作为头像', () => { render() // 姓名首字 "张" expect(screen.getByText('张')).toBeInTheDocument() }) it('应该正确处理待业状态', () => { const unemployedInfo = { ...mockPersonalInfo, jobStatus: 0 } render() expect(screen.getByText('肢体残疾 · 三级 · 待业')).toBeInTheDocument() }) it('应该在缺少某些字段时正确显示', () => { const incompleteInfo = { ...mockPersonalInfo, disabilityType: '', disabilityLevel: '' } render() // 只显示就业状态 expect(screen.getByText('在职')).toBeInTheDocument() }) it('应该显示相机图标按钮', () => { const { container } = render( ) // 检查相机图标 const cameraIcon = container.querySelector('.i-heroicons-camera-20-solid') expect(cameraIcon).toBeInTheDocument() }) })