Enzyme Stuff

Input Change Event

Simulate the change event on an <input />

jsx
const wrapper = shallow(<ComponentThatRendersAnInput />)
const inputWrapper = wrapper.find('input[type="email"]')
// Change `target` to `currentTarget` if you're updating state based on that instead
inputWrapper.simulate('change', {
  target: { value: 'soorria.ss@gmail.com' },
})

Form Submit Event

Simulate the submit event on a <form />.

jsx
const noop = () => {}
const wrapper = shallow(<ComponentThatRendersAForm />)
const formWrapper = wrapper.find('form')
formWrapper.simulate('submit', { preventDefault: noop })

Warning

  • Unfortunately this does not work properly if you're using FormData 😔
  • You can't test submitting a form by clicking a button / input with type="submit" due to events not working the same in jsdom
Created 02/20/22 • Updated 11/30/22
Found a mistake, or want to suggest an improvement? Edit on GitHub here
and see edit history here