Currently, I am developing a React Native app using TypeScript. For component testing, I rely on Jest and Enzyme. Additionally, I have integrated React Navigation into my project.
On one of the screens, the navigationOptions are as follows:
static navigationOptions = ({ navigation }: NavigationScreenProps) => ({
headerLeft: Platform.select({
android: (
<Icon
name="md-menu"
type="ionicon"
containerStyle={styles.icon}
onPress={navigation.toggleDrawer}
/>
),
ios: null
}),
headerTitle: strings.homeTitle
To ensure that the <Icon /> component is rendered, I want to write a unit test similar to this example:
const props = createTestProps({});
const wrapper = shallow<HomeScreen>(<HomeScreen {...props} />);
it("should render a <View />", () => {
expect(wrapper.find(View)).toHaveLength(1);
});
The challenge I'm facing is identifying the appropriate selector to target it. How can I select the static navigationOptions?
I attempted to access it through the wrapper instance like this:
expect(wrapper.instance().navigationOptions)
However, it seems that the wrapper's instance does not contain the navigationOptions property.