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

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

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

    it('should have a default \'card\' class', function() {
        const wrapper = shallow(<Card />);

        expect(wrapper.hasClass('card')).to.be.true;
    });

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

        expect(wrapper.hasClass('foo')).to.be.true;
    });

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

        expect(wrapper.hasClass('open')).to.be.false;

        wrapper.setProps({ isOpen: true });
        expect(wrapper.hasClass('open')).to.be.true;

        wrapper.setProps({ isOpen: false });
        expect(wrapper.hasClass('open')).to.be.false;
    });

    it('should render props correctly', function() {
        const buttons = [
                <button/>,
                <button/>
            ],
            wrapper = mount(
                <Card header="header text"
                    left={ buttons[0] }
                    right={ buttons[1] } />);

        expect(wrapper.contains(buttons[0])).to.be.true;
        expect(wrapper.contains(buttons[1])).to.be.true;
        expect(wrapper.find('.header').find('.container').text())
            .to.equal('header text');
    });
});
