Formik，Jest，Yup：如何测试验证？

eyh26e7m 于 2023-11-15 发布在 Jest

关注(0)|答案(3)|浏览(183)

我找不到一个方法来测试表单yup验证：

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!
  })

字符串
不管我是否在提交后等待，更新 Package 器错误属性总是空的。
这里的解决方案对我不起作用：
https://github.com/jaredpalmer/formik/issues/1146
https://github.com/jaredpalmer/formik/issues/110的
看起来像 Package 不会更新
下面是提交后的formik prop 日志：

{ 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,

型

jestjs

来源：https://stackoverflow.com/questions/55901053/formik-jest-yup-how-to-test-validation

3条答案

按热度按时间

wbgh16ku1#

您可以直接在验证架构上验证表单值。

const yup = require('yup')

const contactSchema = yup.object({
  name: yup.string()
    .required(),
  age: yup.number()
    .required()
    .positive()
    .integer()
})

const errors = await contactSchema.validate({
  name: 'Kenneth',
  age: -35.5
}).catch(function(err) {
  return err
});

console.log("errors", errors);

字符串
https://runkit.com/kluplau/5defa8cd122cf6001a3034c7

赞(0）回复(0）举报 2023-11-15

guykilcj2#

在没有看到你的组件的情况下，我不能完全确定出了什么问题。这可能不起作用：

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

字符串
如果您的组件MyInnerForm包含一个调用submitForm()的Formik表单，则不会导致Formik的验证运行。我会这样做：

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

型
但是，如果这不能解决你的问题，我做了一个完整的例子，你可以看看here。

赞(0）回复(0）举报 2023-11-15

31moq8wy3#

查看答案：https://stackoverflow.com/a/77367024/6170191

it('should validate schema with success', async () => {
  const name = await mySchema.isValid({name: 'test'});
  expect(desc).toEqual(false);
});

字符串

赞(0）回复(0）举报 2023-11-15

我来回答

Formik，Jest，Yup：如何测试验证？

3条答案

相关问题

热门标签

最新问答