'React native Jest- navigation.setOptions

I'm not able to test a react-native screen that should render a headerRight icon on navigation setOptions is being called in the constructor I have a react native code for which I have

this.props.navigation.setOptions({
      title: this.props.t("Team"),
      headerRight: () => {
        console.log("header right>>")
        return(
        <View style={{ flex: 1, flexDirection: "row", paddingRight: 10 }}>
          <HeaderIcon
            testID= {"search-icon"}
            onPress={() => {
              this.setState({
                showSearch: true,
              });
            }}
            iconName={"search"}
          />
          <HeaderIcon
            onPress={() => {
              props.navigation.navigate("AccessManagerNewUser");
            }}
            iconName={"person-add"}
          />
        </View>
      )},
    });

My class-based component is setting headerRight with this navigation function. My Jest test has the below as navigation props.

 navigation: {
    addListener: jest.fn(),
    setOptions: () => {},
    navigate: jest.fn(),
  },

This is never calling the headerRight method when I'm running my tests



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source