Как протестировать функцию внутри функционального компонента с помощью Jest в React Native

#reactjs #react-native #unit-testing #jestjs

Вопрос:

У меня есть следующий код в файле javascript в react native

 const LoseView = () => {

const [currentJoke, setCurrentJoke] = useState("");

const fetchJokeApi = async () => {
    // Fetching data from the API
        await fetch("https://v2.jokeapi.dev/joke/Miscellaneous,Pun?blacklistFlags=nsfw,religious,political,racist,sexist,explicitamp;type=single")
        .then((response) => response.json())
        .then((data) => 
            setCurrentJoke(data.joke),
            );
  };

useEffect(() => {
    fetchJokeApi();
 }, [])

return(
    <View style={{ flex: 1,alignItems: 'center', justifyContent: 'center'}}>
        <Text>you lost!, have a lame consolation joke</Text>
        <Text>{currentJoke}</Text>
   </View>
);
}


export {LoseView};
 

Я хочу протестировать функцию , сохраненную в переменной fetchJokeApi , но я понятия не имею, как конкретно проверить это с помощью jest. Потому что в тестовом файле я знаю, что могу импортировать LoseView благодаря экспорту в конце сценария, но как мне получить доступ к его внутренним функциям? Должен ли я экспортировать внутренние функции по отдельности?

Комментарии:

1. Вы не можете (не можете ) получить доступ к его внутренним функциям. Вместо этого проверьте поведение — в этом случае используйте, например, MSW, чтобы предоставить соответствующий ответ, не дожидаясь, пока запрос пройдет по сети.

2. @jonrsharpe спасибо за ответ! что такое, например, ТБО?

3. mswjs.io