相关疑难解决方法(0)

我们有一个名为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 }等等,但这只会修改测试上下文而不是实际组件.

任何建议,将不胜感激!