Asserting interactions with react native mocks

[oriarditi]

Hi, I'm new to React Native so excuse me if this question has an obvious solution but I couldn't find it.

I'm trying to verify interactions with React Native components. In my case I have a Navigator passed to my component and I use it as so:

class BackText extends Component {
  render() {
    return (
      <Text onPress={() => this.props.navigator.pop()}>back</Text>
    );
  }
}

I'm trying to build my unit test around this component but I'm not sure which Navigator to pass to my component. I tried importing the Navigator from either react-native or react-native-mock and initiate them in my tests but neither had a pop method (or other Navigator methods).

Of course I can bypass the problem by setting up my own class with one pop method that I will be spying on but I'm trying to avoid re-mocking the RN API.

What's the preferred way of verifying interactions with the RN mocked components?

Thank you

[RealOrangeOne]

When in a unit test, you should have set up the mock by requiring react-native-mock/mock. then any requires from react-native are mocked by react-native-mock. The mocks are designed to be shallow, and so don't have this functionality (yet). The best solution would be to mock your pop function with a library like sinon, and spy on that to check it was called

[oriarditi]

Sorry I forgot to mention I required react-native-mock/mock and I'm able to test my own functionality smoothly. I'll take your suggestion on how to verify RN components.

Thanks you for your answer.