Never fully hiding in Jest tests in uncontrolled mode

[florian-chauvel]

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

[atomiks]

Is this with v6.3.7 of tippy.js installed? The latest version should have fixed the issue

[florian-chauvel]

Yes, the installed tippy.js version is 6.3.7

yarn list --pattern tippy

yarn list v1.22.17
├─ @tippyjs/[email protected]
└─ [email protected]

[atomiks]

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).

[florian-chauvel]

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.

[atomiks]

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

[florian-chauvel]

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