import { Typography } from '../common';
import { render, screen } from '../test-utils';

import Body from '.';

describe('Body', () => {
  it('testing default state', () => {
    render(<Body>Test</Body>);
    const copy = screen.getByText('Test');
    expect(copy).toBeInTheDocument();
    expect(copy.tagName).toBe('DIV');
    expect(copy).toHaveClass(`np-text-${Typography.BODY_DEFAULT}`);
  });

  it('enforces tag via `as` prop', () => {
    render(<Body as="p">Test</Body>);
    const copy = screen.getByText('Test');
    expect(copy).toBeInTheDocument();
    expect(copy.tagName).toBe('P');
    expect(copy).toHaveClass(`np-text-${Typography.BODY_DEFAULT}`);
  });

  it('supports native HTML attrs', () => {
    render(
      <Body id="test-id" role="banner">
        Test
      </Body>,
    );
    const copy = screen.getByText('Test');
    expect(copy).toBeInTheDocument();
    expect(copy).toHaveAttribute('id', 'test-id');
    expect(copy).toHaveAttribute('role', 'banner');
  });

  it('renders newlines as line breaks when preserveNewlines is true', () => {
    render(<Body preserveNewlines>{'Line 1.\nLine 2'}</Body>);
    const copy = screen.getByText(/Line 1\.\s*Line 2/);
    expect(copy).toHaveClass('np-text--pre-line');
    expect(copy).toHaveTextContent('Line 1.');
    expect(copy).toHaveTextContent('Line 2');
  });

  it('handles unsupported typography type', () => {
    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
    // @ts-expect-error
    render(<Body type={Typography.TITLE_SCREEN}>Test</Body>);
    const copy = screen.getByText('Test');
    expect(copy).toBeInTheDocument();
    expect(copy.tagName).toBe('DIV');
    expect(copy).toHaveClass(`np-text-${Typography.BODY_DEFAULT}`);
  });
});
