如何使用酶来窥探react事件监听器？
如何使用酶来窥探react事件监听器？
提问于 2018-05-31 07:06:49
这似乎是一个相当简单的任务，但我不知道我做错了什么……
Page.jsx
class Page extends React.Component {
constructor(props) {
super(props);
}
handlePageClick = (e) => {
console.log('page click!!');
}
render() {
return(
<div className='at-page' onClick={this.handlePageClick}>
{this.props.children}
</div>
);
}
}
export default Page;Page.test.js
...
it('page should listen for click events', () => {
const wrapper = mount(<Page><div>Hello Page</div></Page>);
const instance = wrapper.instance();
const spy = jest.spyOn(instance, 'handlePageClick');
const page = wrapper.find('.at-page');
page.prop('onClick')();
expect(spy).toHaveBeenCalled();
}
...我要..。
expect(jest.fn()).toHaveBeenCalled() Expected mock function to have been called.
回答 2
Stack Overflow用户
发布于 2018-05-31 08:26:40
我发现这里出了什么问题。如果你有更好的解决方案，请告诉我。
1)我应该在创建包装器之前侦测我的函数
2)我不能在我的类中使用箭头函数作为方法
Page.jsx
class Page extends React.Component {
constructor(props) {
super(props);
this.handlePageClick = this.handlePageClick.bind(this);
}
handlePageClick(e) {
console.log('page click!!');
}
render() {
return(
<div className='at-page' onClick={this.handlePageClick}>
{this.props.children}
</div>
);
}
}
export default Page;Page.test.js
...
it('page should listen for click events', () => {
const spy = jest.spyOn(Page.prototype, 'handlePageClick');
const wrapper = mount(<Page><div>Hello Page</div></Page>);
const page = wrapper.find('.at-page');
page.prop('onClick')();
expect(spy).toHaveBeenCalled();
}
...Stack Overflow用户
发布于 2018-06-16 18:10:29
使用Simon库和方法存根
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50614481
复制相关文章
相似问题