javascript - 用 Jest 检查传递的函数作为 prop

标签 javascript unit-testing jestjs enzyme

react-dates 构建一个组件,我有这样的东西:

<DayPickerRangeController
    // some props...
    isDayBlocked={day => isDayBlocked(a, someObject)}
/>

我想测试我是否正确传递 day => isDayBlocked(a, someObject) 形式的函数。

所以在我的测试中我有:

import isDayBlocked from './isDayBlocked'

jest.mock('./isDayBlocked', () => () => {})

然后进行测试:

expect(wrapper.find(DayPickerRangeController).props().isDayBlocked).toBe(
      () => isDayBlocked,
);

但我收到:

expect(received).toBe(expected) // Object.is equality

Expected: [Function anonymous]
Received: [Function isDayBlocked]

怎样才能让测试通过?

最佳答案

您正在尝试匹配函数的主体。这是行不通的。您可以比较 .toString() 结果,但可以肯定的是,这并不意味着相同的正文文本意味着相同的执行(因为使用了闭包/全局变量)。

那么你能做什么呢?

您可以像测试任何其他函数一样测试传入的函数:提供不同的输入并对输出进行断言。

wrapper.callSomethingToChangeState();
expect(wrapper.find(DayPickerRangeController).props().isDayBlocked('day1'))
    .toBeFalsy();
expect(wrapper.find(DayPickerRangeController).props().isDayBlocked('day2'))
    .toBeFalsy();
expect(wrapper.find(DayPickerRangeController).props().isDayBlocked('day3'))
    .toBeTruthy();

如果您的 isDayBlocked 取决于组件的某些内部状态,您可能需要编写几个不同的 it() 来覆盖不同的输入数据类

关于javascript - 用 Jest 检查传递的函数作为 prop,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54628152/

相关文章:

javascript - 如何使用 vanilla javascript 使表单更新主表单上的文本?

javascript - java 6 与 java 7 string.matches 与正则表达式

unit-testing - 在单元测试中模拟 NewManager()

vue.js - VueJS test-utils 在子组件中找不到元素

react-native - 测试自定义事件 react native

asp.net - 如何让javascript在更新面板中执行

c# - 如何模拟 ObservableCollection

reactjs - React-Testing 库未在快照中呈现 Material-UI 对话框

javascript - Jest 对调用返回 Promise 的函数的函数进行单元测试

javascript - Three.js 示例未显示在 Canvas 上