Double touch tap workaround for React based on onTouchTap (react-tap-event-plugin)

isDblTouchTap.js

const dblTouchTapMaxDelay = 300
let latestTouchTap = {
  time: 0,
  target: null,
}

export default function isDblTouchTap(event) {
  const touchTap = {
    time: new Date().getTime(),
    target: event.currentTarget,
  }
  const isFastDblTouchTap = (
    touchTap.target === latestTouchTap.target &&
    touchTap.time - latestTouchTap.time < dblTouchTapMaxDelay
  )
  latestTouchTap = touchTap
  return isFastDblTouchTap
}

onDoubleTouchTap example.js

// add onTouchTap support to avoid 300ms onClick delay on touchscreen (like iOS)
import injectTapEventPlugin from "react-tap-event-plugin"
injectTapEventPlugin()
import isDblTouchTap from "./isDblTouchTap"
// ...

<div
  onTouchTap={ (e) => {
    if (isDblTouchTap(e)) {
      // == onDblTouchTap
    }
  } }
>
  ...
</div>

Awesome, thanks! 👍

On click seems to be working fine with react