如何解决使用 Jest Mock 函数测试 onClick
我构建了一个 React 应用程序,我试图让自己更适应测试,但我在尝试从我的组件测试 button
时遇到了困难。文档非常模糊,我还没有找到任何解决方案。
onClick
方法只是调用一个 handleClick
方法,就像在 Body.js
处一样:
const handleClick = () => {
console.log('handling click')
}
return (
<div className="container">
I'm the body
{posts &&
posts.map((post,i) => {
return (
<div key={i}>
<h1>{post.title}</h1>
<p>{post.body}</p>
</div>
);
})}
<Button onClick={handleClick}>Get the posts</Button> // this button
</div>
);
};
我在测试中使用模拟函数,如下所示:
it('button triggers handleClick',() => {
const fn = jest.fn();
let tree = create(<Body onClick={fn} />);
// console.log(tree.debug());
// simulate btn click
const button = tree.root.findByType('button');
button.props.onClick();
// verify callback
console.log(fn.mock);
expect(fn.mock.calls.length).toBe(1);
});
但我不能断言点击是发生的。
expect(received).toBe(expected) // Object.is equality
Expected: 1
Received: 0
handleClick
方法正在运行,因为我在运行测试时使用 console.log
获得了所需的输出。
console.log
handling click // it works!
at Object.onClick (src/components/Body.js:9:15)
console.log
{ calls: [],instances: [],invocationCallOrder: [],results: [] } // fn.mocks log
感谢您的帮助。
费尔南多,
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。