import React from 'react';
import Register from '../../components/Register/Register';
import { users } from '../../seed/virtualDatabases';
import { shallow } from 'enzyme';
import thunk from 'redux-thunk';
import configureMockStore from 'redux-mock-store';

const createMockStore = configureMockStore([thunk]);

let store, history, registerUser, startFetchUsers, wrapper, event;

beforeEach(() => {
  history = {
    push: jest.fn()
  }
  registerUser = jest.fn();
  startFetchUsers= jest.fn();

  store = createMockStore({users: []});

  event = {
    preventDefault: () => {},
    target: {
      elements: {
        username: {value: 'abc'},
        fullname: {value: 'abc'},
        email: {value: 'abc@gmail.com'},
        password: {value: 'Hello123'}
      }
    }
  }

  wrapper = shallow (
    <Register
      history={history}
      startFetchUsers={startFetchUsers}
      registerUser={registerUser}
      store={store}
    />
  ).dive();
})

describe('Register Page', () => {
  test('Register page should render correcly', () => {
    expect(wrapper).toMatchSnapshot();
  })

  test('showTerm state should change correctly', () => {
    wrapper.find('p').simulate('click');
    expect(wrapper.state('showTerm')).toBe(true);
    wrapper.find('p').simulate('click');
    expect(wrapper.state('showTerm')).toBe(false);
  })

  test('Testing on submit with invalid input', () => {
    const errorList = [
      "Username can not be empty.",
      "Fullname can not be empty.",
      "Email can not be empty.",
      "Password can not be empty."
    ];
    let i = 0;
    for (const prop in event.target.elements) {
      const tmp = event.target.elements[prop].value;
      event.target.elements[prop].value = ' ';
      wrapper.find('form').at(0).simulate('submit', event);
      event.target.elements[prop].value = tmp;
      expect(wrapper.state('error')).toBe(errorList[i])
      i++;
    }
  })

  test('Testing on submit with valid input', async (done) => {
    await wrapper.find('form').at(0).simulate('submit', event);
    expect(wrapper.state('error')).toBe(undefined);
    expect(history.push).toHaveBeenLastCalledWith('/');
    expect(registerUser).toHaveBeenCalled();
    done();
  })
})