import React from 'react';
import renderWithTheme from '../../../testUtils/renderWithTheme';

import Count from '../Count';

describe('rendering', () => {
  it('renders badge content', () => {
    const { queryByText } = renderWithTheme(
      <Count content={99}>Count content</Count>
    );

    expect(queryByText('99')).toBeInTheDocument();
    expect(queryByText('Count content')).toBeInTheDocument();
  });

  it('renders overflow number', () => {
    const { queryByText } = renderWithTheme(
      <Count content={100}>Count content</Count>
    );

    expect(queryByText('99+')).toBeInTheDocument();
    expect(queryByText('Count content')).toBeInTheDocument();
  });

  it('renders icon badge', () => {
    const { getByTestId } = renderWithTheme(
      <Count content="clock">Count Icon Badge</Count>
    );

    expect(getByTestId('count-icon-badge')).toBeInTheDocument();
  });
});