我们有一个名为ScrollContainer的React组件,当它的内容滚动到底部时调用prop函数.
基本上:
componentDidMount() { const needsToScroll = this.container.clientHeight != this.container.scrollHeight const { handleUserDidScroll } = this.props if (needsToScroll) { this.container.addEventListener('scroll',this.handleScroll) } else { handleUserDidScroll() } } componentWillUnmount() { this.container.removeEventListener('scroll',this.handleScroll) } handleScroll() { const { handleUserDidScroll } = this.props const node = this.container if (node.scrollHeight == node.clientHeight + node.scrollTop) { handleUserDidScroll() } }
this.container在render方法中设置如下:
<div ref={ container => this.container = container }> ... </div>
我想用Jest Enzyme测试这个逻辑.
我需要一种方法来强制clientHeight,scrollHeight和scrollTop属性为我为测试场景选择的值.
使用mount而不是浅,我可以获得这些值,但它们始终为0.我还没有找到任何方法将它们设置为非零值.我可以在wrapper.instance().container = {scrollHeight:0}等设置容器,但这只会修改测试上下文而不是实际组件.
任何建议,将不胜感激!