veza/apps/web/src/components/ui/label.test.tsx

import { render, screen } from '@testing-library/react';
import { describe, it, expect } from 'vitest';
import { Label } from './label';

describe('Label Component', () => {
  it('renders label', () => {
    render(<Label>Test Label</Label>);

    const label = screen.getByText('Test Label');
    expect(label).toBeInTheDocument();
  });

  it('associates label with input via htmlFor', () => {
    render(
      <>
        <Label htmlFor="test-input">Test Label</Label>
        <input id="test-input" />
      </>,
    );

    const label = screen.getByText('Test Label');
    const input = screen.getByLabelText('Test Label');

    expect(label).toHaveAttribute('for', 'test-input');
    expect(input).toBeInTheDocument();
  });

  it('applies custom className', () => {
    render(<Label className="custom-label">Test Label</Label>);

    const label = screen.getByText('Test Label');
    expect(label).toHaveClass('custom-label');
  });

  it('handles required prop', () => {
    render(<Label required>Test Label</Label>);

    const label = screen.getByText('Test Label');
    expect(label).toBeInTheDocument();
    // Vérifier que le style required est appliqué si présent
  });

  it('handles disabled state', () => {
    render(<Label disabled>Disabled Label</Label>);

    const label = screen.getByText('Disabled Label');
    expect(label).toBeInTheDocument();
  });
});