import React from 'react';
import { render, cleanup } from '@testing-library/react';
import '@testing-library/jest-dom/extend-expect';

import ProsCons from '.';

describe('ProsCons Component', () => {
  test('render with props', () => {
    const { container, getByText } = render(
      <ProsCons
        pros="Pros Title"
        cons="Cons Title"
        icons={[<i className="pros-icon" />, <i className="cons-icon" />]}
        module={{ pros: ['p1', 'p2', 'p3'], cons: ['c1', 'c2'] }}
      />
    );
    expect(container.querySelectorAll('i.pros-icon')).toHaveLength(1);
    expect(container.querySelectorAll('i.cons-icon')).toHaveLength(1);
    expect(getByText('Pros Title')).toBeTruthy();
    expect(getByText('Cons Title')).toBeTruthy();
    expect(container.querySelectorAll('div.pros li')).toHaveLength(3);
    expect(container.querySelectorAll('div.cons li')).toHaveLength(2);
    expect(getByText('p3')).toBeTruthy();
    expect(getByText('c2')).toBeTruthy();
  });
});
afterEach(() => {
  cleanup();
});
