mantinedev / mantine

A fully featured React components library
https://mantine.dev
MIT License
25.27k stars 1.8k forks source link

use-move: console.errors due to missing options in touchevents #1412

Closed marhaupt closed 2 years ago

marhaupt commented 2 years ago

What package has an issue

@mantine/hooks

Describe the bug

There are many errors in Chrome console due to missing options for touch event listeners and e.preventDefault image More here https://chromestatus.com/feature/5093566007214080

In which browser did the problem occur

Chrome 100

If possible, please include a link to a codesandbox with the reproduced problem

Can be seen in official example - https://mantine.dev/hooks/use-move/#usage

Do you know how to fix the issue

Yes

Are you willing to participate in fixing this issue and create a pull request with the fix

Yes

Possible fix

Add { passive: false } to every touch listener, for example

ref.current?.addEventListener("touchstart", onTouchStart, { passive: false });
juninholiveira commented 2 years ago

I'm having the same problem, but using the RangeSlider from "@mantine/core"

image image

This console.error happens when I try to move the sliders from the RangeSlider on the browser, only when using Device Emulation on the Developer Tools. When using the mouse on desktop mode to drag, it works fine.