import { describe, expect, it, vi, beforeEach, afterEach } from 'vitest'
import { render, screen, waitFor } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import { SaasProvider } from '@saas-ui/react'
import { MemoryRouter } from 'react-router-dom'
import { RequestDemo } from './RequestDemo'

function renderPage() {
  return render(
    <SaasProvider>
      <MemoryRouter>
        <RequestDemo />
      </MemoryRouter>
    </SaasProvider>,
  )
}

describe('RequestDemo', () => {
  beforeEach(() => {
    vi.restoreAllMocks()
  })
  afterEach(() => {
    vi.unstubAllGlobals()
  })

  it('affiche le formulaire de demande de démo', () => {
    renderPage()
    expect(screen.getByRole('heading', { name: /demander une démo/i })).toBeInTheDocument()
    expect(screen.getByLabelText(/entreprise/i)).toBeInTheDocument()
  })

  it('envoie le lead et affiche la confirmation', async () => {
    const fetchMock = vi.fn().mockResolvedValue({
      ok: true,
      status: 201,
      json: async () => ({ id: '1', company: 'ACME', email: 'a@acme.io', status: 'new' }),
    })
    vi.stubGlobal('fetch', fetchMock)

    renderPage()
    const user = userEvent.setup()
    await user.type(screen.getByLabelText(/entreprise/i), 'ACME')
    await user.type(screen.getByLabelText(/email professionnel/i), 'a@acme.io')
    await user.click(screen.getByRole('button', { name: /envoyer ma demande/i }))

    await waitFor(() =>
      expect(screen.getByRole('heading', { name: /merci/i })).toBeInTheDocument(),
    )
    expect(fetchMock).toHaveBeenCalledOnce()
  })
})