1434688 - Unexpected behavior of div on 'mouseover' when hovering over child SVG element

Status: NEW

(Core :: DOM: Events, defect, P2)

Description

[Daniel Sieradski]

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.13; rv:58.0) Gecko/20100101 Firefox/58.0
Build ID: 20180128191252

Steps to reproduce:

i have a div setup so that when you mouseover it, it shows a child element containing a series of links with svg icons.

if you mouseover the element, it opens just fine, and if you mouseleave, it closes just fine. 

but, if you mouseover the element and then proceed to hover over an svg child element, the child elements disappear while the parent remains in a mouseover state, even if you mouseleave.

here's my code:
https://gist.github.com/selfagency/5dce4ad564f218f30d36e91dbfdb7d71

here's where you can see this live:
https://nylon.com/team

this issue is not present in chrome or safar.


Actual results:

svg child elements disappear during a parent mouseover event


Expected results:

svg child elements should continue to appear and hide only on parent mouseleave event

Comment 1

[Alice0775 White]

I can reproduce the problem on Nightly60.0a1 and Edge win10. 
Only Chrome will work as expected.

Comment 2

[Alice0775 White]

@reporter,
Could you provide a testcase without jQuery?

Comment 3

[Jonathan Watt [:jwatt]]

Mass bug change to replace various 'parity' whiteboard flags with the new canonical keywords. (See bug 1443764 comment 13.)

Comment 4

[Henri Sivonen (:hsivonen)]

Confirmed in the sense 1) disparity with Chrome confirmed and 2) the superficial misbehavior of not treating descendants as counting for hover for the ancestor. Didn't confirm that jQuery isn't doing something silly.

Unclear to me if this should be in the Events component or in SVG.

Marking P2 due to item #2 above.