search

facebook / react-native

A framework for building native applications using React
https://reactnative.dev
MIT License
119.05k stars 24.32k forks source link

Unable to use Hermes engine in fresh CLI project #46203

Closed arstropica closed 1 month ago

arstropica commented 2 months ago

Description

Starting from scratch with a new cli project which should use hermes as the default engine, the app falls back to the web socket extension. The missing SourceCode module error message is my only clue, but I am not sure why it occurs or how to fix it.

I have tried reinstalling node, ruby and cocoapods and then creating a new cli project, with no change. But if I install the basic expo development build, hermes works correctly without any issues.

I am thinking that the cause is a missing, outdated or broken dependency in my OS (macOS Sonoma 14.6.1). The bug is indirectly affecting my ability to develop using redux-devtools and react-native-debugger. Any assistance on how to track down the root cause would be greatly appreciated.

Thanks!

Steps to reproduce

  1. npm uninstall -g react-native-cli @react-native-community/cli
  2. npx @react-native-community/cli@latest init AwesomeProject
  3. npx react-native run-ios

React Native Version

0.75.2

Affected Platforms

Runtime - iOS, Build - MacOS

Output of npx react-native info

System:
  OS: macOS 14.6.1
  CPU: (36) x64 Intel(R) Xeon(R) W-2191B CPU @ 2.30GHz
  Memory: 60.57 GB / 128.00 GB
  Shell:
    version: 3.2.57
    path: /bin/bash
Binaries:
  Node:
    version: 18.20.4
    path: ~/.nvm/versions/node/v18.20.4/bin/node
  Yarn:
    version: 3.6.4
    path: ~/.yarn/bin/yarn
  npm:
    version: 10.7.0
    path: ~/.nvm/versions/node/v18.20.4/bin/npm
  Watchman:
    version: 2024.08.19.00
    path: /usr/local/bin/watchman
Managers:
  CocoaPods:
    version: 1.15.2
    path: /usr/local/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 23.5
      - iOS 17.5
      - macOS 14.5
      - tvOS 17.5
      - visionOS 1.2
      - watchOS 10.5
  Android SDK:
    API Levels:
      - "33"
      - "34"
    Build Tools:
      - 33.0.0
      - 34.0.0
      - 35.0.0
    Android NDK: Not Found
IDEs:
  Android Studio: 2021.2 AI-212.5712.43.2112.8815526
  Xcode:
    version: 15.4/15F31d
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 20.0.2
    path: /usr/bin/javac
  Ruby:
    version: 2.6.10
    path: /usr/bin/ruby
npmPackages:
  "@react-native-community/cli": Not Found
  react:
    installed: 18.3.1
    wanted: 18.3.1
  react-native:
    installed: 0.75.2
    wanted: 0.75.2
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: false
iOS:
  hermesEnabled: true
  newArchEnabled: false

Stacktrace or Logs

