[SOLVED] New UI Mouse events not calling in Chrome

Suggestions & Feedback
1

Been working with the new UI elements and the mousedown/mouseup input events don’t call on my version of chrome, though touch events call fine.

For example…
https://developer.playcanvas.com/en/tutorials/ui-elements-stats-counter/

If I try and click on the buttons here, they don’t react. However, if I open the chrome Developer Tools and then Toggle Device Toolbar so I replicate touch input, the buttons respond as expected.

Been testing on other computers/browsers in the office, and it only seems to happen on my chrome browser (60.0.3112.113 (Official Build) (64-bit) on Windows 10)… Though we have another machine with this exact build and OS and the mouse input works fine! Tried disabling all of my extensions and didn’t have any luck either.

2

I think the input handler for elements does not attach mouse event handlers if touch input is available. Does your machine support touch like a Chromebook or something?

3

No, it’s just a standard desktop. The events fire off correctly in other browsers I’ve tested (Firefox, Edge)

4

It would be good to try and debug this yourself in Chrome - I don’t know how technical you are but if you’re familiar with the Chrome developer tools you can open up the Chrome console and put a breakpoint in the attach method of the ElementInput class and check if mouse handlers are registered.

5 
var touch = !!("ontouchstart" in window);

is reporting true on chrome, but false for firefox/edge.

6

Is it possible you have mobile debugging turned on in Chrome? That might be the cause… Arguably we should just register mouse handlers even if touch exists to just avoid this situation altogether.

1 Like
7

Ah, so disabling Touch Events API in chrome://flags fixes this for me.

Not sure if I ever turned this on explicitly though… Oh well, thanks for the help!

1 Like