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

import Counter from '.';

describe('Counter Component', () => {
  test('render with props', () => {
    const { container, getByText } = render(
      <Counter
        module={{
          items: [
            { title: 'one', value: 30 },
            { title: 'two', value: 40 },
          ],
          content: 'Content for the counter module',
        }}
      />
    );

    expect(container).toBeTruthy();
    expect(container.querySelectorAll('ul.counter')).toHaveLength(1);
    expect(container.querySelectorAll('div.title')).toHaveLength(2);
    expect(container.querySelectorAll('div.value')).toHaveLength(2);
    expect(getByText('Content for the counter module')).toBeTruthy();
    expect(getByText('one')).toBeTruthy();
    expect(getByText('two')).toBeTruthy();
  });
});
afterEach(() => {
  cleanup();
});
