反应formik，测试是否在单击时调用了提交功能-开玩笑，酶

Question

我正在测试一个包含表单的react组件（使用formik），我需要测试是否单击了提交按钮，是否调用了提交功能。

此刻，测试失败。 现在，表单也使用yup来填写必填字段架构 因此，我想知道在测试之前是否需要填写所有字段。 因为此刻它不会提交，直到表单出现错误，即必填字段为空。这样会阻碍按钮单击和调用功能的测试吗？

SystemStackError

然后在测试之前如何填写这些字段？还是我需要在点击测试之前填写这些字段？

Answer 1

您需要一种方法将您的模拟 handleSubmit 函数传递给您的 ExampleButton

<块引用>

如果 ExampleButton 有 onSubmit 事件处理程序属性，这会更容易：

// ExampleButton.jsx
const ExampleButton = ({ onSubmit }) => <button type="submit" onClick={onSubmit} />;

// ExampleButton.test.jsx
const handleSubmit = jest.fn();
...
wrapper = mount(<ExampleButton onSubmit={handleSubmit} />);

<块引用>

如果 ExampleButton 有内部事件处理函数，有点棘手

// ExampleButton.jsx
const ExampleButton = () => {
  const handleSubmit = (params) => {...}
  return <button type="submit" onClick={handleSubmit} />;
}

// ExampleButton.test.jsx
wrapper = mount(<ExampleButton onSubmit={handleSubmit} />);
wrapper.find('button').simulate('click', mockParams);