Предотвратить проблему по умолчанию в компоненте React

Question

У меня довольно простой компонент React.Я пытаюсь создать форму, которая представляет.Когда форма отправляется, я пытаюсь запретить поведение при отправке по умолчанию, как в React.

Вот весь компонент (здесь есть избыточность, но для этого вопроса это не должно иметь значения):

import React from "react"; 
import { connect } from 'react-redux'; 

export class App extends React.Component {

    handleSubmit(e) {
        e.preventDefault();
        this.props.dispatch(); 
    }

    render() {
        return (
            <div>
                <header role="banner">
                    <h1>Welcome</h1>
                    <p>{this.props.data}</p>
                </header>
                <form onSubmit={e => this.handleSubmit(e)}></form>
            </div>
        )
    }
}

const mapStateToProps = state => ({
    data: state.data
}); 

export default connect(mapStateToProps)(App); 

Когда я запускаю свои тесты, я получаю следующее:

TypeError: Cannot read property 'preventDefault' of undefined

Игнорировать пустую отправку.Мне нужно, чтобы это прошло первым.Что тут происходит?Какие-нибудь мысли?

Вот полная ошибка:

TypeError: Cannot read property 'preventDefault' of undefined

   5 |     
   6 |     handleSubmit(event) {
>  7 |         event.preventDefault();
   8 |         this.props.dispatch(); 
   9 |     }
  10 |     

Вот тест:

it('dispatches an action when form is submitted', () => {
    const spy = jest.fn(); 
    const wrapper = shallow(<App dispatch={spy} />); 
    const form = wrapper.find('form'); 
    form.simulate('submit'); 
    expect(spy).toHaveBeenCalled(); 
}); 

Answer 1

Фермент simulate не высмеивает объект события, но вы можете передать его самостоятельно (см. документы для simulate), например:

const mockEvent = { preventDefault: jest.fn() };
form.simulate('submit', mockEvent);