// @flow
import React from 'react';
import { StyleSheet } from 'react-native';
import { shallow } from 'enzyme';
import TextFieldLabel from './TextFieldLabel';
import styles from './TextFieldLabel.styles';
import { border, colors } from '../Utils/Theme';

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

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

  it('has a text', () => {
    wrapper.setProps({ text: 'Title' });
    expect(wrapper.find('Typography')).toHaveProp('text', 'Title');
  });

  it('has a default color', () => {
    expect(wrapper.find('Typography')).toHaveProp('color', border.color);
  });

  it('has a default font size', () => {
    expect(wrapper.find('Typography')).toHaveProp('size', null);
  });

  it('when is focused color is primary', () => {
    wrapper.setProps({ isFocused: true });
    expect(wrapper.find('Typography')).toHaveProp('color', colors.primary);
  });

  it('when is raised font size decreases', () => {
    wrapper.setProps({ isRaised: true });
    expect(wrapper.find('Typography')).toHaveProp('size', 10);
  });

  it('when is raised applies styles', () => {
    wrapper.setProps({ isRaised: true });
    expect(wrapper.find('View'))
      .toHaveProp('style', expect.objectContaining(StyleSheet.flatten(styles.raised) || {}));
  });
});
