Тестовая форма реакции - AssertionError

Я пытаюсь протестировать щелчок по компоненту реакции, который отображает форму, но не проходит третий тест со следующей ошибкой

AssertionError: ожидалось, что [Function: proxy] будет иметь свойство callCount, равное 1, но получено 0

Вот тест, который я написал:

form.test.js

describe('<Form />', () => {
  it('renders without exploding', () => {
    shallow(<Form />);
  });

  it('renders an `.login_form`', () => {
    const wrapper = shallow(<Form />);
    expect(wrapper.find('.login_form')).to.have.length(1);
  });

  it('simulates click events', () => {
    const onButtonClick = sinon.spy();
    const wrapper = shallow(
      <Form handleSubmit={ onButtonClick } />,
   );
    wrapper.find('.submitBtn').simulate('click');
    expect(onButtonClick).to.have.property('callCount', 1);
  });
});

и сам компонент:

form.jsx

function Form(props) {
  return (
    <form onSubmit={ props.handleSubmit } className='form-horizontal login_form'>
      <div className='form-group'>
        <div className='col-md-offset-4 col-md-4 col-xs-12'>
          <input className='form-control' type='text' id='username' value={ props.username } onChange={ props.handleUsername } placeholder='Username' required />
        </div>
      </div>
      <div className='form-group'>
        <div className='col-md-offset-4 col-md-4 col-xs-12'>
          <input className='form-control' type='password' id='password' value={ props.password } onChange={ props.handlePassword } placeholder='Password' required />
        </div>
      </div>
      <div className='form-group'>
        <div className='col-md-offset-4 col-md-4 col-xs-12'>
          <button className='btn btn-block btn-default submit submitBtn' type='submit'>Log in</button>
              {
                 props.error !== '' &&
                 <p className='login_error no-margin'>
                   {props.error}
                 </p>
               }
        </div>
      </div>
    </form>
  );
}

Form.propTypes = {
  username: React.PropTypes.string,
  password: React.PropTypes.string,
  error: React.PropTypes.string,
  handleUsername: React.PropTypes.func,
  handlePassword: React.PropTypes.func,
  handleSubmit: React.PropTypes.func,
};

export default Form;

Что я пытаюсь сделать здесь, так это то, что я хочу проверить, что при нажатии кнопки входа в систему вызывается обработчик onSubmit. Что я здесь делаю?


person rizvified    schedule 25.04.2017    source источник


Ответы (1)


Попробуйте отправить форму следующим образом:

wrapper.find("form").simulate("submit");
person luboskrnac    schedule 25.04.2017