Questions about testing React hooks with the react-hooks-testing-library utility.
Questions tagged [react-hooks-testing-library]
90 questions
2
votes
1 answer
How to mock a function that will have then and catch block?
I using Firebase authentication and I would like to test the function using Jest and react-hooks-testing-library.
I have a function that like this:
const loginWithEmailPassword = (email: string, password: string) => {
const auth = getAuth()
…
ken
- 2,426
- 5
- 43
- 98
2
votes
1 answer
How to test Async calls in JEST using request without mocking and awaits for react-hooks testing library
I am not good at writing tests as far as non API functionalities are concerned I have tested using JEST with the help of rendererHook Just like below Sample correct TEST:
import { render, screen, cleanup } from '@testing-library/react';
import…
Arslaan Muhammad Ali
- 37
- 1
- 12
2
votes
1 answer
Mock Linking.openURL in React Native it's never been called
I´m writing some tests for my app and I´m trying to mock Linking module. I'm using jest.
The Linking.canOpenURL mock it's working fine (toHaveBeenCalled is returning true), but openURL mock is never called.
function mockSuccessLinking() {
…
Laurence Steven Montenegro
- 33
- 1
- 7
2
votes
0 answers
@testing-library/react-hooks 'act' function show me 'no floating promises' lint error
import { renderHook, act } from '@testing-library/react-hooks'
import useRefWithSetter from '../useRefWithSetter'
describe('Test useRefWithSetter', () => {
const { result } = renderHook(() => useRefWithSetter(1))
const [valueRef, setValue] =…
Jiyeol Lee
- 21
- 3
2
votes
1 answer
How to fire an event React Testing Library
I have some code, in a hook, to detect whether the browser is online / offline:
export function useConnectivity() {
const [isOnline, setNetwork] = useState(window.navigator.onLine);
const updateNetwork = () => {
…
Jamie
- 3,105
- 1
- 25
- 35
2
votes
1 answer
@testing-library/react-hooks calls setTimeout two times
Here is my custom React-hook.
import { useEffect, useRef } from 'react'
function useInterval({ callback, interval, delay }) {
const savedTimerId = useRef()
useEffect(() => {
const loop = () => {
const res =…
Semyon Kirekov
- 1,237
- 8
- 20
2
votes
0 answers
Unit test for customPollingHook which uses apollo useLazyQuery
So I have written a custom polling hook which uses useContext and useLazyQuery hooks. I want to write a unit test for this, which should cover its returned values state and side effect.
So far I have managed to do this much but I'm not so sure how…
Debasis Nath
- 21
- 1
2
votes
1 answer
Using act doesn't update state?
I have a custom hook like so:
import { useState } from 'react';
export default function useOpenClose(initial = false) {
const [isOpen, setOpen] = useState(initial);
const open = () => { setOpen(true); }
const close = () => {…
nyphur
- 2,404
- 2
- 24
- 48
2
votes
1 answer
Mocking Axios in React Hooks using react-hooks-testing-library
Trying to mock GET request to API but always get
Timeout - Async callback was not invoked within the 10000ms timeout specified by jest.setTimeout.
even though I increased the timeout it still throws error.
Hook
export default function…
Kodin
- 772
- 8
- 23
2
votes
1 answer
Testing custom hook with react-hooks-testing-library throws an error
I am trying to test a simple hook that fetches some data using axios. However the test is throwing a TypeError: "Cannot read property 'fetchCompanies' of undefined". Here's my custom hook (the full repo is here):
import { useState, useEffect } from…
Naresh
- 23,937
- 33
- 132
- 204
1
vote
0 answers
react-hooks-testing-library: Context Provider, state change in child function act() error
I am using the React renderHook() function to call a custom hook. Internally in the custom hook, I call a function that executes axios, gets data and on success, dispatches a state change to a custom context provider.
Upon execution I am getting the…
Quinton
- 11
- 2
1
vote
1 answer
React testing custom hook with window.url
I have a custom hook that downloads a file from an url, it works fine and now I trying to test its behaviour.
const useFileDownload = ({ apiResponse, fileName }) => {
const ref = useRef(null)
const [url, setUrl] = useState('')
const [name,…
heliosk
- 1,113
- 3
- 23
- 45
1
vote
1 answer
TypeError: navigation.navigate is not a function in jest
Here is touchable element with navigation.navigate (react navigation 6.x),
export default Home = ({ navigation }) => {
....
return (
{navigation.navigate("MyHelp")}}…
user938363
- 9,990
- 38
- 137
- 303
1
vote
1 answer
Testing custom hooks react typescript
Im learning react testing and i have this hook i want to test but i have no idea how
import { useState, useCallback } from 'react';
import axios from 'axios';
export const useFetch = () => {
const [error, setError] = useState(null);
const…
ludinj
- 107
- 7
1
vote
2 answers
What is the suitable type for renderHook in react-testing-library and TypeScript?
I wanna test a custom hook with react-testing-library therefore, I add this code into beforeEach:
let renderedHook ;
beforeEach(() => {
renderedHook = renderHook(() => useFetch());
});
test('.....', () => {
…
Martin Rützy
- 415
- 1
- 11
- 22