Running application AwesomeProject ({
    initialProps =     {
        concurrentRoot = 0;
    };
    rootTag = 1;
})
Invalidating <RCTCxxBridge: 0x10cf04dd0> (parent: <RCTBridge: 0x600003000000>, executor: RCTWebSocketExecutor)
Thread Performance Checker: Thread running at User-interactive quality-of-service class waiting on a thread without a QoS class specified. Investigate ways to avoid priority inversions
PID: 55395, TID: 1084959
Backtrace
=================================================================
3   CFNetwork                           0x00007ff8048e6dda estimatedPropertyListSize + 27583
4   CFNetwork                           0x00007ff804769d17 cfnTranslateCFError + 2029
5   libdispatch.dylib                   0x000000010bb469f7 _dispatch_client_callout + 8
6   libdispatch.dylib                   0x000000010bb48095 _dispatch_once_callout + 66
7   CFNetwork                           0x00007ff804769ceb cfnTranslateCFError + 1985
8   CFNetwork                           0x00007ff8048e6c82 estimatedPropertyListSize + 27239
9   libdispatch.dylib                   0x000000010bb469f7 _dispatch_client_callout + 8
10  libdispatch.dylib                   0x000000010bb48095 _dispatch_once_callout + 66
11  CFNetwork                           0x00007ff8048e6bab estimatedPropertyListSize + 27024
12  CFNetwork                           0x00007ff8048e6bf6 estimatedPropertyListSize + 27099
13  libdispatch.dylib                   0x000000010bb469f7 _dispatch_client_callout + 8
14  libdispatch.dylib                   0x000000010bb48095 _dispatch_once_callout + 66
15  CFNetwork                           0x00007ff8048e6be5 estimatedPropertyListSize + 27082
16  CFNetwork                           0x00007ff8047b09a0 _CFStreamErrorFromCFError + 189030
17  CoreFoundation                      0x00007ff800412c57 _CFStreamOpen + 135
18  AwesomeProject                      0x00000001096d866d -[SRProxyConnect _openConnection] + 189
19  AwesomeProject                      0x00000001096d79dc -[SRProxyConnect _configureProxy] + 988
20  AwesomeProject                      0x00000001096d713b -[SRProxyConnect openNetworkStreamWithCompletion:] + 91
21  AwesomeProject                      0x00000001096dbaf8 -[SRWebSocket open] + 744
22  AwesomeProject                      0x0000000108f03a4d -[RCTReconnectingWebSocket start] + 173
23  AwesomeProject                      0x0000000108eebbfb -[RCTPackagerConnection init] + 507
24  AwesomeProject                      0x0000000108eeb9dc __49+[RCTPackagerConnection sharedPackagerConnection]_block_invoke + 28
25  libdispatch.dylib                   0x000000010bb469f7 _dispatch_client_callout + 8
26  libdispatch.dylib                   0x000000010bb48095 _dispatch_once_callout + 66
27  AwesomeProject                      0x0000000108eeb98e +[RCTPackagerConnection sharedPackagerConnection] + 78
28  AwesomeProject                      0x0000000108f8e8ce -[RCTDevSettings initialize] + 142
29  AwesomeProject                      0x0000000108ed4ec8 -[RCTModuleData _initializeModule] + 104
30  AwesomeProject                      0x0000000108ed474e -[RCTModuleData setUpInstanceAndBridge:] + 2894
31  AwesomeProject                      0x0000000108ed6670 -[RCTModuleData instance] + 1408
32  AwesomeProject                      0x0000000108e70f86 -[RCTCxxBridge moduleForName:lazilyLoadIfNecessary:] + 790
33  AwesomeProject                      0x0000000108e71460 -[RCTCxxBridge moduleForClass:] + 80
34  AwesomeProject                      0x0000000108f92598 -[RCTBridge(RCTDevSettings) devSettings] + 56
35  AwesomeProject                      0x0000000108e76aa0 -[RCTCxxBridge executeSourceCode:withSourceURL:sync:] + 320
36  AwesomeProject                      0x0000000108e6fa97 __21-[RCTCxxBridge start]_block_invoke.212 + 151
37  libdispatch.dylib                   0x000000010bb45747 _dispatch_call_block_and_release + 12
38  libdispatch.dylib                   0x000000010bb469f7 _dispatch_client_callout + 8
39  libdispatch.dylib                   0x000000010bb5aa97 _dispatch_root_queue_drain + 1047
40  libdispatch.dylib                   0x000000010bb5b3b5 _dispatch_worker_thread2 + 277
41  libsystem_pthread.dylib             0x000000010bac3b43 _pthread_wqthread + 262
42  libsystem_pthread.dylib             0x000000010bac2acf start_wqthread + 15
Invariant Violation: TurboModuleRegistry.getEnforcing(...): 'SourceCode' could not be found. Verify that a module by this name is registered in the native binary. Bridgeless mode: false. TurboModule interop: false. Modules loaded: {"NativeModules":["PlatformConstants","DevSettings","LogBox","Timing","SettingsManager","AppState"],"TurboModules":[],"NotFound":["NativePerformanceObserverCxx","NativePerformanceCxx","NativeReactNativeFeatureFlagsCxx","SourceCode"]}, js engine: hermes
'Is using Hermes: ', true
Invariant Violation: TurboModuleRegistry.getEnforcing(...): 'SourceCode' could not be found. Verify that a module by this name is registered in the native binary. Bridgeless mode: false. TurboModule interop: false. Modules loaded: {"NativeModules":["PlatformConstants","DevSettings","LogBox","Timing","SettingsManager","AppState"],"TurboModules":[],"NotFound":["NativePerformanceObserverCxx","NativePerformanceCxx","NativeReactNativeFeatureFlagsCxx","SourceCode"]}, js engine: hermes
Unbalanced calls start/end for tag 1
Unbalanced calls start/end for tag 19
Running application AwesomeProject ({
    initialProps =     {
        concurrentRoot = 0;
    };
    rootTag = 11;
})

