如何对表单验证错误进行 Jest 测试?

问题描述

我正在尝试测试登录表单验证错误

<Form className='form' onSubmit={onSubmit} data-testid='form'>
<FormGroup className='form-group'>
      <input
        type='email'
        placeholder='Email Address'
        name='email'
        value={email}
        onChange={onChange}
        required
      />
    </FormGroup>
    <FormGroup className='form-group'>
      <input
        type='password'
        placeholder='Password'
        name='password'
        value={password}
        onChange={onChange}
        minLength='6'
      />
    </FormGroup>
    <input type='submit' value='Login' />
  </Form>

但问题是我无法在 组件 = 渲染()

我的测试如下:

it('validate user inputs,and provides error messages',async () => {
    const { getByTestId,getByText,getByPlaceholderText } = component
    
    fireEvent.change(screen.queryByPlaceholderText(/Email Address/i),{
        target: {value: ""},});

    fireEvent.change(screen.queryByPlaceholderText(/Password/i),});

    fireEvent.submit(getByTestId("form"));

    expect(getByText("Please fill out this field.")).toBeInTheDocument();


})

我正在使用带有玩笑的 React 测试库

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)