import { describe, it, expect, vi } from 'vitest'
import { render, screen } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import { Dropdown } from './Dropdown'

const items = [
  { label: 'Edit', onClick: vi.fn() },
  { label: 'Delete', onClick: vi.fn() },
]

describe('Dropdown', () => {
  it('does not show menu initially', () => {
    render(<Dropdown trigger={<button>Actions</button>} items={items} />)
    expect(screen.queryByText('Edit')).not.toBeInTheDocument()
  })

  it('shows menu on trigger click', async () => {
    const user = userEvent.setup()
    render(<Dropdown trigger={<button>Actions</button>} items={items} />)
    await user.click(screen.getByText('Actions'))
    expect(screen.getByText('Edit')).toBeInTheDocument()
  })

  it('closes on Esc', async () => {
    const user = userEvent.setup()
    render(<Dropdown trigger={<button>Actions</button>} items={items} />)
    await user.click(screen.getByText('Actions'))
    await user.keyboard('{Escape}')
    expect(screen.queryByText('Edit')).not.toBeInTheDocument()
  })

  it('calls item onClick when clicked', async () => {
    const user = userEvent.setup()
    render(<Dropdown trigger={<button>Actions</button>} items={items} />)
    await user.click(screen.getByText('Actions'))
    await user.click(screen.getByText('Edit'))
    expect(items[0].onClick).toHaveBeenCalled()
  })
})
