1回答

张轩

2020-12-18

已采纳

同学你好 我不清楚我是否理解你的意思 测试给你修改好了 文档在这里：https://enzymejs.github.io/enzyme/docs/api/ShallowWrapper/simulate.html#example-functional-component

it('submit with change value should trigger callback with right object',()=>{
    wrapper2.find('#inputTitle').simulate('change',{ target:{value:'工資'}});
    wrapper2.find('#inputAmount').simulate('change',{ target:{value:'2000'}});
    wrapper2.find('#inputDate').simulate('change',{ target:{value:'2020-12-13'}});
    wrapper2.find('#submit').simulate('click');
    // const newItem = {...testItems[0],title:'工資',amount:2000,date:'2020-12-13'};
    // expect(props.onFormSubmit).toHaveBeenCalledWith(newItem);//%%Number of calls: 0
    wrapper2.update();
    // wrapper2 =  wrapper2.update();
    const newItem = {...props_with_item.ledgerItem,title:'工資',amount:2000,date:'2020-12-13'};
    // expect(props_with_item.onFormSubmit).toHaveBeenCalledWith(newItem);//@@哪個好
    expect(wrapper2.props().onFormSubmit).toHaveBeenCalledWith(newItem);
})

不是所有的更新都必须使用 act 包裹和 调用 update方法的，上次是因为我们创建了自定义的 mock 对象，这里 enzyme 的 simulate 已经在内部帮我们处理掉了。

所以如果你写的是 function component，多关注 enzyme 的文档，它上面已经有好多新的测试方法啦。

1

1

慕瓜5414566

用老师的代码揣摩，最后才发现有异步的问题，加上setTimeout最后receive的newItem成功跟expect一样了 setTimeout(()=>{ expect(wrapper2.props().onFormSubmit).toHaveBeenCalledWith(newItem,true);},1000) 然后官网的英文写很抽象，整个理解困难>< 老师再我说说我的理解，看有没有错，act包裹是像状态更新或是要取得dom元素(之前mock对象)需要用，然后16.8以上用.mount来挂载，像.simulate(), .setProps(),等才可以不用包裹，wrapper.update()则是触发状态更新后的渲染这样，最后谢谢有老师协助!

2020-12-22

共1条回复