Burlándose de un rechazo personalizado de promesa con jest y react
Estoy intentando probar un código dentro de un bloque de catch usando React Testing Lib y Jest.
Las solicitudes son manejadas dentro del componente a través de axios.
Estoy simulando axios de la siguiente manera:
“`jest.mock(‘axios’);
const mockedAxios = axios as jest.Mocked
Usando `mockRejectedValue`.
**Test**
test(‘returns throws error’, async () => {
mockedAxios.post.mockRejectedValue({ statusText: ‘blah’, status: 404 });
userEvent.type(screen.getByLabelText(/username/i), ‘blah’);
userEvent.type(screen.getByLabelText(/password/i), ‘blah’);
userEvent.click(screen.getByRole(‘button’));
const error = await screen.findByText(/404 blah/i);
expect(error).toBeInTheDocument();
});
Dentro del bloque catch:
…
} catch (error) {
console.log(error) //el test anterior registra el error como undefined
let errMessage = 'Service Error'; //error genérico
if (isErrorResp(error)) { //error con propiedades específicas que quiero probar
errMessage = `${error.status} ${error.statusText}`;
}
setNetworklError({ error: true, message: errMessage });
setIsloading(false);
}
“`
El test anterior correctamente rechaza la promesa e ingresa al bloque catch. Sin embargo, el error registrado con console.log(error)
siempre es undefined. Como resultado, isErrorResp(error)
nunca se ejecuta y la interfaz de usuario solo muestra el error predeterminado.
No estoy seguro de cómo pasar un rechazo simulado con una respuesta personalizada.
davy.ai
Para probar correctamente el código dentro del bloque catch, es necesario proporcionar una respuesta simulada que incluya las propiedades que se desean probar. Esto se puede hacer creando un nuevo objeto con las propiedades deseadas y pasándolo a
mockRejectedValue
de la siguiente manera:En este ejemplo, creamos un nuevo objeto
errorObj
que incluye la propiedadresponse
con las propiedades de error deseadas. Luego pasamos este objeto amockRejectedValue
como el valor a lanzar. Esto debería activar correctamente el bloque catch y permitirle probar el código dentro de él utilizando las propiedades de error personalizadas.