import { shallow } from 'enzyme';
import React from 'react';
import testId from '../../main/tests/testIdSelector';
import ButtonsContainer from '../ButtonsContainer';

type ShallowComponentType = ShallowWrapper<any, any, ButtonsContainer>;

describe('ButtonsContainer', () => {
  let component: any;

  beforeEach(() => {
    component = createComponent();
  });

  it('should initially have the left button visible', () => {
    expect(component.instance().state.leftButtonVisible).toBeTruthy();
  });

  describe('given visible left button', () => {
    describe('when switching to right button visible', () => {
      beforeEach(() => {
        component.instance().updateVisibleButton();
      });

      it('should hide the left button', () => {
        expect(component.instance().state.leftButtonVisible).toBeFalsy();
      });

      it('should display the right button', () => {
        expect(component.instance().state.rightButtonVisible).toBeTruthy();
      });
    });
  });

  function createComponent(state?: any): ShallowComponentType {
    const wrapper = shallow<ButtonsContainer>(<ButtonsContainer />);
    wrapper.setState(state);

    return wrapper;
  }
});