Question

我的 Formik 页面：

const IssueForm =({values,errors,touched,isSubmitting})=>{
   const [modified,setModified] = useState(false);
    const handleModified = () => setModified(true);
    const handleSubmit = () => setModified(false);
    return(
    <div><br></br><br></br><br></br><br></br>
        <h1>Add Issue</h1><br></br>
        <Form>
            <div>
                <label>Description: </label>
                <Field width="100px" type="text" name="issueDescription" placeholder="issuedescription"  onInput={handleModified}/>
                {touched.issueDescription && errors.issueDescription&&<span style={{color:'red'}}>{errors.issueDescription}</span>}
            </div><div><br></br>
             
            <button  type ="submit" disabled={isSubmitting} onClick={handleSubmit}>Submit</button>
            
        </Form>
    </div>
    )
    };

我提到了一个领域。像这样我有很多领域。当我使用范式时，我成功地生成了测试用例，如下所示。

describe('Test UserForm using Shallow rendering', () => {
    let wrapper;

    beforeEach(() => {
        wrapper = shallow(<UserForm/>);
    });

    it('has 1 text input elements', () => {
        expect(wrapper.find('input').length).toEqual(1);
    })

    
    it('should allow to type in issuedescription input field', () => {
        wrapper.find('input#issueDescription').simulate('change', {
            target: {value: 'Sachin'}
        });
        wrapper.update();
        expect(wrapper.find('input#issueDescription').prop('value')).toEqual('Sachin');
    })

    
});

当我将 normal 从更改为 formik 时，我在 formik 中执行了相同的测试用例，但出现错误。对于第一种情况： expect(received).toEqual(expected) // 深度相等

Expected: 1
Received: 0

对于第二种情况：

方法“模拟”旨在在 1 个节点上运行。找到了 0 个。

我需要为 formik 页面运行这两个案例。我是新来的反应。有人可以帮忙吗？？

在反应中使用酶和笑话测试 Formik

0 个答案: