react-native-screens icon indicating copy to clipboard operation
react-native-screens copied to clipboard

Native stack preload in combination with useEffect places the screens in the wrong order into the stack

Open CD-Z opened this issue 7 months ago • 0 comments

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

  1. Create a Native Stack Navigator
  2. Create Screens
  3. 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

CD-Z avatar May 24 '25 11:05 CD-Z