Tap doesn't always fire in iOS

[KrisVR]

I am using jQuery click events, no problems on all devices. Then I added hammer.js listeners on the body element for swipe, pan and drag functionality.

Unfortunately, this broke the click events on iOS: they fire only 90% of the time in iOS, other platforms (Android and PC) still work perfectly.

When the click event doesn't fire, it still sets the button to "active" (CSS), meaning the device registered the click, but somehow hammer stopped it from firing.

Thing's I've tried to fix it (without result):

• Disable the tap event
• Play around with the tap event options

Is there any way to use hammer.js, but totally ignore/bypass the tap event?

[kenjikato]

You need to use the "More Complex" implementation of hammer.js 2.0 that lets you delegate, and choose which events you do and don't intercept, or what to do in the cases where you do want them.

I've found that this is easer to do thus far when NOT using jQuery, and rather implementing hammer.js as straight Javascript.

[KrisVR]

Just to be clear, I'm not using the Hammer jQuery plugin, I'm just using both Hammer and jQuery on the same page.

I've tried with the "More Complex" implementation with the following results:

Hammer Manager with no recognizers:

var bodyHammerManager = new Hammer.Manager(document.body, {
recognizers: []
});

Result: taps work great, but (obviously) Hammer events don't work.

Hammer Manager with Swipe recogniser:

var bodyHammerManager = new Hammer.Manager(document.body, {
recognizers: [
[Hammer.Swipe]
]
});

Result: taps fail about 50% of the time. I think they fail as soon as I move my finger even the slightest bit during the tap. Again, this only fails on iOS, other platforms don't have any problems.

Final try

So I thought: well, perhaps the Swipe picks up all the taps and thinks they are swipes. So I changed some options that made it impossible for me to launch the Swipe events (so the options do work).

var bodyHammerManager = new Hammer.Manager(document.body, {
recognizers: [
[Hammer.Swipe, {'direction': Hammer.DIRECTION_HORIZONTAL, 'threshold': 100, 'velocity': 100}]
]
});

Result: unfortunately, no difference with the previous test. Taps still fail a lot, as soon as my finger moves a little.

If you want I can set up a test case, it's basically just a page with a link with a jQuery click event + the hammer code posted above. And again: this only fails in iOS.

[KrisVR]

Alright, I found a (dirty, dirty) hack that seems to work:

In the SwipeRecognizer inherit function, I changed:

getTouchAction: function() {
return PanRecognizer.prototype.getTouchAction.call(this);
},

Into:

getTouchAction: function() {
return false; // HACK
return PanRecognizer.prototype.getTouchAction.call(this);
},

Now all my click events work perfectly again, and swipe still works as well. That code must be there for a reason, so I know bypassing it is a dirty hack.

If you have a better suggestion, I'd be very interested.

[markuso]

I had the same problem and I was able to fix it by setting the Tap event's touchEvent option to manipulation instead of the default auto.

mc.add(new Hammer.Tap({ touchAction: 'manipulation' }));

After that, all tap events were triggering as expected. Hope it solves your issue as well.

[rdzar]

I've ran into this problem too. It seems to have something todo with the scrollbar on iOS. Whenever I swipe down (gesture up) the scrollbar shows, while scrolling (and scrollbar still shown) I try to tap something, nothing happens. If I tap again, because it felt like nothing happend, both taps are being triggered. The new and old (while scrolling one).

If I tap on an item after the scrollbar disappeared again it works as expected. Tried to fix it with delegation, but didn't solve the problem either.

The solution of @markuso didn't help for me unfortunately.

[rdzar]

Even worse, if I hit the scroll-tap bug and I wait exactly 10 seconds, it will trigger the tap anyway. So I either tap something or wait 10 seconds and it will trigger the tap anyway.

---

After debugging this from the events up to the root cause, it seems the Bluebird Promise isn't being resolved for some strange reason. Debugging on that now, but for the matter of this issue; invalid. (petkaantonov/bluebird#666)

[MacroX1990]

@markuso Thanks!!! finally it works in android and iphone after 1 day of research

[runspired]

Solution is likely always to set the correct touch-action, but there were some bugs present that affected this.

Resolved #838 #855 and Fixes to leaky config.