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

describe('Button', () => {
  it('defaults to a solid accent md button and fires onClick', () => {
    const onClick = vi.fn()
    render(<Button onClick={onClick}>Fixture</Button>)

    const button = screen.getByRole('button', { name: 'Fixture' })
    expect(button).toHaveAttribute('type', 'button')
    expect(onClick).not.toHaveBeenCalled()
    fireEvent.click(button)
    expect(onClick).toHaveBeenCalledTimes(1)
  })

  it('applies variant and tone mapping without throwing', () => {
    render(
      <Button variant="outline" tone="danger" size="sm" data-testid="fixture-outline-danger">
        Stop
      </Button>,
    )

    const button = screen.getByTestId('fixture-outline-danger')
    expect(button).toBeInTheDocument()
    expect(button).toHaveTextContent('Stop')
  })

  it('applies ghost neutral variants without throwing', () => {
    render(
      <Button variant="ghost" tone="neutral" data-testid="fixture-ghost-neutral">
        Keep running
      </Button>,
    )

    const button = screen.getByTestId('fixture-ghost-neutral')
    expect(button).toBeInTheDocument()
  })

  it('merges className, passes through disabled and data-* attributes', () => {
    render(
      <Button className="mt-2" disabled data-testid="fixture-disabled">
        Disabled fixture
      </Button>,
    )

    const button = screen.getByTestId('fixture-disabled')
    expect(button).toBeDisabled()
    expect(button).toHaveClass('mt-2')
  })

  it('supports type=submit passthrough', () => {
    render(<Button type="submit">Send</Button>)
    expect(screen.getByRole('button', { name: 'Send' })).toHaveAttribute('type', 'submit')
  })
})