Javascript 如何模拟函数，并测试它们'；在react组件中作为道具传递时重新调用？

我遵循这个答案的例子-。我有一个示例组件和测试设置。加载到App.js中时，该组件可以正常工作

成分-

import React, { PropTypes, Component } from 'react';

export default class ExampleModule extends Component {
  static propTypes = {
    onAction: PropTypes.func,
  }

  static defaultProps = {
  onAction: () => { console.log("In onAction"); }
}

doAction = () => {
  // do something else
  console.log('In do action');
  this.props.onAction();
}

render() {
  return(
    <div>
      <button className='action-btn' onClick=  {this.doAction.bind(this)}>Do action</button>
    </div>
  )
}
}

我尝试了

jest.fn（）

，但也遇到了同样的错误

如何模拟这些函数并测试它们

编辑：

我可以通过以下方式使用jest.fn（）模拟

doAction

：

let mockFn = jest.fn();
Example.doAction = mockFn()

---

然而，我仍然无法模拟

Example.props.onAction

在您的测试中，当您呈现文档时，您需要传递一个模拟函数，您可以稍后查看它是否被调用，类似这样-

let onActionMock = jest.fn();

beforeAll(function() {
  Example = TestUtils.renderIntoDocument(<ExampleComponent onAction={onActionMock}/>);
});

beforeEach(function() {
  onActionMock.mockClear();
});

it('doAction calls onAction', () => {
  Example.doAction();
  expect(onActionMock).toBeCalled();
});

---

希望这有帮助。

只是一个信息：

TestUtils已被移动到react dom/test utils

：

TypeError: Cannot assign to read only property 'onAction' of #<Object>

let mockFn = jest.fn();
Example.doAction = mockFn()

let onActionMock = jest.fn();

beforeAll(function() {
  Example = TestUtils.renderIntoDocument(<ExampleComponent onAction={onActionMock}/>);
});

beforeEach(function() {
  onActionMock.mockClear();
});

it('doAction calls onAction', () => {
  Example.doAction();
  expect(onActionMock).toBeCalled();
});

expect(onActionMock).toBeCalledWith('Some argument');