import { render, screen } from '../../test-utils';
import userEvent from '@testing-library/user-event';
import { ListItem, type ListItemProps } from '../ListItem';

describe('ListItem.Radio', () => {
  const renderWith = (overrides: Partial<ListItemProps> = {}) =>
    render(<ListItem title="Test Title" {...overrides} />);

  it('renders radio button', () => {
    renderWith({
      control: <ListItem.Radio name="test-radio" value="option1" onChange={() => {}} />,
    });

    expect(screen.getByRole('radio')).toBeInTheDocument();
  });

  describe('checked state', () => {
    it('reflects checked state', () => {
      renderWith({
        control: <ListItem.Radio name="test-radio" value="option1" checked />,
      });

      expect(screen.getByRole('radio')).toBeChecked();
    });

    it('reflects unchecked state', () => {
      renderWith({
        control: <ListItem.Radio name="test-radio" value="option1" checked={false} />,
      });

      expect(screen.getByRole('radio')).not.toBeChecked();
    });
  });

  it('handles onChange events', async () => {
    const handleChange = jest.fn();
    renderWith({
      control: <ListItem.Radio name="test-radio" value="option1" onChange={handleChange} />,
    });

    await userEvent.click(screen.getByRole('radio'));
    expect(handleChange).toHaveBeenCalledTimes(1);
  });

  it('is disabled when ListItem is disabled', async () => {
    const handleChange = jest.fn();
    renderWith({
      disabled: true,
      control: <ListItem.Radio name="test-radio" value="option1" onChange={handleChange} />,
    });

    const radio = screen.getByRole('radio');
    expect(radio).toBeDisabled();
    await userEvent.click(radio);
    expect(handleChange).not.toHaveBeenCalled();
  });

  it('supports name and value attributes', () => {
    renderWith({ control: <ListItem.Radio name="test-radio" value="option1" /> });

    const radio = screen.getByRole('radio');
    expect(radio).toHaveAttribute('name', 'test-radio');
    // eslint-disable-next-line jest-dom/prefer-to-have-value
    expect(radio).toHaveAttribute('value', 'option1');
  });
});