setPointerCapture does not apprear to be working on google Chrome

Question

In trying to make a program I am developing touch friendly, I switched to using pointer events from using mouse events. In testing how it operated using touch input on several browsers, it worked fine on Firefox on Windows 10, and on mobile Safari on iOS. But touch was giving problems on Chrome. I traced it down to the setPointerCapture method when using touch. I thought it was a problem with my code, but found that the setPointerCapture method wasn't working example on the manual page https://developer.mozilla.org/en-US/docs/Web/API/Element/releasePointerCapture either. Here the "SLIDE ME" example at the bottom of the page does not slide using touch on Chrome on my touchscreen laptop (Lenovo Flex 5), but works fine using a mouse in Chrome, or using the other browsers. My question is, is there a setting I need to have in Chrome to fix this, is it a problem with my laptop, or is it really a bug?

Answer 1

You probably need to set touch-action to none on the element to avoid this issue:

  touch-action: none;

The touch-action CSS property sets how an element's region can be manipulated by a touchscreen user (for example, by zooming features built into the browser).