Reproducer

https://github.com/arstropica/AwesomeProject

Screenshots and Videos

Screenshot 2024-08-24 at 12 16 43 PM

cipolleschi commented 2 months ago

Hey @arstropica can you try running:

npx @react-native-community/cli@latest init AwesomeProject --version latest

instead and report back?

arstropica commented 2 months ago

npx @react-native-community/cli@latest init AwesomeProject --version latest

No problems with the installation.

Downloading template
✔ Copying template
✔ Processing template
✔ Installing dependencies
✔ Do you want to install CocoaPods now? Only needed if you run your project in Xcode directly … yes
✔ Installing Ruby Gems
✔ Installing CocoaPods dependencies  (this may take a few minutes)
info 💡 To enable automatic CocoaPods installation when building for iOS you can create react-native.config.js with automaticPodsInstallation field. 
For more details, see https://github.com/react-native-community/cli/blob/main/docs/projects.md#projectiosautomaticpodsinstallation

✔ Initializing Git repository

  Run instructions for Android:
    • Have an Android emulator running (quickest way to get started), or a device connected.
    • cd "/Users/estate/dev/code/react/AwesomeProject" && npx react-native run-android

  Run instructions for iOS:
    • cd "/Users/estate/dev/code/react/AwesomeProject"

    • npx react-native run-ios
    - or -
    • Open AwesomeProject/ios/AwesomeProject.xcworkspace in Xcode or run "xed -b ios"
    • Hit the Run button

  Run instructions for macOS:
    • See https://aka.ms/ReactNativeGuideMacOS for the latest up-to-date instructions.

But when I build and run the app in Xcode, it launches with the same error as previously reported:

