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

describe('MessageComposer', () => {
  it('disables Send when textarea is empty', () => {
    render(<MessageComposer onSend={() => {}} />);
    expect(screen.getByRole('button', { name: /Send/ })).toBeDisabled();
  });

  it('calls onSend with the trimmed body and clears the field', () => {
    const onSend = vi.fn();
    render(<MessageComposer onSend={onSend} />);
    fireEvent.change(screen.getByLabelText(/Message/i), {
      target: { value: '  hello  ' },
    });
    fireEvent.click(screen.getByRole('button', { name: /Send/ }));
    expect(onSend).toHaveBeenCalledWith('hello');
    expect((screen.getByLabelText(/Message/i) as HTMLTextAreaElement).value).toBe('');
  });

  it('enforces the 5000-char cap visually', () => {
    render(<MessageComposer onSend={() => {}} />);
    const textarea = screen.getByLabelText(/Message/i) as HTMLTextAreaElement;
    expect(textarea.maxLength).toBe(5000);
  });
});