i am trying for a delete icon to appear before executing rest of the test case issue is happening for waitFor from react testing library
my imports
import { render, screen, waitFor, fireEvent } from '../../../TestMocks/CustomRender';
import DraftPage from '../DraftPage';
import '@testing-library/jest-dom';
import React from 'react';
draftpage - showing a small part of actual code
{
loader ?
<Grid data-testid="full page loader">
<CircularProgress />
</Grid>
:
<Grid>
<IconButton
disabled={item.notSynced}>
<DeleteIcon data-testid="draft delete icon" onClick={()=>{console.log('btn click')}} />
</IconButton>
</Grid>
}
draftpage.test.js
it("delete a card number reduce", async () => {
render(<DraftPage />);
const loader = screen.getAllByTestId("full page loader")
await waitFor(() => expect(screen.getByTestId("draft delete icon")).toBeInTheDocument())
fireEvent.click(screen.getByTestId("draft delete icon"));
expect(screen.getByText("draft delete dialog")).toBeInTheDocument();
})
error:
FAIL src/Components/Draft/__Test__/DraftPage.test.js (11.746s)
√ renders draft page (193ms)
× delete a card number reduce (55ms)
● delete a card number reduce
TypeError: MutationObserver is not a constructor
75 | const loader = screen.getAllByTestId("full page loader")
76 | console.log(loader)
> 77 | await waitFor(() => expect(screen.getByTestId("draft delete icon")).toBeInTheDocument())
| ^
78 | fireEvent.click(screen.getByTestId("draft delete icon"));
79 | expect(screen.getByText("draft delete dialog")).toBeInTheDocument();
80 | })
at node_modules/@testing-library/dom/dist/wait-for.js:106:18
at waitFor (node_modules/@testing-library/dom/dist/wait-for.js:39:10)
at node_modules/@testing-library/dom/dist/wait-for.js:188:54
at node_modules/@testing-library/react/dist/pure.js:59:22
at node_modules/@testing-library/react/dist/act-compat.js:63:24
at batchedUpdates$1 (node_modules/react-dom/cjs/react-dom.development.js:21856:12)
at act (node_modules/react-dom/cjs/react-dom-test-utils.development.js:929:14)
at node_modules/@testing-library/react/dist/act-compat.js:62:20
at asyncAct (node_modules/@testing-library/react/dist/act-compat.js:40:14)
at Object.asyncWrapper (node_modules/@testing-library/react/dist/pure.js:58:35)
at waitForWrapper (node_modules/@testing-library/dom/dist/wait-for.js:188:35)
at Object.<anonymous> (src/Components/Draft/__Test__/DraftPage.test.js:77:11)