Running application AwesomeProject ({
    initialProps =     {
        concurrentRoot = 0;
    };
    rootTag = 1;
})
Invalidating <RCTCxxBridge: 0x107f11c70> (parent: <RCTBridge: 0x600003038000>, executor: RCTWebSocketExecutor)
Thread Performance Checker: Thread running at User-interactive quality-of-service class waiting on a thread without a QoS class specified. Investigate ways to avoid priority inversions
PID: 39266, TID: 6761176
Backtrace
=================================================================
3   CFNetwork                           0x00007ff8048e6dda estimatedPropertyListSize + 27583
4   CFNetwork                           0x00007ff804769d17 cfnTranslateCFError + 2029
5   libdispatch.dylib                   0x0000000105d469f7 _dispatch_client_callout + 8
6   libdispatch.dylib                   0x0000000105d48095 _dispatch_once_callout + 66
7   CFNetwork                           0x00007ff804769ceb cfnTranslateCFError + 1985
8   CFNetwork                           0x00007ff8048e6c82 estimatedPropertyListSize + 27239
9   libdispatch.dylib                   0x0000000105d469f7 _dispatch_client_callout + 8
10  libdispatch.dylib                   0x0000000105d48095 _dispatch_once_callout + 66
11  CFNetwork                           0x00007ff8048e6bab estimatedPropertyListSize + 27024
12  CFNetwork                           0x00007ff8048e6bf6 estimatedPropertyListSize + 27099
13  libdispatch.dylib                   0x0000000105d469f7 _dispatch_client_callout + 8
14  libdispatch.dylib                   0x0000000105d48095 _dispatch_once_callout + 66
15  CFNetwork                           0x00007ff8048e6be5 estimatedPropertyListSize + 27082
16  CFNetwork                           0x00007ff8047b09a0 _CFStreamErrorFromCFError + 189030
17  CoreFoundation                      0x00007ff800412c57 _CFStreamOpen + 135
18  AwesomeProject                      0x00000001038a966d -[SRProxyConnect _openConnection] + 189
19  AwesomeProject                      0x00000001038a89dc -[SRProxyConnect _configureProxy] + 988
20  AwesomeProject                      0x00000001038a813b -[SRProxyConnect openNetworkStreamWithCompletion:] + 91
21  AwesomeProject                      0x00000001038acaf8 -[SRWebSocket open] + 744
22  AwesomeProject                      0x00000001030d4a4d -[RCTReconnectingWebSocket start] + 173
23  AwesomeProject                      0x00000001030bcbfb -[RCTPackagerConnection init] + 507
24  AwesomeProject                      0x00000001030bc9dc __49+[RCTPackagerConnection sharedPackagerConnection]_block_invoke + 28
25  libdispatch.dylib                   0x0000000105d469f7 _dispatch_client_callout + 8
26  libdispatch.dylib                   0x0000000105d48095 _dispatch_once_callout + 66
27  AwesomeProject                      0x00000001030bc98e +[RCTPackagerConnection sharedPackagerConnection] + 78
28  AwesomeProject                      0x000000010315f8ce -[RCTDevSettings initialize] + 142
29  AwesomeProject                      0x00000001030a5ec8 -[RCTModuleData _initializeModule] + 104
30  AwesomeProject                      0x00000001030a574e -[RCTModuleData setUpInstanceAndBridge:] + 2894
31  AwesomeProject                      0x00000001030a7670 -[RCTModuleData instance] + 1408
32  AwesomeProject                      0x0000000103041f86 -[RCTCxxBridge moduleForName:lazilyLoadIfNecessary:] + 790
33  AwesomeProject                      0x0000000103042460 -[RCTCxxBridge moduleForClass:] + 80
34  AwesomeProject                      0x0000000103163598 -[RCTBridge(RCTDevSettings) devSettings] + 56
35  AwesomeProject                      0x0000000103047aa0 -[RCTCxxBridge executeSourceCode:withSourceURL:sync:] + 320
36  AwesomeProject                      0x0000000103040a97 __21-[RCTCxxBridge start]_block_invoke.212 + 151
37  libdispatch.dylib                   0x0000000105d45747 _dispatch_call_block_and_release + 12
38  libdispatch.dylib                   0x0000000105d469f7 _dispatch_client_callout + 8
39  libdispatch.dylib                   0x0000000105d5aa97 _dispatch_root_queue_drain + 1047
40  libdispatch.dylib                   0x0000000105d5b3b5 _dispatch_worker_thread2 + 277
41  libsystem_pthread.dylib             0x0000000105ca9b43 _pthread_wqthread + 262
42  libsystem_pthread.dylib             0x0000000105ca8acf start_wqthread + 15
Invariant Violation: TurboModuleRegistry.getEnforcing(...): 'SourceCode' could not be found. Verify that a module by this name is registered in the native binary. Bridgeless mode: false. TurboModule interop: false. Modules loaded: {"NativeModules":["PlatformConstants","DevSettings","LogBox","Timing","SettingsManager","AppState"],"TurboModules":[],"NotFound":["NativePerformanceObserverCxx","NativePerformanceCxx","NativeReactNativeFeatureFlagsCxx","SourceCode"]}, js engine: hermes
Invariant Violation: TurboModuleRegistry.getEnforcing(...): 'SourceCode' could not be found. Verify that a module by this name is registered in the native binary. Bridgeless mode: false. TurboModule interop: false. Modules loaded: {"NativeModules":["PlatformConstants","DevSettings","LogBox","Timing","SettingsManager","AppState"],"TurboModules":[],"NotFound":["NativePerformanceObserverCxx","NativePerformanceCxx","NativeReactNativeFeatureFlagsCxx","SourceCode"]}, js engine: hermes
Unbalanced calls start/end for tag 1
Unbalanced calls start/end for tag 19
Invariant Violation: Failed to call into JavaScript module method AppRegistry.runApplication(). Module has not been registered as callable. Bridgeless Mode: false. Registered callable JavaScript modules (n = 9): Systrace, JSTimers, HeapCapture, SamplingProfiler, RCTLog, RCTDeviceEventEmitter, RCTNativeAppEventEmitter, GlobalPerformanceLogger, HMRClient.
          A frequent cause of the error is that the application entry file path is incorrect. This can also happen when the JS bundle is corrupt or there is an early initialization error when loading React Native., js engine: hermes
