mini-starter/mini-ui-packages/rencai-personal-info-ui/tests/unit/components/DocumentPhotoItem.test.tsx

/**
 * DocumentPhotoItem 组件测试
 */
import React from 'react'
import { render, screen } from '@testing-library/react'
import '@testing-library/jest-dom'
import DocumentPhotoItem, { PhotoInfo } from '../../../src/components/DocumentPhotoItem'
import Taro from '@tarojs/taro'

describe('DocumentPhotoItem', () => {
  const mockPhoto: PhotoInfo = {
    id: 1,
    photoType: '身份证',
    fileUrl: 'https://example.com/id-card.jpg',
    fileName: '身份证.jpg',
    uploadTime: '2024-01-01T10:30:00Z',
    canDownload: 1
  }

  beforeEach(() => {
    ;(Taro.previewImage as jest.Mock).mockClear()
  })

  it('应该正确渲染照片信息', () => {
    const { container } = render(<DocumentPhotoItem photo={mockPhoto} />)

    expect(screen.getByText('身份证')).toBeInTheDocument()

    // 检查边框样式
    const borderedElement = container.querySelector('.border-gray-200')
    expect(borderedElement).toBeInTheDocument()
  })

  it('应该在fileUrl为空时显示占位符', () => {
    const photoWithoutUrl = { ...mockPhoto, fileUrl: null }
    const { container } = render(<DocumentPhotoItem photo={photoWithoutUrl} />)

    // 应该显示占位图标 (使用 document 图标)
    const placeholderIcon = container.querySelector('.i-heroicons-document-20-solid')
    expect(placeholderIcon).toBeInTheDocument()
  })

  it('应该在点击照片时调用预览', () => {
    const { fireEvent } = require('@testing-library/react')

    render(<DocumentPhotoItem photo={mockPhoto} />)

    const photoContainer = screen.getByText('身份证').closest('.cursor-pointer')
    if (photoContainer) {
      fireEvent.click(photoContainer)

      expect(Taro.previewImage).toHaveBeenCalledWith({
        current: 'https://example.com/id-card.jpg',
        urls: ['https://example.com/id-card.jpg']
      })
    }
  })

  it('应该在fileUrl为空时不调用预览', () => {
    const { fireEvent } = require('@testing-library/react')

    const photoWithoutUrl = { ...mockPhoto, fileUrl: null }
    render(<DocumentPhotoItem photo={photoWithoutUrl} />)

    const photoContainer = screen.getByText('身份证').closest('.cursor-pointer')
    if (photoContainer) {
      fireEvent.click(photoContainer)

      expect(Taro.previewImage).not.toHaveBeenCalled()
    }
  })
})