Tengo una prueba de unidad Jest que está probando un error de una llamada API simulada para garantizar que el mensaje de error se muestre en la página. En mi archivo real, estoy usando notistack para mostrar los mensajes de error. No he mostrado la solicitud de API completa porque no creo que sea relevante, así que, en resumen, es lo siguiente:

miComponente.js :

 import { useSnackbar } from 'notistack'; const myComponent = props => { const { enqueueSnackbar } = useSnackbar() //make an API call to an endpoint ... if (response.ok) enqueueSnackbar("API Success", { variant: "success" }); else enqueueSnackbar("API Failed", { variant: "error" }); }

Como resultado de esto, estoy probando lo anterior en mi prueba unitaria. Nuevamente, no pegaré la prueba unitaria completa porque no creo que sea relevante, sino algo similar a:

miComponente.prueba.js

 import { render, screen } from "@testing-library/react" test("testing error message on API call", async () => { // mock the API call to return a 500 <- this works fine render(<myComponent />) // ensure that the error message is displayed in the screen expect(screen.queryByText(/API Failed/)).toBeInTheDocument(); });

Haciendo lo anterior, me sale un error:

TypeError: no se puede desestructurar la propiedad 'enqueueSnackbar' de '(0, _notistack.useSnackbar) (...)' porque no está definida

Si simplemente incluyo algo como lo siguiente, se enqueueSnackbar() pero la prueba aún falla porque el mensaje es null .

 const mockEnqueue = jest.fn(); jest.mock('notistack', () => ({ ...jest.requireActual('notistack'), useSnackbar: () => { return { enqueueSnackbar: mockEnqueue }; } }));

Sin embargo, ni siquiera quiero burlarme de la barra de bocadillos porque quiero probar el mensaje de visualización real para cada escenario específico (hay varios).