import React from 'react';
import { shallow } from 'enzyme';

import Dropdown from '.';

describe('Dropdown', () => {
  const node = shallow(<Dropdown>Hello, world.</Dropdown>);

  it('to display a .Dropdown element.', () => {
    expect(node.hasClass('Dropdown')).toBe(true);
  });

  it('to toggle the inner .Dropdown-content child on click.', () => {
    node.find('.Dropdown-toggle').simulate('click');
    expect(node.hasClass('Dropdown_opened')).toBe(true);
  });

  it('to toggle the inner .Dropdown-content child on keydown.', () => {
    node.find('.Dropdown-toggle').simulate('keypress');
    expect(node.hasClass('Dropdown_opened')).toBe(true);
  });

  it('to toggle the inner .Dropdown-content child on focus.', () => {
    node.find('.Dropdown').simulate('focus');
    expect(node.hasClass('Dropdown_opened')).toBe(true);
  });

  it('to toggle the inner .Dropdown-content child on hover.', () => {
    node.find('.Dropdown').simulate('mouseenter');
    expect(node.hasClass('Dropdown_opened')).toBe(true);
  });

  it('should pass toggle value to callback if callback exists', () => {
    const props = { onToggle: jest.fn() };
    const n2 = shallow(<Dropdown {...props}>Hello, world.</Dropdown>);

    n2.find('.Dropdown-toggle').simulate('click');
    expect(props.onToggle).toHaveBeenCalled();
  });
});
