Preventdefault touch ios fix2 #131
Conversation
| const getTouchHandlerOption = props => { | ||
| if (props.touchHandlerOption) return props.touchHandlerOption | ||
| return props.preventDefaultTouchmoveEvent | ||
| ? { passive: false } |
There was a problem hiding this comment.
eventListener options no longer needed since this pr attaches touch listeners to the swipe container via ref callback
|
|
||
| set(() => { | ||
| set(state => { | ||
| if (state.props.trackMouse) { |
There was a problem hiding this comment.
add comment here about why we attach mouse tracking to document
// setup mouse listeners on document to track swipe if swipe leaves container
src/index.js
Outdated
| document.removeEventListener(touchEnd, onUp, touchHandlerOption) | ||
| } | ||
| set(state => { | ||
| if (state.props.trackMouse) { |
There was a problem hiding this comment.
remove set in stop since it only removes event listeners which is safe
| if (state.el === el) return state | ||
| if (state.el && state.el !== el) cleanUp(state.el) | ||
| if (state.props.trackTouch) { | ||
| if (el && el.addEventListener) { |
There was a problem hiding this comment.
comment all these if's
|
This solved my issue. @hartzis thank you very much for your help and especially for creating an alpha release of this feature 🎉 I'm going to close my PR |
|
@JiiB Thank you for your help in testing and pushing to get this issue fixed! It is fun to go on deep dives like this to truly understand how this stuff works. I got the tests updated tonight, should be able to get the docs updated and |
react-swipeable@5.1.0-alpha.1After more digging and exploration this mimics
v4by using arefcallback to then set thetouchstartandtouchmoveevent listeners before any touch/swipe starts being tracked.This solution is ultimately a work around for these issues:
{ passive: false }option set, which is needed to callpreventDefaulttouchmovebe attached before a touch event startspassiveoption defaults tofalsewhen attaching the touch listeners to the swiping container via theref, chrome/firefox and possibly iosdocumentthepassiveoption defaults totrueTODO:
touchHandlerOptionandpassiveevent listener notesuseSwipeable's returnedhandlershave a callbackrefnowinnerRefprop for<Swipeable />can only be a callback(el) => this.swipeable = el;