1396596 - "mouseleave" event handler fired when opening a <select>

Status: RESOLVED DUPLICATE of bug 1342569

(Core :: DOM: Events, defect)

Description

[i336_]

Attachment: ael-bug.html

User Agent: Mozilla/5.0 (X11; Linux i686; rv:57.0) Gecko/20100101 Firefox/57.0
Build ID: 20170903100443

Steps to reproduce:

I have a <div> with an event listener on it for "mouseleave". The <div> also contains a <select> dropdown. When I mouse into the dropdown, the parent <div> gets a mouseleave event.

The attached HTML file contains a comprehensive breakdown of the bug and also incorporates a complete testcase extracted from the code I was working on (and decided to finally test in Firefox).


Actual results:

In my case, my mouseleave handler causes a widget to collapse out of the way after a small delay. This hide-after-delay behavior makes it impossible to select any item in the <select> dropdown.


Expected results:

For what it's worth, this doesn't happen in Chrome.

Comment 1

[i336_]

This is qualified in the testcase HTML, but I should probably also clarify here that when the <div> containing the <select> gets the mouseleave (which in my case sets the <div> to display:none), this causes Firefox to hide the menu. This is what makes this a usability problem.

Comment 2

[Thomas Wisniewski]

This is possibly a duplicate of bug 1342569.

Comment 3

[i336_]

Yes, it most definitely is! (Yeow, and 6 months old too.)

It'd be happy for this bug to be marked as a dupe of 1342569.

The testcase in that bug is somewhat more concise/succinct, and perfectly reproduces what I'm also seeing here. But it doesn't really demonstrate any serious usability letdowns like mine does. Should I add my testcase to that bug? (And if yes - via direct URL, or a link to this page?)