React-native-gesture-handler: Cannot read property 'Direction' of undefined

[ajboxjr]

Hello,
I have just installed Pods so I can incorporate blinkid. I only started reciving this issue when I linked react-native-gesture to a podfile.

Here is my code
App.js
`/**

• Sample React Native App
• https://github.com/facebook/react-native
  *
• @format
• @flow
• @lint-ignore-every XPLATJSCOPYRIGHT1
  */

import React, {Component} from 'react';
import {Platform, StyleSheet, Text, View} from 'react-native';
// import store from './app/store/store'
import { Provider } from 'mobx-react';
// import {UserStore} from './app/store/UserStore'
import {RootStore} from './app/store/RootStore'
import NavigationService from './app/navigation/NavigationService'
// const store = configuireStore({})
import RootNavigator from './app/navigation/RootNavigator'
const instructions = Platform.select({
ios: 'Press Cmd+R to reload,\n' + 'Cmd+D or shake for dev menu',
android:
'Double tap R on your keyboard to reload,\n' +
'Shake or press menu button for dev menu',
});

type Props = {};
export default class App extends Component {
render() {
this.store = RootStore.create({})
return (
ref={navigatorRef => {
NavigationService.setTopLevelNavigator(navigatorRef)}}/>

);
}
}

const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
welcome: {
fontSize: 20,
textAlign: 'center',
margin: 10,
},
instructions: {
textAlign: 'center',
color: '#333333',
marginBottom: 5,
},
});`
RootNavigator

`import { createAppContainer, createStackNavigator } from 'react-navigation'
import PreNavigator from './PreNavigator.js'
import MainNavigator from './MainNavigator'
const RootStack = createStackNavigator({
Pre: {
screen: PreNavigator
},
Main: {
screen: MainNavigator
}
},
{
initialRouteName: 'Main',
headerMode: 'none',
navigationOptions: {
headerVisible: false,
gesturesEnabled: true
}
})

export default createAppContainer(RootStack)`

[ajboxjr]

Solved my own problem.

1. Right Click Libraries "Add Files to Project"
2. /node_modules/react-native-gesture-handlers/ios/RNGestureHandler.xcodeproj
3. Go to build phases and add libRNGestureHandler.a
4. Run

[henninghall]

For Cocoapods project, dont forget to install pods after linking:

cd ios
pod install

[etcaples]

I was able to fix my same issue of 'Direction' undefined with @matheushf comment in Issue #344. On my end, looks like our jest setup file hadn't included a config for gesture handling.

Edit: fixed broken url link

[rochapablo]

@etcaples, I believe that the link is broken. Can you share your solution?

[etcaples]

@rochapablo For sure, just updated the link above.

[cielojrdev]

For Cocoapods project, dont forget to install pods after linking:

cd ios
pod install

This should be added to the installation docs

[lissau]

It is not necessary to create a setup file as @etcaples references in her comment. The jest setup is hidden in the documentation as @andreialecu writes in issue #344

Add to "jest" in package.json:
setupFiles: [ "./node_modules/react-native-gesture-handler/jestSetup.js" ]

[adkaushik]

For Cocoapods project, dont forget to install pods after linking:

cd ios
pod install

@henninghall Sadly the issue persists even after pod install.

[NathanNovak]

What about solving the same error for android??

[budowski]

What about solving the same error for android??

This worked for me on Android:
react-native link react-native-gesture-handler

[developerk786]

Not working on Android still the same errorl, integrated react-native-gesture-handler when using react-native-tab-view

[Sir-hennihau]

What fixed it for me on android:

1. Follow steps on https://reactnavigation.org/docs/en/hello-react-navigation.html
2. $ react-native run-android
3. Restart app on your device
4. Restart development server $ react-native start

[pke]

For me this is happening only in tests:

import "react-native"
import React from "react"
import App from "./App"

// Note: test renderer must be required after react-native.
import renderer from "react-test-renderer"

it("renders correctly", () => {
  renderer.create(<App />)
})

App is using @react-navigation/native which depends on gesture handler.
In my index.js its the firt import and the app runs fine, just this one test fails.

[krishnapaul242]

@pke Same problem with my setup.
Its running fine but this test is getting failed.

[Sakarisson]

@pke did you ever manage to solve the issue? Running into it as well

[Sakarisson]

Actually, managed to get the Jest issue working myself. Pretty straight-forward. Just include the following line in your jest setup (or in the offending file)

import 'react-native-gesture-handler/jestSetup';

[jakub-gonet]

If you still experience this problem, please open a new issue.