import { describe, expect, it, vi } from 'vitest'
import { render, screen, fireEvent, waitFor } from '@testing-library/react'
import { Field } from './Field'
import { Input } from './Input'
import { spokenPhraseUntil } from './sr-test-utils'

describe('Input [SR]', () => {
  it('announces standard labeled input state', async () => {
    render(
      <Field label="Email">
        <Input />
      </Field>,
    )

    const phrase = await spokenPhraseUntil(document.body, (value) => value.toLowerCase().includes('email'))
    expect(phrase.toLowerCase()).toContain('email')
  })

  it('announces field validation copy when error is present', async () => {
    render(
      <Field label="Username" error="Username is required">
        <Input />
      </Field>,
    )
    const phrase = await spokenPhraseUntil(document.body, (value) => value.toLowerCase().includes('username is required'))
    expect(phrase.toLowerCase()).toContain('username is required')
  })

  it('toggles invalid via invalid prop and announces as textbox', async () => {
    const onChange = vi.fn()
    render(<Input aria-label="Code" invalid onChange={onChange} />)
    fireEvent.change(screen.getByRole('textbox', { name: 'Code' }), { target: { value: 'abc' } })
    expect(onChange).toHaveBeenCalled()

    const phrase = await spokenPhraseUntil(document.body, (value) => value.toLowerCase().includes('code'))
    expect(phrase.toLowerCase()).toContain('code')
  })
})