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

import childrenFromHtml from '../../childrenFromHtml';
import { List } from './List';

jest.mock('../../childrenFromHtml');

describe('List block', () => {
  const CHILDREN_FIXTURE = ['test-children'];

  const CONTENT_FIXTURE = 'test-content';

  let wrapper;

  beforeEach(() => {
    childrenFromHtml.mockReturnValue(CHILDREN_FIXTURE);
    wrapper = shallow(
      <List content={ CONTENT_FIXTURE } ordered={ false } />
    );
  });

  it('renders', () => {
    expect(wrapper).toExist();
  });

  it('renders List from semantic', () => {
    expect(wrapper.find('List')).toExist();
  });

  it('renders List with ordered prop as false if ordered is false', () => {
    expect(wrapper.find('List')).toHaveProp('ordered', false);
  });

  it('renders List with bulleted prop as true if ordered is false', () => {
    expect(wrapper.find('List')).toHaveProp('bulleted', true);
  });

  it('renders List with ordered prop as true if ordered is true', () => {
    wrapper.setProps({ ordered: true });

    expect(wrapper.find('List')).toHaveProp('ordered', true);
  });

  it('renders List with bulleted prop as false if ordered is true', () => {
    wrapper.setProps({ ordered: true });

    expect(wrapper.find('List')).toHaveProp('bulleted', false);
  });

  it('renders RichText', () => {
    expect(wrapper.find('RichText')).toExist();
  });

  it('converts content into children for the RichText component', () => {
    childrenFromHtml.mockClear();
    wrapper.setProps(); // trigger rerender
    expect(childrenFromHtml).toHaveBeenCalled();
    expect(childrenFromHtml).toHaveBeenCalledWith(CONTENT_FIXTURE);
  });

  it('passes converted children to the RichText component', () => {
    expect(wrapper.find('RichText')).toHaveProp('children', CHILDREN_FIXTURE);
  });
});
