import React from 'react';
import { shallow, mount } from 'enzyme';
import { Pane } from 'web-foundation';

describe('<Pane />', function() {
    it('should initialize properly', function() {
        const wrapper = shallow(<Pane />);

        expect(wrapper.find('.pane')).to.have.length(1);
        expect(wrapper.find('.wrapper')).to.have.length(1);
    });

    it('should accept additional class names', function() {
        const wrapper = shallow(<Pane className="foo" />);

        expect(wrapper.find('.foo')).to.have.length(1);
    });

    it('should open and close when told to', function() {
        const wrapper = shallow(<Pane />);

        expect(wrapper.find('.pane.open')).to.have.length(0);

        wrapper.setProps({ isOpen: true });
        expect(wrapper.find('.pane.open')).to.have.length(1);

        wrapper.setProps({ isOpen: false });
        expect(wrapper.find('.pane.open')).to.have.length(0);
    });

    it('should render props correctly', function() {
        const wrapper = mount(
            <Pane
                header="foo"
                fromSide="right" />
        );

        expect(wrapper.find('.wrapper.right')).to.have.length(1);
        expect(wrapper.find('.header').text()).to.match(/foo/);
    });

    it('should call callback when closed', function() {
        const spy = sinon.spy(),
            wrapper = mount(<Pane onClickClose={ spy } />);

        wrapper.setProps({ isOpen: true });
        wrapper.find('.button').simulate('click');
        expect(spy.calledOnce).to.be.true;

        // should not trigger if is closed already
        wrapper.setProps({ isOpen: false });
        wrapper.find('.button').simulate('click');
        expect(spy.calledTwice).to.be.false;
    });

    it('should unmount without errors', function() {
        const wrapper = mount(<Pane isOpen />);

        wrapper.instance().componentWillUnmount();
    });
});
