Never fully hiding in Jest tests in uncontrolled mode
Similar to this issue, the Tippy component never unmount with jest + react-testing-library in uncontrolled mode ie. when not using the visible property and using methods like userEvent.unhover, fireEvent.mouseLeave or fireEvent.mouseOut. Setting animation={false} does not fix the issue.
It throws the error Timed out in waitForElementToBeRemoved as the Tippy component still is in the DOM or
expect(jest.fn()).toHaveBeenCalled()
Expected number of calls: >= 1
Received number of calls: 0
as onHide isn't called.
Here is a codesandbox reproducing the issue: https://codesandbox.io/s/tippy-rtl-unmount-issue-dowpzt?file=/src/tippy.test.js
It seems to be a tested case in vanilla tippy.js
@tippy-js/react version 4.2.6
Is this with v6.3.7 of tippy.js installed? The latest version should have fixed the issue
Yes, the installed tippy.js version is 6.3.7
yarn list --pattern tippy
yarn list v1.22.17
├─ @tippyjs/[email protected]
└─ [email protected]
So this is the type of test case I made to ensure it worked with the latest version: https://codesandbox.io/s/tippy-rtl-unmount-issue-forked-xci2lt?file=/src/tippy.test.js (it passes).
Sorry for the misunderstanding: I agree, the test works in controlled mode ie. when using the visible property.
The issue I raised is about uncontrolled mode, where I don't use the visible property and rely on methods such as userEvent.unhover or fireEvent.mouseLeave.
Oh ok, the previous issue was about controlled mode and said uncontrolled was fine but now it's the opposite? 😓 or maybe there was also this problem before too
The tests from my codesandbox fail with v4.1.0 of @tippyjs/react, which is the version that was used in the original controlled issue, so I think it was a problem before too