es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

  • es.davy.ai/
  • Programación /
  • Cómo hacer que los temporizadores falsos de Jest funcionen con funciones asíncronas en Jest/React?

Cómo hacer que los temporizadores falsos de Jest funcionen con funciones asíncronas en Jest/React?

05 Aug, 2023 Programación

pre>test('El usuario cierra sesión cuando el servidor no responde con un nuevo token de acceso', async () => {
const spy = jest.spyOn(storageUtils, "getItemAndCheckExpiry");
spy.mockImplementation(() => {return JSON.stringify({access: 'efrijreoireor', refresh: 'rufrijfreijriej'})});
const history = createMemoryHistory();
history.push('/auth');
render(

        <app></app>

    </authprovider>
    </router>
);
await waitFor(() => expect(history.location.pathname).toBe('/'));
expect(screen.getByText(/Se produjo un error/i)).toBeInTheDocument();
expect(spy).toHaveBeenCalledTimes(2);
jest.useFakeTimers();
jest.advanceTimersByTime(6000);
expect(screen.queryByText(/Se produjo un error/i)).not.toBeInTheDocument();

// expect(timeOut).toHaveBeenCalledTimes(1)
// expect(timeOut).toHaveBeenLastCalledWith(expect.any(Function), 4000);
spy.mockRestore();

}

Lo que debería hacer esta prueba es asegurarse de que el mensaje "Se produjo un error" desaparezca después de 5 segundos. Sin embargo, no funciona. Creo que es porque uso timers falsos dentro de una función asíncrona, pero no sé cómo resolver este problema.

}catch(err){
logout();
setUnexpectedLogoutError('Ocurrió un error y cerraste sesión.');
setTimeout(() => {
setUnexpectedLogoutError(null);
}, 5000);
}

Así es como se implementa esta funcionalidad. Cualquier ayuda será apreciada.

Tags:  , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Esta prueba está verificando que el mensaje “algo salió mal” desaparezca después de 5 segundos. El problema parece ser que el uso de temporizadores falsos dentro de una función asíncrona está causando que la prueba falle.

    Para resolver este problema, intente usar la función await act(async () => {}) de react-dom/test-utils alrededor del código que utiliza los temporizadores falsos. Esta función permite que el código asíncrono se ejecute de manera sincrónica dentro de las pruebas.

    Aquí hay un ejemplo de cómo modificar el código de prueba para usar act():

    import { act } from 'react-dom/test-utils';

test('el usuario cierra sesión cuando el servidor no responde con un nuevo token de acceso', async () => {
  const spy = jest.spyOn(storageUtils, "getItemAndCheckExpiry")
  spy.mockImplementation(() => {return JSON.stringify({access: 'efrijreoireor', refresh: 'rufrijfreijriej'})})
  const history = createMemoryHistory()
  history.push('/auth')
  render(
    <router history="{history}">
      <authprovider>
        <app></app>
      </authprovider>
    </router>
  )

  await waitFor(() => expect(history.location.pathname).toBe('/'))
  expect(screen.getByText(/Algo salió mal/i)).toBeInTheDocument()
  expect(spy).toHaveBeenCalledTimes(2)

  await act(async () => {
    jest.useFakeTimers()
    jest.advanceTimersByTime(6000)
  })

  expect(screen.queryByText(/Algo salió mal/i)).not.toBeInTheDocument()

  spy.mockRestore()
})

    Con esta modificación, la prueba debería funcionar como se espera.

Comments are closed.