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

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

Open aurangs7 opened this issue 1 year ago • 9 comments

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

https://github.com/user-attachments/assets/ff412bed-0cb8-4b70-ab1a-762ea5f07dd5

aurangs7 avatar Sep 18 '24 06:09 aurangs7

:warning: Missing Reproducible Example
:information_source: 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 avatar Sep 18 '24 06:09 react-native-bot

:warning: Missing Reproducible Example
:information_source: We could not detect a reproducible example in your issue report. Please provide either:

react-native-bot avatar Sep 18 '24 06:09 react-native-bot

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.

huntie avatar Sep 18 '24 11:09 huntie

facing the same issue with react native 0.75.3

atulbhuriya avatar Sep 19 '24 11:09 atulbhuriya

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.

aurangs7 avatar Sep 19 '24 11:09 aurangs7

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

expertcoderbuck avatar Sep 20 '24 05:09 expertcoderbuck

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

yungblud avatar Sep 21 '24 13:09 yungblud

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

aurangs7 avatar Oct 04 '24 09:10 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?

Dhanraj-Naik avatar Oct 26 '24 10:10 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?

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

aurangs7 avatar Oct 28 '24 06:10 aurangs7

I think I am facing a similar problem. When I print the Date object to the console with console.log, I see an empty object. but if I call Date.toLocaleString() function, I can see the date as a string. I am using latest version of react native(0.77.1)

cetfu avatar Feb 16 '25 11:02 cetfu

When I print the Date object to the console with console.log, I see an empty object. but if I call Date.toLocaleString() function, I can see the date as a string.

@cetfu Did you find any solution for this? I am getting the same issue on react native 0.79.2 with new react native debugger.

HamidAliSE avatar Jul 17 '25 12:07 HamidAliSE

i didn't tried again. i forgot

cetfu avatar Jul 18 '25 17:07 cetfu