New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.

Issue 671073 link

Starred by 2 users

Issue metadata

Status: Fixed
Owner: ----
Closed: Feb 2018
Cc:
Components:
EstimatedDays: ----
NextAction: 2016-12-22
OS: All
Pri: 2
Type: Bug



Sign in to add a comment

hover CSS still applied after mouse has left the component

Reported by chevalli...@gmail.com, Dec 5 2016

Issue description

UserAgent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.75 Safari/537.36

Steps to reproduce the problem:
1. The file my-component.html is a basic web component showing a div with the string "A" when not hovered, and a div containing the string "B" with a colored background when hovered.
The file index.html includes 4 of those components.
2. When hovering slowly those components, they behave correctly, but when hovering them quickly, some of them keep their hover state even if they are not hovered anymore.

What is the expected behavior?
when the mouse hovers the "A", "B" is displayed instead on a grey background.
when the mouse leaves the "B", the "A" comes back and the grey background disappears.

What went wrong?
when we quickly hover in and out of the components, some of them sometimes keep their hover state("B" with grey background) even if they are not hovered anymore.

Did this work before? N/A 

Does this work in other browsers? Yes

Chrome version: 55.0.2883.75  Channel: stable
OS Version: 10.0
Flash Version: Shockwave Flash 23.0 r0
 
my-component.html
1.2 KB View Download
index.html
1.2 KB View Download
screenshot_issue.PNG
1.1 KB View Download

Comment 1 by ajha@chromium.org, Dec 5 2016

Labels: M-55
Cc: mustaq@chromium.org
Components: -Blink>DOM Blink>DOM>ShadowDOM Blink>Input
I can imagine there's a ShadowDOM bug in the Document::updateHoverActiveState logic.

This repro depends on a bunch of other files though.  Can you point to a live repro or provide a self-contained test case?
Labels: Needs-Feedback

Comment 4 by bokan@chromium.org, Dec 8 2016

NextAction: 2016-12-22
Here is a JSFiddle reproducing the issue in Chrome : 
https://jsfiddle.net/2hvxpkes/6/
If you move your mouse quickly hover the yellow rectangle, in less than 5 seconds you should have some random elements which hover CSS doesn't disappear. (cf attached screen capture)
JSFiddleIssueCapture.PNG
95.3 KB View Download
Better version of the JSFiddle :
https://jsfiddle.net/2hvxpkes/7/
JSFiddleIssueCapture2.PNG
112 KB View Download
Cc: bokan@chromium.org chaopeng@chromium.org
Labels: -Needs-Feedback
Owner: kojii@chromium.org
Status: Assigned (was: Unconfirmed)
I can not reproduce this in Chrome Linux 55.0.2883.75 (Official Build) (64-bit) or ToT ATM. Maybe this is Windows-specific?

kojii: Could you try to reproduce this on Windows? If it reproduces, assign it to hayato. If not put the NeedsFeedback label on it and ask for details.

(rbyers: Why do you think this is Document::updateHoverActiveState in particular?

Changes here recently, although these are too new for M55. The latter was merged to M56 but not M55.

https://chromium.googlesource.com/chromium/src/+/55444d25b3aec61cbcf053448b3bb999b4bf859b
https://chromium.googlesource.com/chromium/src/+/bb7a6b0e1d0b5ca9aab24b7e794dc1d1e81c25db )

Comment 8 by tlarhi...@gmail.com, Dec 12 2016

I could reproduce it on Chrome Linux 54.0.2840.71 (64-bit)
May have been resolved in v55 ?

Comment 9 by kojii@chromium.org, Dec 12 2016

Owner: hayato@chromium.org
Reproduced on Win Canary 57.0.2948.0, maybe win and linux has different events.
Owner: kochi@chromium.org
kochi@, could you have a chance to take a look?
Is this related to ':focus' work you have recently done?

Comment 11 by kochi@chromium.org, Dec 15 2016

Components: -Blink>Input -Blink>DOM>ShadowDOM Blink>CSS Blink>DOM
Labels: -OS-Windows OS-All
I am not sure I am seeing the same issue as all above, but I tried

Linux: 55.0.2883.87 (Official Build) (64-bit)
Windows: 55.0.2883.87 (Official Build) m (64-bit)
Windows: 57.0.2951.0 (Official Build) canary (64-bit)
Mac: 55.0.2883.87 (Official Build) (64-bit)

and all exposed the same symptom (when move mouse quickly out of the yellow
rectangle, the last hovered character stay :hover'ed).

And even when I comment out the line 
  window.Polymer.dom = 'shadow';
to disable native shadow DOM, this bug reproduced.
So I conclude Shadow DOM is irrelevant here.

I suspect any mouseout doesn't clear the hovered state.

Hi,
Any update on this issue ?

Comment 13 by kochi@chromium.org, Feb 10 2017

I am busy with other stuff for some time and if someone can take time
for this issue I'd appreciate it.
 

Components: -Blink>CSS -Blink>DOM Blink>Input

Comment 15 by kochi@chromium.org, Jul 13 2017

Cc: kochi@chromium.org
Owner: ----
Status: Available (was: Assigned)
Status: Fixed (was: Available)
Adjusted sample so that it works (was getting a 404) on a script.

https://jsfiddle.net/2hvxpkes/9/

No longer reproducible in Chrome 64.0.3282.167 Windows 10.

Sign in to add a comment