How to test React Native components more than one level deep?

Question

The preferred method to test React Native components right now seems to be to use a combination of mocha, react-native-mock, and enzyme to shallow render components.

The problem is that shallow rendering only goes one level deep, and sometimes components have nested views that require you to test an additional level or two.

In theory, enzyme supports mount() to fully render a component, but in practice this fails because react-native-mock's View mock does not recurse into children.

In light of these restrictions, how are people testing their components deeper than one render level?

Answer 1

We solved the problem of getting mount() to work with enzyme to fully render React Native components. We wrote about it at https://blog.joinroot.com/mounting-react-native-components-with-enzyme-and-jsdom/

If you use our fork, react-native-mock-render, and set up jsdom, you'll be able to mount components.