首页 > 解决方案 > 如何编写测试以检查是否在 Jest 中为 React 应用程序设置了输入字段的值?

问题描述

我创建了一个登录表单并正在使用 Jest 对其进行测试。我在使用带有更改的模拟来检查值是否已设置时遇到问题。已提供代码供参考。

Login.js(用户名的输入字段)

<Form onSubmit={handleSubmit}>
                    <Form.Group className="form-elements" controlId="nameForm">
                        <Form.Label className="form-label">Username:</Form.Label>
                        <Form.Control className="form-control" type="text" name="username" value={name} required placeholder="Enter name" onChange={(e)=>setName(e.target.value)}/>
                    </Form.Group>

Login.test.js - 检查用户名的测试用例

describe('Test case for testing login',() =>{
  let wrapper;
  test('username check',()=>
  {
    wrapper = shallow(<Login/>);
    const ele = wrapper.find("FormControl[type='text']")
    ele.simulate("change", {target: { name:'username',value: 'UserFirst'}});
    console.log(...ele);
    expect(ele).toHaveProperty('value', 'UserFirst')
    
  })
})

console.log(...ele) 的结果是:

它显示该值未设置

这可能是什么解决方案?

标签: javascripthtmlreactjsunit-testingjestjs

解决方案


推荐阅读