reactjs - 测试鼠标滚轮事件

标签 reactjs reactjs-testutils

我已经设置了一个简单的函数来处理我构建的菜单组件上的鼠标滚轮事件。该组件工作正常,我正在尝试围绕它编写一个单元测试,这给我带来了一个问题。

组件处理程序:

handleWheel: function (event) {
        (event.deltaY < 0 ) ? this.moveUp() : this.moveDown();

        return false;
}

this.moveUp()/this.moveDown() 只是设置 firstIndex 的状态

问题是,当我尝试为此功能编写测试时,我无法让它工作。我几乎 100% 确定它与我传入的 eventDetails 对象有关,但我不知道如何正确格式化它。

// set firstIndex = 0
TestUtils.Simulate.scroll(menu, {deltaY: 52});
expect(menu.state.firstIndex).to.equal(1);
// error: expected 0 to be 1

有谁知道如何正确格式化 TestUtils.Simulate.Scroll()/知道更好的方法来测试 onWheel() 吗?

最佳答案

如果事件处理程序用于 onWheel,您应该使用 Simulate.wheel

事件与模拟方法之间存在 1:1 的映射。删除“on”并将第一个字母小写。

onScroll   ->   Simulate.scroll
onKeyDown  ->   Simulate.keyDown
onWheel    ->   Simulate.wheel

关于reactjs - 测试鼠标滚轮事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26717499/

相关文章:

javascript - 传递给组件的 prop 返回未定义

javascript - 在 React 中调用制表函数

jquery - 使用 jQuery 进行 React 组件而不需要 - jest 单元测试

reactjs - 模拟在另一个函数中使用的函数

javascript - React-native-map 标记颜色没有改变

javascript - 如何为具有特定路径(React Native)的现有项目创建私有(private) Git 存储库?

javascript - mongoDB 通过查找获取 'undefined'

javascript - 使用 TestUtils.Simulate 在输入元素上创建更改事件时遇到问题

javascript - 使用 Jest 和 React JS TestUtils 测试表单

javascript - 如何在没有 Browserify 的情况下测试 React 组件