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

import { TruncateWithTooltip } from './truncate-with-tooltip';

describe('TruncateWithTooltip', () => {
  it('renders children text', () => {
    render(<TruncateWithTooltip>Hello World</TruncateWithTooltip>);
    expect(screen.getByText('Hello World')).toBeInTheDocument();
  });

  it('UI-006: always sets title attribute for keyboard/non-hover accessibility', () => {
    render(<TruncateWithTooltip>Full text content</TruncateWithTooltip>);
    const span = screen.getByText('Full text content');
    expect(span).toHaveAttribute('title', 'Full text content');
  });

  it('UI-006: sets title when disableTooltip is true', () => {
    render(<TruncateWithTooltip disableTooltip>Full text content</TruncateWithTooltip>);
    const span = screen.getByText('Full text content');
    expect(span).toHaveAttribute('title', 'Full text content');
  });

  it('UI-006: sets title when disableTooltip is false (default)', () => {
    render(<TruncateWithTooltip disableTooltip={false}>Some long text</TruncateWithTooltip>);
    const span = screen.getByText('Some long text');
    expect(span).toHaveAttribute('title', 'Some long text');
  });

  it('applies truncate CSS class', () => {
    render(<TruncateWithTooltip>text</TruncateWithTooltip>);
    const span = screen.getByText('text');
    expect(span).toHaveClass('truncate');
  });

  it('applies default max-width class', () => {
    render(<TruncateWithTooltip>text</TruncateWithTooltip>);
    const span = screen.getByText('text');
    expect(span.className).toContain('max-w-[200px]');
  });

  it('applies custom maxWidth class', () => {
    render(<TruncateWithTooltip maxWidth="max-w-xs">text</TruncateWithTooltip>);
    const span = screen.getByText('text');
    expect(span).toHaveClass('max-w-xs');
  });

  it('applies additional className', () => {
    render(<TruncateWithTooltip className="extra-class">text</TruncateWithTooltip>);
    const span = screen.getByText('text');
    expect(span).toHaveClass('extra-class');
  });

  it('wraps with Tooltip when disableTooltip is false', () => {
    const { container } = render(<TruncateWithTooltip>text</TruncateWithTooltip>);
    // TooltipProvider renders a wrapping element
    expect(container.firstChild).toBeTruthy();
  });

  it('renders without Tooltip wrapper when disableTooltip is true', () => {
    const { container } = render(<TruncateWithTooltip disableTooltip>text</TruncateWithTooltip>);
    // Direct span, no tooltip provider wrapper
    expect(container.firstChild?.nodeName).toBe('SPAN');
  });
});