Recommended way to provide NavigationContext for testing

[OzzieOrca]

I'm shallow rendering a component that uses useNavigationParam and getting TypeError: Cannot read property 'getParam' of undefined. Is there a recommended way to provide NavigationContext for testing (I'm using Jest)? I used to just pass a fake navigation prop but that won't be passed to NavigationContext.

[slorber]

Hi,

You can check this react-navigation/rfcs#75 (don't hesitate to comment RFC if this is useful to you)

[OzzieOrca]

Awesome thanks! That seems a lot nicer. We're using enzyme and shallow rendering and I tried your createAppContainer(createSwitchNavigator({ Screen })) wrapper but get the same error. I'll have to try it without enzyme or wait till they upgrade as they still don't have full support for the new Context API. All the HOCs created by that wrapper are a lot to dive through when shallow rendering. Maybe we need to figure out a better way to test but we've got a whole codebase of shallow rendered React Native components.

But ya I'm all for a <StaticNavigatior> like you proposed.

[OzzieOrca]

Closing as I figured out a solution (and gave up on enzyme and shallow rendering it): react-navigation/rfcs#75 (comment). Feel free to steal it or cherry pick it for docs if it seems useful. Hopefully the RFC will result in a built in <StaticNavigator> or something similar.

[norbertsongin]

It's also possible to use NavigationProvider directly as a wrapper although you have to provide navigationMock:

import { NavigationProvider } from '@react-navigation/core';

mount(
  <NavigationProvider value={navigationMock}>
    <SomeScreenYoureTryingToTest />
  </NavigationProvider>
);