Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Automatically set touch-action: none #214

Open
appsforartists opened this issue May 2, 2017 · 4 comments
Open

Automatically set touch-action: none #214

appsforartists opened this issue May 2, 2017 · 4 comments

Comments

@appsforartists
Copy link
Member

There's a maddening property of PointerEvents: touch only triggers one move unless you set touch-action. I know this and it still bites me occasionally - I imagine it's even more frustrating for people who haven't worked with touch before.

Here's a potential solution:

  • Check style.touchAction and getComputedStyle(target).touchAction for auto
  • If it is auto, cache the current value, then set style.touchAction = none
  • When the drag is completed, revert the style change.

It does the right thing for the most common situtation and deflect to the author's decision if one has been made. Still, if that's too magical, we can also try this:

  • If NODE_ENV !== production, use getComputedStyle to assert that touchAction !== auto, and log a warning if it is.
@davidkpiano
Copy link

Putting this here for reference - might be good to see how Hammer.JS handles this: http://hammerjs.github.io/touch-action

@appsforartists
Copy link
Member Author

Sounds like they auto-set it based on a combination of which gesture you're listening to and what parameters are passed in. Have you played with Hammer and its touchAction property before?

@appsforartists
Copy link
Member Author

💻 I'm working on a diff at http://codereview.cc/D3151

@appsforartists
Copy link
Member Author

http://crbug.com/717796 was marked WontFix. Thus, we'd have to set the style permanently, not just in pointerdown, to do this effectively.

Maybe we should. It defeats the point of having Draggable be an interaction if you need to know to set this magic CSS property for it to work correctly in Chrome with a touchscreen. I'm reluctant to automatically set a CSS property, but it seems better than the alternative.

If @jverkoey's proposal to add enable() and disable() methods to interactions lands, those would be a good place to check axis and set element.style.touchAction appropriately.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants