jestjs - Formik，开 Jest ，是的 : how to test validation?

Question

我找不到测试表单是的验证的方法:

it('displays error on submit if name is empty', async () => {
    const wrapper = mount(<MyFormik/>)
    const getForm = () => wrapper.find('form')

    wrapper.find('input[name="name"]').simulate('change', {
      persist: () => {},
      target: {
        name: 'name',
        value: ''
      }
    })

    wrapper
      .find('MyInnerForm')
      .props()
      .submitForm()


    await wait(0) // await next tick or even 1s...
    wrapper.update()

    expect(
      wrapper
      .update()
      .find('.error')
      .exists()
    )
    .toBeTruthy() // FALSE!
  })

无论我是否在提交后等待，update wrapper errors prop 始终为空。

这里的解决方案对我不起作用:

https://github.com/jaredpalmer/formik/issues/1146

https://github.com/jaredpalmer/formik/issues/110

看起来包装器不会更新

这是提交后formik props的日志:

{ errors: {},
         label: '',
         name: 'name',
         type: 'text',
         values: { name: '' },
         touched: { name: true },
         isValidating: false,
         status: undefined,
         initialValues: { name: '' },
         validateOnChange: true,
         validateOnBlur: true } }
         ...

         submitCount: 1,
         isValid: false,

Answer 1

没有看到您的组件，我不完全确定出了什么问题。这可能不起作用:

wrapper
      .find('MyInnerForm')
      .props()
      .submitForm()

如果您的组件 MyInnerForm 包含调用 submitForm() 的 Formik 表单，则不会导致 Formik 的验证运行。我会做这样的事情:

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

但是，如果这不能解决您的问题，我做了一个完整的示例，您可以查看 here .