Open Bug 1006325 Opened 7 years ago Updated 2 years ago

Modify input placeholder by javascript will fire mouseover event

Categories

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

29 Branch
x86_64
Windows 7
defect

Tracking

()

UNCONFIRMED

People

(Reporter: atealxt, Unassigned)

Details

Attachments

(1 file)

701 bytes, text/html
Details
Attached file ff_bug.html
User Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:29.0) Gecko/20100101 Firefox/29.0 (Beta/Release)
Build ID: 20140421221237

Steps to reproduce:

Windows 7, Firefox 29.0

1. put a div with a input text inside.
2. bind mouseover to div.
3. bind click event to input, with the function change it placeholder.

Please refer to attached file.


Actual results:

After click the input text, div mouseover will be fired.

BTW, if I use jQuery and bind mouseenter event for div, it will fire as well.


Expected results:

div mouseover should not be fired. 
This issue is not happens on chrome, ie, opera and safari, I just tried desktop version browsers.
The mouseover is targeted at the input, not the div.  And it's _actually_ targeted at the anonymous placeholder node but gets retargeted as it crosses the anon content boundary.

I wonder whether we should just skip mouseover/out propagation through untrusted content if it has to get retargeted.

But note that any attempt to explain input in terms of Shadow DOM will presumably end up with this same behavior given how Shadow DOM is specced right now.
Component: Layout: Form Controls → DOM: Events
(In reply to Boris Zbarsky [:bz] from comment #1)
> The mouseover is targeted at the input, not the div.  And it's _actually_
> targeted at the anonymous placeholder node but gets retargeted as it crosses
> the anon content boundary.
> 
> I wonder whether we should just skip mouseover/out propagation through
> untrusted content if it has to get retargeted.
> 
> But note that any attempt to explain input in terms of Shadow DOM will
> presumably end up with this same behavior given how Shadow DOM is specced
> right now.

Thank you Boris for quick reply.

I want to remove placeholder text when click the input for same ux across browsers, that's how I found this issue.
Actually my patch is add a condition in mouse event to skip some cases, and I know there is a alternative way is to use css class:
http://www.toolinfy.com/hide-placeholder-text-on-focus-css

I'm just wondering if it can be fix or it is not a bug but feature.
Luis, the point is that mouse events bubble, so you generally want to check the target for them.
(In reply to Boris Zbarsky [:bz] from comment #1)
> The mouseover is targeted at the input, not the div.  And it's _actually_
> targeted at the anonymous placeholder node but gets retargeted as it crosses
> the anon content boundary.
> 
> I wonder whether we should just skip mouseover/out propagation through
> untrusted content if it has to get retargeted.
> 
> But note that any attempt to explain input in terms of Shadow DOM will
> presumably end up with this same behavior given how Shadow DOM is specced
> right now.

This is interesting. Let me see if I understand the puzzle correctly. Changing the placeholder value causes a new element appear in the shadow tree of the input element. This element is positioned in a way that puts it under cursor, which causes the extra mouseover event be dispatched. Did I understand this right?
That's correct.

Note that I think some UAs don't actually dispatch mouseover if the thing the mouse is over changes due to DOM/layout changes as opposed to mouse moves.  But Gecko certainly does; otherwise anything tracking mouse position via such events would get out of sync with reality.
(In reply to Boris Zbarsky [:bz] from comment #5)
> That's correct.
> 
> Note that I think some UAs don't actually dispatch mouseover if the thing
> the mouse is over changes due to DOM/layout changes as opposed to mouse
> moves.  But Gecko certainly does; otherwise anything tracking mouse position
> via such events would get out of sync with reality.

Okay. If that input was built with shadow DOM, the spurious mouseover would not escape out of the shadow tree: http://w3c.github.io/webcomponents/spec/shadow/#retargeting-relatedtarget
Aha.  We should do that here.
https://bugzilla.mozilla.org/show_bug.cgi?id=1472046

Move all DOM bugs that haven’t been updated in more than 3 years and has no one currently assigned to P5.

If you have questions, please contact :mdaly.
Priority: -- → P5
You need to log in before you can comment on or make changes to this bug.