Question

我找到了几个答案（https://stackoverflow.com/a/40994010/1219368，What is the difference between jest.mock(module) and jest.fn()，...）以及react-boilerplate中的文档+测试示例，但我仍然没有得到如何使用它实践。

你能提供一个具体的例子，在用于测试React组件[的DOM]时，解释幕后发生的事情“以及新的（jest.fn（））返回的内容吗？

Answer 1

我通常使用jest.fn()来定义需要针对调用次数进行检查的模拟函数。对于使用redux-thunk的异步动作创建者，我通常会模拟调度并查找它被调用的类型数量以及传递了哪些参数。为了测试作为道具传递给组件的函数，我使用jest.fn()来模拟它们并将它们作为道具注入;然后我检查它们是否在组件内被正确调用。如果您的问题更具体地说明您要测试的是什么类型的东西会有所帮助？否则，不要使用你不需要的东西

如果你的组件需要一些道具，你必须在挂载时传递它们。制作像

这样的对象

const props = { ... };

具有所有必需的属性，可以是字符串，数字，数组或对象。

对于函数，您可以使用模拟函数创建变量：

const someFunction = jest.fn();

然后将其包含在props对象中：

const props = { ..., someFunction };

然后，像<Component {...props} />一样安装组件。我建议使用浅，因为嵌套组件应该在一组单独的测试中自行测试。

如果您使用的是 Redux ，则可以直接导出组件而无需连接。除了导出到装饰组件外，还要写下以下内容：

export default connect(...)(YourComponent);
// For testing purposes:
export { YourComponent };

然后，您可以在我上面提到的mapDispatchToProps对象中定义props所需的内容。还要确保所调用的任何函数实际上都传递给props。我曾经测试过一些函数并意识到它们是组件方法函数，而不是通过道具传递的。在这种情况下，请使用wrapper.instance.someMethod()来调用/引用它们。

用于测试React组件的jest.fn（）的具体示例是什么？

1 个答案: