// @vitest-environment jsdom
import { describe, it, expect } from 'vitest'
import { render, screen } from '@testing-library/react'
import ProgressBar from './ProgressBar.jsx'

// 이 파일이 하는 일: 진행률 계산(반올림)과 0 나눗셈 방어, 막대 너비를 검증한다.

describe('ProgressBar', () => {
  it('진행률을 백분율로 계산해 표시한다', () => {
    render(<ProgressBar value={3} total={4} />)
    expect(screen.getByText('3 / 4 (75%)')).toBeInTheDocument()
  })

  it('소수점은 반올림한다', () => {
    render(<ProgressBar value={1} total={3} />) // 33.33... → 33
    expect(screen.getByText('1 / 3 (33%)')).toBeInTheDocument()
  })

  it('total이 0이면 NaN이 아니라 0%를 보여준다(0 나눗셈 방어)', () => {
    // 학습 포인트: total/0은 NaN이 되어 "NaN%"가 찍히는 사고 — 이 방어를 못 박는다.
    render(<ProgressBar value={0} total={0} />)
    expect(screen.getByText('0 / 0 (0%)')).toBeInTheDocument()
  })

  it('채워진 막대의 너비가 진행률과 같다', () => {
    const { container } = render(<ProgressBar value={1} total={4} />) // 25%
    const fill = container.querySelector('.progress-fill')
    expect(fill).toHaveStyle({ width: '25%' })
  })
})
