React testing library hover event not triggered when trigger text if wrapper with additional element

[tomfridental1]

trafficstars

Describe the bug While using the examples from this package test working fine, using <button ref={setTriggerRef}>text</button> When testing the same code, but adding a span (or any other element) around the text (<button ref={setTriggerRef}><span>text</span></button>) the hover event isn't working. (logging the visible state stays false)

To Reproduce Steps to reproduce the behavior:

1. Use the same test setup from /test folder in this package
2. wrap the trigger text with span tag.

Expected behavior Expected hover inside nested child to work as well.

Desktop (please complete the following information): Mac with VSCode and zsh terminal @testing-library/react @testing-library/user-event Jest.

Additional context This scenario still working on the app itself, the hover toggles the "visible" status to true. If you change the trigger to click, the test is working.

I'm assume it's something to do with onMouseEnter isn't bubbling.

Thanks!

[tomfridental1]

I can confirm that manipulating the mouse enter event works:

fireEvent(element, new MouseEvent('mouseenter', { bubbles: true }));
  await waitFor(() => screen.getByText(overlayText));

[choucry13]

Hi @tomfridental1 , any update with a possibility to use useEvent.hover from @testing-library/user-event ? (and thank again for your answer with fireEvent ^^)