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

import TutorialReferencePicker from '.';

describe('TutorialReferencePicker', () => {
  let node;
  let props;

  beforeEach(() => {
    props = {
      endpoints: [
        {
          categoryId: '1',
          title: 'Petstore',
          children: [
            {
              _id: '123',
              api: {
                apiSetting: '222',
                method: 'get',
              },
              title: 'Get Pets',
            },
          ],
        },
      ],
      referenceDisplay: ['123'],
      setReferenceSelection: jest.fn(),
    };
    node = mount(<TutorialReferencePicker {...props} />);
  });

  it('should display reference picker parent', () => {
    expect(node.find('.TutorialReferencePicker').length).toBeGreaterThan(0);
  });

  it('should display reference picker child', () => {
    const item = node.find('.Menu-Item_arrow').first();
    item.simulate('click');

    const header = node.find('.TutorialReferencePicker-Header');
    expect(header).toHaveLength(1);
  });

  it('should close submenu on parent click', () => {
    const item = node.find('.Menu-Item_arrow').first();
    item.simulate('click');

    const subItem = node.find('MenuItem').at(0);
    subItem.simulate('click');

    const header = node.find('.TutorialReferencePicker-Header');
    expect(header).toHaveLength(0);
  });

  it('should propogate selection to parent', () => {
    const item = node.find('.Menu-Item_arrow').first();
    item.simulate('click');

    const subItem = node.find('MenuItem').at(1);
    subItem.simulate('click');
    expect(props.setReferenceSelection).toHaveBeenCalledWith('123');
  });
});