Running application AwesomeProject ({
    initialProps =     {
        concurrentRoot = 0;
    };
    rootTag = 11;
})

I also confirmed that SourceCode is present in the project, just not sure why Turbo Native Modules can't find it.

Screenshot 2024-08-28 at 1 00 00 PM

cipolleschi commented 2 months ago

Uhm... there is something weird in the environment. I just spin up a new app from 0.75.2 and I can't reproduce the issue...

Screenshot 2024-08-29 at 10 49 34

Could you create a reproducer using this template?

arstropica commented 2 months ago

Thanks. The SourceCode error is gone with the reproducer and hermes appears to be working correctly (I can use it with react-devtools). There is a different error which seems to be unrelated to the engine.

Running application ReproducerApp ({
    initialProps =     {
        concurrentRoot = 0;
    };
    rootTag = 1;
})
Thread Performance Checker: Thread running at User-interactive quality-of-service class waiting on a thread without a QoS class specified. Investigate ways to avoid priority inversions
PID: 84923, TID: 8058146
Backtrace
=================================================================
3   CFNetwork                           0x00007ff8048e6dda estimatedPropertyListSize + 27583
4   CFNetwork                           0x00007ff804769d17 cfnTranslateCFError + 2029
5   libdispatch.dylib                   0x00000001134789f7 _dispatch_client_callout + 8
6   libdispatch.dylib                   0x000000011347a095 _dispatch_once_callout + 66
7   CFNetwork                           0x00007ff804769ceb cfnTranslateCFError + 1985
8   CFNetwork                           0x00007ff8048e6c82 estimatedPropertyListSize + 27239
9   libdispatch.dylib                   0x00000001134789f7 _dispatch_client_callout + 8
10  libdispatch.dylib                   0x000000011347a095 _dispatch_once_callout + 66
11  CFNetwork                           0x00007ff8048e6bab estimatedPropertyListSize + 27024
12  CFNetwork                           0x00007ff8048e6bf6 estimatedPropertyListSize + 27099
13  libdispatch.dylib                   0x00000001134789f7 _dispatch_client_callout + 8
14  libdispatch.dylib                   0x000000011347a095 _dispatch_once_callout + 66
15  CFNetwork                           0x00007ff8048e6be5 estimatedPropertyListSize + 27082
16  CFNetwork                           0x00007ff8047b09a0 _CFStreamErrorFromCFError + 189030
17  CoreFoundation                      0x00007ff800412c57 _CFStreamOpen + 135
18  ReproducerApp                       0x000000011057622d -[SRProxyConnect _openConnection] + 189
19  ReproducerApp                       0x000000011057559c -[SRProxyConnect _configureProxy] + 988
20  ReproducerApp                       0x0000000110574cfb -[SRProxyConnect openNetworkStreamWithCompletion:] + 91
21  ReproducerApp                       0x00000001105796b8 -[SRWebSocket open] + 744
22  ReproducerApp                       0x000000010fda160d -[RCTReconnectingWebSocket start] + 173
23  ReproducerApp                       0x000000010fd897bb -[RCTPackagerConnection init] + 507
24  ReproducerApp                       0x000000010fd8959c __49+[RCTPackagerConnection sharedPackagerConnection]_block_invoke + 28
25  libdispatch.dylib                   0x00000001134789f7 _dispatch_client_callout + 8
26  libdispatch.dylib                   0x000000011347a095 _dispatch_once_callout + 66
27  ReproducerApp                       0x000000010fd8954e +[RCTPackagerConnection sharedPackagerConnection] + 78
28  ReproducerApp                       0x000000010fe2c48e -[RCTDevSettings initialize] + 142
29  ReproducerApp                       0x000000010fd72a88 -[RCTModuleData _initializeModule] + 104
30  ReproducerApp                       0x000000010fd7230e -[RCTModuleData setUpInstanceAndBridge:] + 2894
31  ReproducerApp                       0x000000010fd74230 -[RCTModuleData instance] + 1408
32  ReproducerApp                       0x000000010fd0eb46 -[RCTCxxBridge moduleForName:lazilyLoadIfNecessary:] + 790
33  ReproducerApp                       0x000000010fd0f020 -[RCTCxxBridge moduleForClass:] + 80
34  ReproducerApp                       0x000000010fe30158 -[RCTBridge(RCTDevSettings) devSettings] + 56
35  ReproducerApp                       0x000000010fd14660 -[RCTCxxBridge executeSourceCode:withSourceURL:sync:] + 320
36  ReproducerApp                       0x000000010fd0d657 __21-[RCTCxxBridge start]_block_invoke.212 + 151
37  libdispatch.dylib                   0x0000000113477747 _dispatch_call_block_and_release + 12
38  libdispatch.dylib                   0x00000001134789f7 _dispatch_client_callout + 8
39  libdispatch.dylib                   0x000000011348ca97 _dispatch_root_queue_drain + 1047
40  libdispatch.dylib                   0x000000011348d3b5 _dispatch_worker_thread2 + 277
41  libsystem_pthread.dylib             0x00000001129bab43 _pthread_wqthread + 262
42  libsystem_pthread.dylib             0x00000001129b9acf start_wqthread + 15
Unbalanced calls start/end for tag 19
Running "ReproducerApp" with {"rootTag":1,"initialProps":{"concurrentRoot":false}}

