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

[0.74.0] stress reloading leads to broken state on android bridgeless

Open Kudo opened this issue 1 year ago • 2 comments

Description

On bridgeless mode, we have some sort of race condition from reloading.

  • one from https://github.com/facebook/react-native/blob/766ece7b9b1a578d5b7acd99bc8b0055e862fa86/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/runtime/BridgelessDevSupportManager.java#L111
  • the other from https://github.com/facebook/react-native/blob/766ece7b9b1a578d5b7acd99bc8b0055e862fa86/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/runtime/ReactHostImpl.java#L1203

so we will see two BUNDLE ./index.js from the cli terminal for each reload.

However, in some stress reload, the app will be in broken state. reloading is then broken and the app has an empty screen. not sure if that is coming from the second reload introduced in #42917. i think there is some race condition inside.

Steps to reproduce

  1. git clone https://github.com/Kudo/repro-RN074-android-reload
  2. cd repro-RN074-android-reload
  3. yarn android
  4. keep pressing "r" in terminal cli then the app will have the problem.

React Native Version

0.74.0

Affected Platforms

Runtime - Android, Build - MacOS

Areas

Bridgeless - The New Initialization Flow

Output of npx react-native info

info Fetching system and libraries information...
System:
  OS: macOS 14.4.1
  CPU: (8) arm64 Apple M1 Pro
  Memory: 99.13 MB / 32.00 GB
  Shell:
    version: 3.7.1
    path: /opt/homebrew/bin/fish
Binaries:
  Node:
    version: 20.12.2
    path: ~/.volta/tools/image/node/20.12.2/bin/node
  Yarn:
    version: 1.22.22
    path: ~/.volta/tools/image/yarn/1.22.22/bin/yarn
  npm:
    version: 10.5.0
    path: ~/.volta/tools/image/node/20.12.2/bin/npm
  Watchman:
    version: 2024.04.08.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.15.2
    path: /Users/kudo/.rbenv/shims/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 23.4
      - iOS 17.4
      - macOS 14.4
      - tvOS 17.4
      - visionOS 1.1
      - watchOS 10.4
  Android SDK:
    API Levels:
      - "29"
      - "30"
      - "31"
      - "33"
      - "34"
    Build Tools:
      - 30.0.2
      - 30.0.3
      - 31.0.0
      - 33.0.0
      - 33.0.1
      - 34.0.0
    System Images:
      - android-31 | Google Play ARM 64 v8a
      - android-33 | Google APIs ARM 64 v8a
      - android-33 | Google Play ARM 64 v8a
      - android-34 | Google Play ARM 64 v8a
    Android NDK: 23.1.7779620
IDEs:
  Android Studio: 2023.2 AI-232.10300.40.2321.11668458
  Xcode:
    version: 15.3/15E204a
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.9
    path: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/javac
  Ruby:
    version: 2.7.4
    path: /Users/kudo/.rbenv/shims/ruby
npmPackages:
  "@react-native-community/cli": Not Found
  react:
    installed: 18.2.0
    wanted: 18.2.0
  react-native:
    installed: 0.74.0
    wanted: 0.74.0
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true
iOS:
  hermesEnabled: Not found
  newArchEnabled: false


### Stacktrace or Logs

```text
okhttp.OkHttpClient  W  A connection to http://10.0.2.2:8081/ was leaked. Did you forget to close a response body? To see where this was allocated, set the OkHttpClient logger level to FINE: Logger.getLogger(OkHttpClient.class.getName()).setLevel(Level.FINE);
                         W  A connection to http://10.0.2.2:8081/ was leaked. Did you forget to close a response body? To see where this was allocated, set the OkHttpClient logger level to FINE: Logger.getLogger(OkHttpClient.class.getName()).setLevel(Level.FINE);
                         W  A connection to http://10.0.2.2:8081/ was leaked. Did you forget to close a response body? To see where this was allocated, set the OkHttpClient logger level to FINE: Logger.getLogger(OkHttpClient.class.getName()).setLevel(Level.FINE);
                         W  A connection to http://10.0.2.2:8081/ was leaked. Did you forget to close a response body? To see where this was allocated, set the OkHttpClient logger level to FINE: Logger.getLogger(OkHttpClient.class.getName()).setLevel(Level.FINE);

Reproducer

https://github.com/Kudo/repro-RN074-android-reload

Screenshots and Videos

https://github.com/facebook/react-native/assets/46429/085b67d6-abb5-459e-8e71-57d32566128e

Kudo avatar Apr 24 '24 17:04 Kudo

Ios has the same issue

Iuriy-Budnikov avatar May 03 '24 14:05 Iuriy-Budnikov

I believe https://github.com/facebook/react-native/pull/44554 will fix this for Android

javache avatar May 13 '24 13:05 javache

Closing as https://github.com/facebook/react-native/pull/44554 fixed it. @Kudo will verify that everything works on Expo's end, and we can consider picking it in 0.74 if necessary.

cortinico avatar May 28 '24 14:05 cortinico

thanks for fixing this problem. i can confirm it resolve the issue. since the fix comes with breaking change, let's keep it on 0.75. i had https://github.com/expo/expo/pull/29400 internally for 0.74 to workaround the problem.

Kudo avatar Jun 03 '24 14:06 Kudo

thanks for fixing this problem. i can confirm it resolve the issue. since the fix comes with breaking change, let's keep it on 0.75. i had expo/expo#29400 internally for 0.74 to workaround the problem.

Great so we'll be including it only in 0.75

cortinico avatar Jun 04 '24 10:06 cortinico