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

import { BlockContent } from './BlockContent';

describe('BlockContent component', () => {
  const BLOCK_FIXTURE = [
    {
      name: 'storyshare/paragraph',
      attributes: { content: 'test' },
    },
  ];

  const MULTIPLE_BLOCK_FIXTURE = [
    ...BLOCK_FIXTURE,
    {
      name: 'storyshare/paragraph',
      attributes: { content: 'other' },
    },
  ];

  let wrapper;

  beforeEach(() => {
    wrapper = shallow(
      <BlockContent blocks={ [] } />
    );
  });

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

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

  it('can render a block', () => {
    wrapper.setProps({ blocks: BLOCK_FIXTURE });
    expect(wrapper.find('Paragraph')).toExist();
  });

  it('passes props to the block', () => {
    wrapper.setProps({ blocks: BLOCK_FIXTURE });
    expect(wrapper.find('Paragraph')).toHaveProp('content', 'test');
  });

  it('can render multiple blocks', () => {
    wrapper.setProps({ blocks: MULTIPLE_BLOCK_FIXTURE });
    const paragraphs = wrapper.find('Paragraph');
    expect(paragraphs).toHaveLength(2);
    expect(paragraphs.first()).toHaveProp('content', 'test');
    expect(paragraphs.last()).toHaveProp('content', 'other');
  });

  it('copes if the block cannot be found', () => {
    wrapper.setProps({ blocks: [{ name: 'unknown', attributes: { } }] });
    expect(wrapper.children()).not.toExist();
  });
});
