import { describe, expect, it } from 'vitest'
import { render, screen } from '@testing-library/react'
import { DataList } from './DataList'

describe('DataList', () => {
  it('renders each item as a dt/dd pair in a definition list', () => {
    const { container } = render(
      <DataList items={[{ term: 'Status', value: 'Published' }, { term: 'Author', value: 'Alex' }]} />,
    )
    expect(container.querySelector('dl')).toBeTruthy()
    expect(container.querySelectorAll('dt')).toHaveLength(2)
    expect(container.querySelectorAll('dd')).toHaveLength(2)
    expect(screen.getByText('Status')).toBeTruthy()
    expect(screen.getByText('Published')).toBeTruthy()
  })

  it('renders an empty list without error (edge)', () => {
    const { container } = render(<DataList items={[]} />)
    expect(container.querySelector('dl')).toBeTruthy()
    expect(container.querySelectorAll('dt')).toHaveLength(0)
  })
})