IjzerenHein / IjzerenHein/react-navigation-shared-element
[v5] - Weird behavior with react-native-reanimated v2
- Dominant language
- TypeScript
- Stars
- 1.3k
- Forks
- 125
- PR merge metrics
- No merged PRs in 30d
Description
I am getting some weird behavior using `react-navigation-shared-element` with the new r`eact-native-reanimated` version 2. Almost 100% of the time, the element I am sharing throw the pages just "stucks" and go to the position with no transition.
### Preview:

### Project dependencies:
````json
{
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject"
},
"dependencies": {
"@react-native-community/masked-view": "0.1.10",
"@react-navigation/native": "^5.0.9",
"@react-navigation/stack": "^5.1.1",
"axios": "^0.21.0",
"expo": "~39.0.2",
"expo-status-bar": "~1.0.2",
"react": "16.13.1",
"react-dom": "16.13.1",
"react-native": "https://github.com/expo/react-native/archive/sdk-39.0.4.tar.gz",
"react-native-gesture-handler": "~1.7.0",
"react-native-reanimated": "~1.13.0",
"react-native-safe-area-context": "3.1.4",
"react-native-screens": "~2.10.1",
"react-native-shared-element": "^0.7.0",
"react-native-web": "~0.13.12",
"react-navigation-shared-element": "^5.0.0-alpha1"
},
"devDependencies": {
"@babel/core": "~7.9.0",
"@types/react": "~16.9.35",
"@types/react-dom": "~16.9.8",
"@types/react-native": "~0.63.2",
"typescript": "~3.9.5"
},
"private": true
}
````
Contributor guide
No contributing guide indexed for this repository
Research direction
Start by reproducing the shared-element transition with the dependency versions listed in the issue, especially react-native-reanimated, react-navigation-shared-element, and Expo SDK 39. Compare the behavior with the reported preview; done means identifying the version interaction or other cause and restoring the transition rather than leaving the element stuck.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react-native
- Domain
- mobile
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 25/100