Chrome 56 mobile addEventListener "click" not working

Question

I encounter a problem where click event on Link Element (A tag), or any other DOM Element, is not calling handler/callback function.

it doesn't matter which parent in the hierarchy I am getting it not getting this event.

no Event.stopImmediatePropagation or Event.stopPropagation exist.

Answer 1

the reason why is Chrome 56, they change some of the events and stop transforming Mouse Events to Touch Events.

see here: https://developers.google.com/web/updates/2016/12/chrome-56-deprecations#mouse_on_android_stops_firing_touchevents

to solve the issue just use touchstart event for mobile where you used click before. or if you need only one click you can do:

Element.addEventListener("click", callback);
Element.addEventListener("touchstart", callback);
function callback(event) {
  Element.removeEventListener("click", callback);
  Element.removeEventListener("touchstart", callback);
  // do something
}

now, to have a simulate click you need to check 300ms pass between "touchstart" and "touchend". if it less you have a click.

Note: the "click" event occur after "touchstart"