// @flow
import React from 'react';
import { mountWrappedComponent, renderSnapshot } from '../../../../utils/tests';
import { FormRow } from '../forms.common';
import type { FormListProps } from './form-list.proptypes';
import { FormList } from './index';

const DEFAULT_PROPS: FormListProps = {
  items: [
    <div>
      <span>first item</span>
    </div>,
    <div>
      <span>second item</span>
    </div>,
    <div>
      <span>third item</span>
    </div>,
  ],
};

describe('FormList', () => {
  describe('snapshot', () => {
    it('matches the previous snapshot', () => {
      const formList = renderSnapshot(<FormList {...DEFAULT_PROPS} />);
      expect(formList).toMatchSnapshot();
    });
  });

  it('renders list items with valid props', () => {
    const formList = mountWrappedComponent(<FormList {...DEFAULT_PROPS} />);

    const items = formList.find(FormRow).children();
    items.forEach((item, index) => {
      expect(item.props()).toEqual(
        expect.objectContaining({
          isLast: expect.any(Boolean),
          stacked: 'column',
          justify: 'center',
          children: DEFAULT_PROPS.items[index],
        }),
      );
    });
  });
});
