Не удается смоделировать щелчки формы в модульном тесте Redux-Form

Question

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

Тестовый фрагмент

import React from 'react';
import { AddBudgetForm } from '../../../src/Budget/components/AddBudgetForm';
import { SubmissionError } from 'redux-form';
import { shallow, configure } from 'enzyme';
import sinon from 'sinon';
import Adapter from 'enzyme-adapter-react-16';
configure({ adapter: new Adapter() });

describe("AddBudgetForm Component", () => {
  let budgetForm = null;
  let submitting, touched, error, reset,addBudget, addBudgetResponse, handleSubmit
  beforeEach(() => {
    submitting = false
    touched = false
    error = null
    reset = sinon.spy()
    addBudgetResponse = Promise.resolve()
    handleSubmit = fn => fn
  })
  const buildForm = () => {
    addBudget = sinon.stub().returns(addBudgetResponse)
    const props = {
      addBudget,
      submitting: submitting,
      fields: {
        budgetName: {
          value: '',
          touched: touched,
          error: error
        }
      },
      handleSubmit,
      reset
    }
    return shallow(<AddBudgetForm {...props}/>)
  }

  it ('Calls reset after onSave', () => {
    budgetForm = buildForm();
    budgetForm.find('[type="submit"]').simulate('submit')
  })

})

Выше я высмеиваю некоторые действия, и мой тест неизбежно просто проверит callCount из sinon spy,

форма

  submit(dataValues) {
    console.log("called")
    dataValues.preventDefault();
    this.props.addBudget({})

  }

  render() {
    const { handleSubmit } = this.props;
    return (
      <div className='form-group has-danger'>
         <form onSubmit={(e) => this.submit(e)}>
          <Field name='budgetName' component={this.categoryInput} placeholder="Enter Category of Budget" label="Budget Category"/>
          <button type='submit' className='btn btn-primary'>Submit</button>
        </form>
      </div>
    )
  }
}

Я немного сократил свой код, но идея в том, что onSubmit должен вызывать функцию, но я не могу даже заставить журнал консоли печатать. Не совсем уверен, почему это происходит.

Answer 1

Если вы хотите смоделировать событие отправки, вы должны выбрать тег формы. С кодом выше должен быть клик. Так:

budgetForm.find('[type="submit"]').simulate('click')