Search code examples
javascriptreactjsunit-testingreact-hooksreact-hooks-testing-library

How to Test Custom Hook with react testing library


I tried using react-hooks-testing-library but it dosn't seem how handle hooks that use 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


Solution

  • You have to wrap your hook in a context provider:

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