テストは、フォームに反応 - AssertionErrorを

Question

私は、フォームをレンダリングする反応コンポーネントのクリックをテストしようとしているが、しかし、それは次のようなエラー

AssertionError: expected [Function: proxy] to have a property 'callCount' of 1, but got 0

で3番目のテストを失敗した、ここで私が書いたテストです：

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ハンドラが呼び出されることをテストしたいということです。私はここで何をしていますか？

Answer 1

は、フォームをこのように提出してください：

wrapper.find("form").simulate("submit");