Как протестировать Custom Hook с помощью библиотеки реагирующего тестирования

Я попытался использовать библиотеку response-hooks-testing-library, но не похоже, как обрабатываются хуки, использующие useContext.

import React,{useContext} from 'react'
import {AuthContextData} from '../../AuthContext/AuthContext'
const useAuthContext = () => {
    const {authState} = useContext(AuthContextData) 
    const {isAuth,token,userId,userData} = authState
    return {isAuth,token,userId,userData}
  }
  export default useAuthContext

1 ответ

Решение

Вы должны обернуть свой хук в провайдере контекста:

let authContext
renderHook(() => (authContext = useAuthContext()), {
  wrapper: ({ children }) => (
    <AuthContextData.Provider value={/* Your value */}>
      {children}
    <AuthContextData.Provider>
  )
})

Допустим, у вас есть компонент, в котором вы вызываете ловушку useContext (context), чтобы получить ключ isLoading, который должен иметь значение false или true.

Если вы хотите протестировать useContext в компоненте, вы можете протестировать его следующим образом:

const context = jest.spyOn(React, 'useContext');

если каждый тест в одном файле должен иметь разные значения контекста, то внутри теста вы можете смоделировать реализацию следующим образом:

context.mockImplementationOnce(() => {
    return { isLoading: false };
  });

или вне тестов, чтобы все тесты имели одинаковый контекст:

context.mockImplementation(() => {
    return { isLoading: false };
  });

Надеюсь, это поможет.

Другие вопросы по тегам