如何测试多个级别的React Native组件？

Question

现在测试React Native组件的首选方法似乎是使用mocha，react-native-mock和酶与浅渲染组件的组合。

问题是浅层渲染只有一层深度，有时组件有嵌套视图，需要你测试一两个额外的层次。

理论上，酶支持mount()来完全呈现组件，但实际上这会失败，因为react-native-mock's View mock does not recurse into children。

鉴于这些限制，人们如何测试他们的组件比一个渲染级别更深？

Answer 1

我们解决了让mount()使用酶来完全呈现React Native组件的问题。我们在https://blog.joinroot.com/mounting-react-native-components-with-enzyme-and-jsdom/

写了这篇文章

如果您使用我们的分叉react-native-mock-render并设置jsdom，您将能够安装组件。

Answer 2

我能够通过将组件测试从mocha切换到jest并按照此处的说明进行快照测试来解决这个问题：https://facebook.github.io/jest/docs/tutorial-react-native.html

然后我在package.json中添加了对现有测试目标的jest：

"test": mocha … && jest"

需要注意的一件事是，我确实必须按照说明添加模拟，以便我可以预期从框中嘲笑（例如。TextInput），以及使用{ {1}}映射一些未正确解析的原生组件。