import { render } from '@testing-library/vue';
import { describe, expect, test } from 'vitest';
import UiLabel from '../UiLabel.vue';

describe('UiLabel', () => {
  test('renders label with text content', () => {
    const labelText = 'Email';
    const { getByText } = render(UiLabel, {
      slots: { default: labelText },
    });
    expect(getByText(labelText)).toBeInTheDocument();
  });

  test('renders label with for attribute', () => {
    const forValue = 'email-input';
    const { container } = render(UiLabel, {
      props: { for: forValue },
      slots: { default: 'Email' },
    });
    const label = container.querySelector('label');
    expect(label).toHaveAttribute('for', forValue);
  });

  test('applies custom class', () => {
    const customClass = 'custom-label-class';
    const { container } = render(UiLabel, {
      props: { class: customClass },
      slots: { default: 'Email' },
    });
    const label = container.querySelector('label');
    expect(label).toHaveClass(customClass);
  });

  test('renders slot content', () => {
    const { getByText, getByTestId } = render(UiLabel, {
      slots: {
        default: '<span data-testid="slot-content">Custom Content</span>',
      },
    });
    expect(getByTestId('slot-content')).toBeInTheDocument();
    expect(getByText('Custom Content')).toBeInTheDocument();
  });
});
