Native stack preload in combination with useEffect places the screens in the wrong order into the stack
Description
This issue was first opened in the react navigation repo. Issue: 12613
Current behavior
I have a heavy screen (render ~150ms) that I preload in a useEffect. I tested this bug on android and ios with the normal and native stack. It only happens on android with native stack.
When I navigate to the screen it slides in from the wrong side.
https://github.com/user-attachments/assets/f2c75311-9996-44f9-8738-f0253ade89d4
Expected behavior
The screen slides in from the correct side.
https://github.com/user-attachments/assets/b6a15bcf-c54b-437f-825b-6b1a2e901f3d
(This screen is preloaded with the onPressIn property)
Steps to reproduce
- Create a Native Stack Navigator
- Create Screens
- Preload a screen in a useEffect
Snack or a link to a repository
https://snack.expo.dev/@c_d_z/react-navigation-preload-bug
Screens version
4.10.0
React Native version
0.79.2
Platforms
Android
JavaScript runtime
Hermes
Workflow
Expo managed workflow
Architecture
Fabric (New Architecture)
Build type
Debug mode
Device
Android emulator
Device model
No response
Acknowledgements
Yes