import React from 'react';
import ReactTestRenderer from 'react-test-renderer';
import Adapter from 'enzyme-adapter-react-16/build/index';
import Enzyme, { mount } from 'enzyme/build/index';
import { WelcomeModal } from 'app/modules/welcomePopUp/components/welcomeModal';
import { Provider } from 'react-redux';
import configureStore from 'redux-mock-store';
import { welcomePopupClose } from '../store/welcomePopup.actions';

Enzyme.configure({ adapter: new Adapter() });

jest.mock('app/modules/welcomePopUp/store/welcomePopup.selectors', () => ({
  selectWelcomePopupModalData: jest.fn(() => ({
    content: {
      isEnabled: true,
      releaseDate: '2022-01-13',
      version: 1,
      title: 'New release',
      description: 'Release description',
      changelog: [ 'New feature' ],
      incomingFeatures: [ 'IncomingFeature' ],
      footer: 'footer',
      videoLink: 'link to video',
      imageUrl: 'link to image',
    },
    isOpened: true,
  })),
}));

describe('Welcome modal tests', () => {
  const mockStore = configureStore();
  const store = mockStore({});

  it('renders correctly', () => {
    const tree = ReactTestRenderer
      .create(<Provider store={store}>
        <WelcomeModal />
      </Provider>)
      .toJSON();
    expect(tree).toMatchSnapshot();
  });

  it('trigger close modal action when overlay is clicked', () => {
    const component = mount(<Provider store={store}><WelcomeModal/></Provider>);

    component.find('.js-overlay-hit-area').simulate('click');
    expect(store.getActions()).toContainEqual(welcomePopupClose(true));
  });

  it('trigger close modal action when close button is clicked', () => {
    const component = mount(<Provider store={store}><WelcomeModal/></Provider>);

    component.find('.js-close-button-hit-area').simulate('click');
    expect(store.getActions()).toContainEqual(welcomePopupClose(true));
  });
});