import React, { PropTypes } from 'react';
import expect from 'expect';
import { shallow } from 'enzyme';
import TextInput from '../TextInput';

describe('TextInput', () => {
  it('renders a container element', () => {
    const component = shallow(<TextInput />);
    expect(component.find('.text-input-container').length).toBe(1);
  });

  it('renders an input element', () => {
    const component = shallow(<TextInput />);
    expect(component.find('input').length).toBe(1);
  });

  it('has displayName set', () => {
    expect(TextInput.displayName).toBe('TextInput');
  });

  describe('placeholder', () => {
    it('is set in propTypes declaration', () => {
      expect(TextInput.propTypes.placeholder).toEqual(PropTypes.string);
    });

    describe('when defined', () => {
      const placeholder = 'Placeholder';

      it('is set on the input element', () => {
        const component = shallow(<TextInput placeholder={placeholder} />);
        const inputElement = component.find('input');
        expect(inputElement.props().placeholder).toBe(placeholder);
      });
    });
  });

  describe('text', () => {
    it('is set in propTypes declaration', () => {
      expect(TextInput.propTypes.text).toEqual(PropTypes.string);
    });

    describe('when defined', () => {
      const text = 'Text';

      it('is set on the input element', () => {
        const component = shallow(<TextInput text={text} />);
        const inputElement = component.find('input');
        expect(inputElement.props().value).toBe(text);
      });
    });

    describe('when undefined', () => {
      const text = undefined;

      it('is not setting text undefined', () => {
        const component = shallow(<TextInput text={text} />);
        const inputElement = component.find('input');
        expect(inputElement.text()).toNotBe('undefined');
      });
    });
  });

  describe('name', () => {
    it('is set in propTypes declaration', () => {
      expect(TextInput.propTypes.name).toEqual(PropTypes.string);
    });

    describe('when defined', () => {
      const name = 'Name';

      it('is set on the input element', () => {
        const component = shallow(<TextInput name={name} />);
        const inputElement = component.find('input');
        expect(inputElement.props().name).toBe(name);
      });
    });
  });

  describe('onChange', () => {
    // TODO
  });
});

@@ -48,16 +48,31 @@
 t expect
+, %7B createSpy %7D
  from 'e
@@ -2378,15 +2378,545 @@
     
-// TODO
+it('is set in propTypes declaration', () =%3E %7B%0A      expect(TextInput.propTypes.onChange).toBe(PropTypes.func);%0A    %7D);%0A%0A    describe('when defined', () =%3E %7B%0A      const onChange = createSpy();%0A%0A      it('triggers the provided callback', () =%3E %7B%0A        const newValue = 'New value';%0A        const component = shallow(%3CTextInput onChange=%7BonChange%7D /%3E);%0A        const event = %7B target: %7B value: newValue %7D%7D;%0A        component.find('input').simulate('change', event);%0A        expect(onChange).toHaveBeenCalledWith(event);%0A      %7D);%0A    %7D);
 %0A  %7D

Add test for onChange on <TextInput />.