// @flow
import React from 'react';
import { StyleSheet } from 'react-native';
import { shallow } from 'enzyme';
import ListItemText from './ListItemText';
import styles from './ListItemText.styles';

describe('ListItemText component', () => {
  let wrapper;

  beforeEach(() => {
    wrapper = shallow(<ListItemText />);
  });

  it('has text', () => {
    const primaryText = 'Single-line text';
    wrapper.setProps({ primaryText });
    expect(wrapper.find('Text').dive()).toHaveText(primaryText);
  });

  it('can have more text', () => {
    const primaryText = 'Two-line text';
    const secondaryText = 'Secondary text';
    wrapper.setProps({ primaryText, secondaryText });
    expect(wrapper.find('Text').at(0).dive()).toHaveText(primaryText);
    expect(wrapper.find('Text').at(1).dive()).toHaveText(secondaryText);
  });

  it('can be dense', () => {
    const primaryText = 'Two-line text';
    const secondaryText = 'Secondary text';
    wrapper.setProps({ dense: true, primaryText, secondaryText });
    expect(wrapper.find('Text').at(0).prop('style'))
      .toEqual(expect.objectContaining(StyleSheet.flatten(styles.dense) || {}));
    expect(wrapper.find('Text').at(1).prop('style'))
      .toEqual(expect.objectContaining(StyleSheet.flatten(styles.dense) || {}));
  });

  it('forwards layout event', () => {
    const secondaryText = 'Secondary text';
    wrapper.setProps({ secondaryText });
    wrapper.find('View').at(1).simulate('layout');
    const onLayout = jest.fn();
    wrapper.setProps({ onLayout });
    const view = wrapper.find('View').at(1);
    expect(view).toHaveProp('onLayout', onLayout);
    view.simulate('layout');
    expect(onLayout).toHaveBeenCalled();
  });
});