Reproducer: https://github.com/arstropica/reproducer-react-native

cipolleschi commented 2 months ago

stack trace

This is a warning, not a bug. Also is weird that I don't have it in my stack trace.

Unbalanced calls start/end for tag 19

This is something in the application code of the Template. There is some tag the is not closed properly... If you clean up the UI it should go away.

arstropica commented 2 months ago

I am trying to determine what, if anything, is different between the AwesomeProject and Reproducer projects, since hermes works in the latter and not the former. Will post any findings here.

thanks.

arstropica commented 2 months ago

Uhm... there is something weird in the environment. I just spin up a new app from 0.75.2 and I can't reproduce the issue...

I diffed the reproducer and starter project files - there were differences in some of the ruby gems that had identical versions (specifically ffi). I think that something about my system ruby installation is broken (which still doesn't fully explain why the reproducer project works on my system).

cipolleschi commented 2 months ago

I strongly suggest to use a ruby environment manager (my favorite is rbenv). This simplify the handling of ruby and gems dramatically.

arstropica commented 2 months ago

I strongly suggest to use a ruby environment manager (my favorite is rbenv). This simplify the handling of ruby and gems dramatically.

yeah, that was my next move as well. Any advice on which version to install?

cipolleschi commented 2 months ago

let's start with the latest, to stay on the safe side. React Native should work with any version of ruby, tbh...

cortinico commented 1 month ago

@arstropica is this resolved? Can we close it?

arstropica commented 1 month ago

@arstropica is this resolved? Can we close it?

Yes. I resolved the main issue that prevented Hermes from running by removing my Gemfile.lock file and then rebuilding pods using the following command.

bundle install && RCT_NEW_ARCH_ENABLED=1 bundle exec pod install

I am still working through some associated errors relating to networking and thread management, but they are not within the scope of the issue.