Hammer.js: The browser that supports pointer event, The Hammer doesn't work.

[sculove]

Chrome has began supporting PointerEvent since version 55.
If you don't set inputType on Hammer.manager, Hammer use Pointer Event as a InputType.

But, Hammer.js has bug about Pointer Event.
The Hammer doesn't work anything.

related issues

1082, #1071, #1068, #1067, #1065, #1058, #1056, #1054, #1048

[sculove]

I did check versions.

• v2.0.8 ok
• v2.0.7 ok
• v2.0.6 ok

the master branch is broken.

[shubhojitroy3]

https://www.chromestatus.com/feature/5642080642662400

[sateffen]

The main problem is, that the "pointerout" event is connected to the INPUT_CANCEL trigger, and chrome triggers the pointerout event, just like the pointerleave event, when moving the finger one millimeter triggers the pointerout event, so the gestures will cancel at move immediatly. This might cause maybe all problems, where the default is the native pointerevents in chrome on a touch device.

The bug is a chrome bug, I filed it here

You can upvote the bug there, dunno, but as long as the bug lasts there, the pointerevents are unusable in chrome, and should not be the default.

[sculove]

@sateffen This seems to be another problem.
I found bug that occurred when converting to ES2015 class in hammerjs.
When using the pointer event, the calling order has changed.
Therefore, pointer event doesn't be attached. (I sent pr #1085 :))

[itaischw]

Have you tested it on mobile web?
try even do inspect and go to mobile view in chrome - select a mobile device there.
I don't see it working only if you are not in Device mode it works.
I took you branch and compiled it.

[Sembiance]

Google has marked the bug sateffen filed as: WontFix

So right now, in Chrome on Android this library has major problems.

In general though, this library appears to be abandoned and is no longer being updated/maintained. Darn.

[sateffen]

@Sembiance the main problem was me, not chrome. if you read the issue, you'll see, that I forgot to define the touch-action, which leads to unexpected behaviour in this case. Moving the finger without a touch-action defined will lead to a scroll-gesture. The browser consumes all following events, so your code gets a pointerout. If you define touch-action=none, the browser won't try to scroll, and you can handle the touch events for your gestures as you like.

The other point is pointer-capturing, which prevents pointerleave events in most cases. To get the basic idea you can read this.

That points should solve most of your problems, even with hammerjs.

[grumpygary]

You can add the following code to the end of the assign(hammer, { ... section in v2.0.8 (at the end):

    ,supportPointerEvents(arg) { 
        return SUPPORT_POINTER_EVENTS = arg !== false && prefixed(window, 'PointerEvent') !== undefined; 
    }

Then, call Hammer.supportPointerEvents(false); on app startup (before adding instantiating items). This will effectively turn the pointer-events processing off; and make many of these problem go away (for now anyway).

[arthursp]

For those who just need the option when developing :

In hammer.js v2.0.8

line 384 : var SUPPORT_POINTER_EVENTS = false;

[Finesse]

Here is an easy-peasy solution (no need to modify the library code):

const hammer = new Hammer(
  document.getElementById('gesture-element'),
  { inputClass: Hammer.TouchMouseInput } // Does the trick
);
hammer.on('swipe', event => {
  console.log('Swipe works');
});

I tested in with Hammer 2.0.8 on Chrome (Mac), Safari (Mac and iOS 13) and iOS 13 webview.

[iblatnick]

So running into similar issues with Hammer however nothing here is working, when I disabled touch-action it completely killed scrolling for me, but translateX was working fine as I handle that myself, the problem I'm having is when I try to use both in conjunction the browser is hijacking my horizontal gestures and treating them as scrolls.

[AndreVanKammen]

I've tried to implement something with pointer-events in chrome but I run into so many bugs i'm thinking about switching back to mouse and touch.

-On windows desktop I don't get a mouse event for a secondly pressed button (2 buttons down)
-On android it's just a mess, i have a Note 10 lite
-1st I get a mouse event, secondly the pen, both are marked primary only pen gets updated
-Pen constantly generates new pointer-id's
-Touches also generate new id's after down so I loose track

I have an example with output running here:

https://shadersynth.com/pointer-test.html

It returns the info of the last primary pointer, all code is unobfuscated on that site.

I should report this on chrome somewhere? If somebody has a link i will report it there, this was the 1st place i could find mention of problems with pointer-events,