Javascript jest/酶测试：this.props.showOverlay不是一个函数

我有一个模拟点击的小测试（希望通过该测试做更多的工作，但这就是我迄今为止遇到的问题）：

---

这就是我有点迷茫的地方——我不确定模拟函数是否是正确的方向，我也不确定设置模拟函数的语法将如何工作。

如果您只是对单个组件进行单元测试，请继续

shall

。如果该组件是嵌套的，并且您正在针对子节点进行测试，那么您将

装载父节点

也就是说，使用模拟函数是正确的。只需将其传递到组件中，如下所示：


例如：

const showOverlay = jest.fn();

test('shows an overlay', () => {
  const wrapper = mount(<HamburgerIcon showOverlay={showOverlay} />);
  const hamburgerIcon = wrapper.find('div#mobile-nav');

  hamburgerIcon.simulate('click');
  expect(showOverlay).toHaveBeenCalled();
});

const showOverlay=jest.fn（）；
测试（'显示覆盖'，（）=>{
const wrapper=mount（）；
const hamburgerIcon=wrapper.find（'div#mobile nav'）；
hamburgerIcon.simulate（'click'）；
expect（showOverlay）.tohavebeencall（）；
});


如果您有多个道具，那么我喜欢做一些更具声明性的事情：

// define props here if you want an easy way check if they've been 
// called (since we're defining at the top-level, all tests have access
// to this function)
const showOverlay = jest.fn();

// then include them in an "initialProps" object (you can also just define
// them within this object as well, but you'll have to use 
// "initialProps.nameOfFunction" to check if they're called -- kind of 
// repetitive if you have a lot of props that you're checking against)
const initialProps = {
  showOverlay,
  someOtherFunction: jest.fn()
}

// use the spread syntax to pass all the props in the "initialProps" object
// to the component
test('shows an overlay', () => {
  const wrapper = mount(<HamburgerIcon { ...initialProps } />);
  const hamburgerIcon = wrapper.find('div#mobile-nav');

  hamburgerIcon.simulate('click');

  expect(showOverlay).toHaveBeenCalled(); // here we can just use the mock function name
  expect(initialProps.someOtherFunction).toHaveBeenCalledTimes(0); // here we'll have to use "initialProps.property" because it has been scoped to the object
});

//如果您想要一种简单的方法，请在此处定义道具，检查它们是否
//调用（因为我们是在顶层定义的，所以所有测试都可以访问
//（此功能的附件）
const showOverlay=jest.fn（）；
//然后将它们包含在“initialProps”对象中（您也可以定义
//它们也在这个对象中，但是您必须使用
//“initialProps.nameoff函数”来检查它们是否被调用
//重复（如果你有很多道具要检查）
常量initialProps={
展示覆盖，
someOtherFunction:jest.fn（）
}
//使用扩展语法传递“initialProps”对象中的所有道具
//到组件
测试（'显示覆盖'，（）=>{
const wrapper=mount（）；
const hamburgerIcon=wrapper.find（'div#mobile nav'）；
hamburgerIcon.simulate（'click'）；
expect（showOverlay）.tohaveBeenCall（）；//这里我们可以使用模拟函数名
expect（initialProps.someOtherFunction）.toHaveBeenCalledTimes（0）；//这里我们必须使用“initialProps.property”，因为它的作用域是对象
});

const showOverlay = jest.fn();

test('shows an overlay', () => {
  const wrapper = mount(<HamburgerIcon showOverlay={showOverlay} />);
  const hamburgerIcon = wrapper.find('div#mobile-nav');

  hamburgerIcon.simulate('click');
  expect(showOverlay).toHaveBeenCalled();
});

// define props here if you want an easy way check if they've been 
// called (since we're defining at the top-level, all tests have access
// to this function)
const showOverlay = jest.fn();

// then include them in an "initialProps" object (you can also just define
// them within this object as well, but you'll have to use 
// "initialProps.nameOfFunction" to check if they're called -- kind of 
// repetitive if you have a lot of props that you're checking against)
const initialProps = {
  showOverlay,
  someOtherFunction: jest.fn()
}

// use the spread syntax to pass all the props in the "initialProps" object
// to the component
test('shows an overlay', () => {
  const wrapper = mount(<HamburgerIcon { ...initialProps } />);
  const hamburgerIcon = wrapper.find('div#mobile-nav');

  hamburgerIcon.simulate('click');

  expect(showOverlay).toHaveBeenCalled(); // here we can just use the mock function name
  expect(initialProps.someOtherFunction).toHaveBeenCalledTimes(0); // here we'll have to use "initialProps.property" because it has been scoped to the object
});