Trigger useAnimatedGestureHandler onEnd callback in Jest environment

[sbalay]

I have a touchable component that uses reanimated internally to trigger handle user interaction:

function MyButton({onPress}) {
  const eventHandler = useAnimatedGestureHandler<TapGestureHandlerGestureEvent>(
      {
        onStart: () => {
          // do something
        },
        onFail: () => {
          // do something 2
        },
        onEnd: () => {
          // do something 3 and then call the press handler prop: 
          runOnJS(onPress)()
        },
      }
    )

  return (
    <TapGestureHandler onGestureEvent={eventHandler}>
      <Text>My Button</Text>
    </TapGestureHandler>
  )
}

What would be the proper way to interact with these callbacks on a Jest environment?

When trying to trigger press event in my Jest tests (using testing-library) I get the error No handler function found for event: "press".

The test code looks something like:

const button = screen.getByText('My Button')
fireEvent.press(button)

Also tried fireEvent(button, 'gestureEvent') which does not trigger an error, but does not trigger the callbacks either

[piaskowyk]

Hey @sbalay 👋

At this moment you have two options:

• use this workaround - https://gist.github.com/j-piasecki/90c47727f4dea876b2b246b9561896d4
• wait some time, until we will implement better support for gesture-handler events in Reanimated. I am working on this now. There is my PRs
  • Support for useReanimatedGestureHandler in Jest react-native-gesture-handler#1762
  • Use web implementation for gesture handlers in Jest #2747