使用jest在vue上测试表单重置

trnvg8h3  于 2021-09-13  发布在  Java
关注(0)|答案(0)|浏览(444)

使用jest进行单元测试,测试使用vue构建的表单。在这些元素中,我有一个重置按钮(type=reset),它工作得很好,一旦单击它就会删除所有已经引入的值。
但是,当进行单元测试时,单击按钮似乎并没有清除值。我没有单击的处理程序,只是使用表单的默认重置函数。
我也试过使用 wrapper.emmited('reset'); 无济于事,以及 wrapper.emmitedByOrder(); 返回一个空数组。
如何测试重置按钮是否正确生成并按预期工作?

  1. test('Assert Form Components', async () => {
  2. const wrapper = mount(FormElement, {
  3. propsData: {
  4. message: sampleJSON.formJSON
  5. }
  6. })
  7. let resetBtn = wrapper.find('.form-reset');
  8. let requiredInput = wrapper.find('.required-input');
  9. ....
  10. requiredInput.setValue('test');
  11. expect(requiredInput.element).toHaveValue('test'); //This passes
  12. await resetBtn.trigger('click');
  13. expect(requiredInput.element).not.toHaveValue('test') //This fails
  14. ....

暂无答案!

目前还没有任何答案,快来回答吧!

相关问题