Not touched, and not clicked component gets a ghost mousedown event
Reported by
ali.baha...@gmail.com,
Nov 27 2017
|
|||||||||
Issue descriptionUserAgent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Ubuntu Chromium/61.0.3163.100 Chrome/61.0.3163.100 Safari/537.36 Steps to reproduce the problem: The following triggers the bug in Chrome, either on an Android tablet, or on my desktop machine when emulating a hand-held device. Touch or click the top (blue) square: Both squares disappear, and in the console log I see that the not clicked, and not touched bottom green square received a spurious mousedown event (which then deleted it). What is the expected behavior? Clicking or touching either square should make the clicked / touched square disappear, but only that square. Everything works as intended on my desktop machine both in Chrome and in Firefox. It also shows the correct behavior in Safari on iOS (and I don't care about IE or Edge). What went wrong? The not clicked, and not touched bottom green square received a spurious mousedown event. Did this work before? N/A Does this work in other browsers? Yes Chrome version: 61.0.3163.100 Channel: n/a OS Version: Flash Version: This bug was discovered here: https://github.com/facebook/react/issues/11530
,
Dec 1 2017
"Unable to reproduce the issue on the reported chrome version stable 61.0.3163.100 and on the latest canary 64.0.3280.0 using Ubuntu 14.04, Windows 10 and Mac 10.13.1 with the below mentioned steps. 1. Launched Chrome 2. Opened the file 'index.html'(nonReact-test-master.zip) provided in comment#0 3. Opened dev tools>Console 4. Clicked on the blue square present in the top left of the screen. We observed the blue screen disappeared and the event is recorded in the console, but the event about the green square is not recorded. Attaching the screen cast of the same. @Reporter: Could you please check the screen cast and let us know if we have missed any steps in reproducing the issue. Please check the same in a new profile with out any apps and extensions. Thanks!"
,
Dec 1 2017
Hi, As I write in the bug report, it only happens if you have touch start events. For example it happens on my Android tablet, and in Chrome too if I emulate a hand-held device. You cannot trigger the bug in a desktop browser when all you have is mousedown events. Hope this helps. Ali
,
Dec 1 2017
Thank you for providing more feedback. Adding requester "vamshi.kommuri@techmahindra.com" to the cc list and removing "Needs-Feedback" label. For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
,
Dec 4 2017
,
Dec 7 2017
This is an expected behavior: https://w3c.github.io/touch-events/#mouse-events If the user agent interprets a sequence of touch events as a tap gesture, then it should dispatch mousemove, mousedown, mouseup, and click events (in that order) at the location of the touchend event for the corresponding touch input. If the contents of the document have changed during processing of the touch events, then the user agent may dispatch the mouse events to a different target than the touch events. You can always cancel the touch event to prevent the compat mouse events to be fired.
,
Dec 7 2017
Interesting. Sorry for the false alarm.
,
Aug 16
>You can always cancel the touch event to prevent the compat mouse events to be fired. For some reason, it seems like calling e.preventDefault() doesn't work when the touchstart listener is attached to the document. Since React does event delegation (and always attaches listeners to the document), the suggested approach doesn't seem helpful. Is e.preventDefault() on touchstart not working at the document level a bug by itself?
,
Aug 16
#8 - not a bug, an intentional intervention - https://groups.google.com/a/chromium.org/d/msg/blink-dev/BW3qrkisqIs/v5Au-HVTAwAJ addEventListener("touchstart", () => {...}, {passive: false}) will make it cancellable again. |
|||||||||
►
Sign in to add a comment |
|||||||||
Comment 1 by krajshree@chromium.org
, Nov 29 2017