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

Preventdefault touch ios fix2 #131

Merged
merged 6 commits into from
Mar 20, 2019
Merged

Conversation

hartzis
Copy link
Collaborator

@hartzis hartzis commented Mar 18, 2019

After more digging and exploration this mimics v4 by using a ref callback to then set the touchstart and touchmove event listeners before any touch/swipe starts being tracked.

This solution is ultimately a work around for these issues:

TODO:

  • update tests
  • update docs
    • 🎉 clean up all touchHandlerOption and passive event listener notes
    • document how useSwipeable's returned handlers have a callback ref now
      • since it was documented to spread this onto the node this should be backwards compatible and only a minor bump
    • document how innerRef prop for <Swipeable /> can only be a callback
      • exp: (el) => this.swipeable = el;
  • update changelog

const getTouchHandlerOption = props => {
if (props.touchHandlerOption) return props.touchHandlerOption
return props.preventDefaultTouchmoveEvent
? { passive: false }
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

eventListener options no longer needed since this pr attaches touch listeners to the swipe container via ref callback

function getHandlers(set, props) {
const onStart = event => {
// if more than a single touch don't track, for now...
if (event.touches && event.touches.length > 1) return

set(() => {
set(state => {
if (state.props.trackMouse) {
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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) {
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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) {
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

comment all these if's

@JiiB
Copy link

JiiB commented Mar 18, 2019

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

@hartzis
Copy link
Collaborator Author

hartzis commented Mar 19, 2019

@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 5.1.0 published this week!

@hartzis hartzis merged commit 3932868 into master Mar 20, 2019
@hartzis hartzis mentioned this pull request Mar 21, 2019
@hartzis hartzis deleted the preventdefault-touch-ios-fix2 branch June 26, 2020 20:54
@github-actions github-actions bot mentioned this pull request May 18, 2023
@paulmarsicloud paulmarsicloud mentioned this pull request Jun 1, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

(5.x) preventDefaultTouchmoveEvent (Mobile Safari?)
2 participants