react-native version 0.75.3 Hermes logs not working properly: Not expanding the object

[aurangs7]

Description

In React Native version 0.75.3, Hermes engine logs are not working as expected. Specifically, when logging objects, the objects are not expanding fully, making it difficult to debug and inspect object properties.

Steps to reproduce

Steps to Reproduce:

1. Update the react-native version from 0.74.2 to 0.75.3.

2. Enable Hermes in iOS and Android both

3. Create a component that logs an object in the console, for example:

   const obj = { name: 'John', age: 30, details: { city: 'New York' } };
   console.log(obj);

4. Run the app on an Android device or emulator (npx react-native run-android).

5. Open the debug console to view the Hermes logs.

Expected behavior:

• The logged object should expand, allowing inspection of its nested properties.

Actual behavior:

• The object is not expanding in the console, only showing a collapsed version, preventing inspection of deeper object properties.

React Native Version

0.75.3

Output of npx react-native info

System:
  OS: macOS 15.0
  CPU: (8) arm64 Apple M1
  Memory: 126.66 MB / 8.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 22.3.0
    path: ~/.nvm/versions/node/v22.3.0/bin/node
  Yarn:
    version: 3.6.4
    path: /opt/homebrew/bin/yarn
  npm:
    version: 10.8.3
    path: ~/.nvm/versions/node/v22.3.0/bin/npm
  Watchman:
    version: 2024.04.29.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.14.0
    path: /opt/homebrew/lib/ruby/gems/3.3.0/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 24.0
      - iOS 18.0
      - macOS 15.0
      - tvOS 18.0
      - visionOS 2.0
      - watchOS 11.0
  Android SDK:
    Android NDK: 22.1.7171670
IDEs:
  Android Studio: 2024.1 AI-241.18034.62.2412.12266719
  Xcode:
    version: 16.0/16A242d
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.12
    path: /usr/bin/javac
  Ruby:
    version: 3.3.3
    path: /opt/homebrew/opt/ruby/bin/ruby
npmPackages:
  "@react-native-community/cli": Not Found
  react:
    installed: 18.3.1
    wanted: 18.3.1
  react-native:
    installed: 0.75.3
    wanted: 0.75.3
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: false
iOS:
  hermesEnabled: true
  newArchEnabled: false

Screenshots and Videos

Screen.Recording.2024-09-18.at.11.50.20.mov

[react-native-bot]

⚠️	Missing Reproducible Example
ℹ️	We could not detect a reproducible example in your issue report. Please provide either: If your bug is UI related: a Snack If your bug is build/update related: use our Reproducer Template. A reproducer needs to be in a GitHub repository under your username.

[react-native-bot]

⚠️	Missing Reproducible Example
ℹ️	We could not detect a reproducible example in your issue report. Please provide either: If your bug is UI related: a Snack If your bug is build/update related: use our Reproducer Template

[huntie]

Hey @aurangs7! We previously included a Hermes fix in 0.74.1 that I believe is related to this issue. I'd recommend checking that Hermes is updated correctly via CocoaPods/Gradle.

Note that object inspection will be thoroughly fixed from React Native 0.76 in our new React Native DevTools stack.

[atulbhuriya]

facing the same issue with react native 0.75.3

[aurangs7]

Hi @huntie
Thank you for the response.
This issue is real, I tried it on 3 projects, running on react-native 0.75.3 and having debugging issues. Facing below issues:

1. Chrome DevTools window does not show logs after some time
2. After some time the objects are not expanding / The debugger not showing logs

I have to close and open the DevTools window again to get the logs and after some time it also does not respond.

If possible, try opening the DevTools window for some time and then try expanding the logs.

[expertcoderbuck]

I am also getting this, not sure if it is related to redux states logs or for every log.

[yungblud]

Same here!
(I am alternatively using reactotron to see the logs now)

[aurangs7]

Hi @huntie, Hope you are doing well. Do we have any updates here? Anything required from my end to solve this?

[Dhanraj-Naik]

Hi @huntie Thank you for the response. This issue is real, I tried it on 3 projects, running on react-native 0.75.3 and having debugging issues. Facing below issues:

1. Chrome DevTools window does not show logs after some time
2. After some time the objects are not expanding / The debugger not showing logs

I have to close and open the DevTools window again to get the logs and after some time it also does not respond.

If possible, try opening the DevTools window for some time and then try expanding the logs.

hey @aurangs7 have you found any solutions to this?

[aurangs7]

Hi @huntie Thank you for the response. This issue is real, I tried it on 3 projects, running on react-native 0.75.3 and having debugging issues. Facing below issues:

1. Chrome DevTools window does not show logs after some time
2. After some time the objects are not expanding / The debugger not showing logs

I have to close and open the DevTools window again to get the logs and after some time it also does not respond.
If possible, try opening the DevTools window for some time and then try expanding the logs.

hey @aurangs7 have you found any solutions to this?

For now, I am using Reactotron as mentioned by @yungblud