import React    from 'react';
import ReactDOM from 'react-dom';

import Modal    from './Modal';

import { cleanup, fireEvent, render} from '@testing-library/react'

describe('Modal', () => {
  afterEach(cleanup);

  it('renders without crashing', () => {
    const div = document.createElement('div');
    ReactDOM.render(<Modal/>, div);
    ReactDOM.unmountComponentAtNode(div);
  });


  it('renders correctly', () => {
    const div = document.createElement('div');
    const {getByText} = render(
      <Modal modal={true}>
        <div>Content</div>
      </Modal>, div
    )
    expect(getByText('Content')).toBeTruthy()
  });

  it('backdrop click calls openModal(false)', () => {
    const openModal = jest.fn();

    const div = document.createElement('div');
    const { getByRole } = render(
      <Modal modal={true} openModal={() => openModal(false)} >
        <div>Content</div>
      </Modal>, div
    );
    fireEvent.click(getByRole('complementary'));
    expect(openModal.mock.calls[0][0]).toBe(false);
    expect(openModal.mock.calls.length).toBe(1);
  });

});