Reactotron Freezing after Initial Connection

[ishansingh2003]

Hi Team, I installed latest reactotron tool version number reactotron-app@3.1.1. I did all the setup on M1 Mac Ventura OSX. Once i refresh my app i see the logs for a fraction of a second and then the tool goes blank. See the attached video.

https://github.com/infinitered/reactotron/assets/5089525/825b9ddb-f788-4817-8f79-190495643a5a

[jamonholmgren]

If you hit Cmd+Opt+i to open the Reactotron inspector and click on Console, do you see any error messages?

[ishansingh2003]

Hi @jamonholmgren , Thanks for reply. This is what i see in reactotron logs

Do i need another app version ? If not the latest one

[jamonholmgren]

Okay interesting. Thanks for the info. Any other info on your setup that you can share?

[ishansingh2003]

Here are my dev details from my package.json "dependencies": { "@react-native-async-storage/async-storage": "^1.18.1", "@react-native-community/blur": "^4.3.2", "@react-native-community/checkbox": "^0.5.15", "@react-native-community/netinfo": "^9.4.1", "@react-native-firebase/analytics": "^18.6.1", "@react-native-firebase/app": "^18.6.1", "@react-native-firebase/crashlytics": "^18.6.1", "@react-native-firebase/messaging": "^18.6.1", "@react-native-firebase/remote-config": "^18.6.1", "@react-native-picker/picker": "^2.4.10", "@react-navigation/bottom-tabs": "^6.5.7", "@react-navigation/native": "^6.1.6", "@react-navigation/native-stack": "^6.9.12", "@react-navigation/stack": "^6.3.16", "@reduxjs/toolkit": "^1.9.5", "@types/luxon": "^3.3.0", "@types/react-native-base64": "^0.2.0", "axios": "^1.4.0", "formik": "^2.4.1", "html-entities": "^2.4.0", "lodash": "^4.17.21", "luxon": "^3.3.0", "mathjs": "^11.8.0", "react": "^18.2.0", "react-airplay": "^1.2.0", "react-dom": "^18.2.0", "react-native": "0.71.8", "react-native-base64": "^0.2.1", "react-native-blob-util": "^0.18.4", "react-native-branch": "5.8.0", "react-native-check-version": "^1.1.1", "react-native-code-push": "^8.0.2", "react-native-collapsible": "^1.6.1", "react-native-date-picker": "^4.2.13", "react-native-device-info": "^10.6.0", "react-native-encrypted-storage": "^4.0.3", "react-native-fast-image": "^8.6.3", "react-native-gesture-handler": "^2.12.0", "react-native-get-random-values": "^1.9.0", "react-native-linear-gradient": "^2.6.2", "react-native-localization": "^2.3.1", "react-native-mime-types": "^2.4.0", "react-native-navigation": "7.33.3-hotfix.3", "react-native-orientation-locker": "^1.5.0", "react-native-permissions": "^3.10.1", "react-native-picker-select": "^8.0.4", "react-native-reanimated": "3.3.0", "react-native-render-html": "^6.3.4", "react-native-safe-area-context": "^4.5.3", "react-native-screens": "3.20.0", "react-native-shared-element": "^0.8.8", "react-native-svg": "^13.9.0", "react-native-video": "^6.0.0-alpha.6", "react-native-web": "^0.19.4", "react-native-webview": "^12.0.2", "react-navigation-shared-element": "^3.1.3", "react-redux": "^8.0.5", "uuid": "^9.0.0", "validator": "^13.11.0", "yup": "^1.2.0" }, "devDependencies": { "@babel/core": "^7.20.0", "@babel/preset-env": "^7.20.0", "@babel/runtime": "^7.20.0", "@react-native-community/datetimepicker": "^7.4.1", "@react-native-community/eslint-config": "^3.2.0", "@react-native-community/slider": "^4.4.2", "@storybook/addon-actions": "^6.5.14", "@storybook/addon-controls": "^6.5.14", "@storybook/addon-essentials": "^6.5.14", "@storybook/addon-links": "^6.5.14", "@storybook/addon-ondevice-actions": "^6.5.1", "@storybook/addon-ondevice-backgrounds": "^6.5.1", "@storybook/addon-ondevice-controls": "^6.5.1", "@storybook/addon-ondevice-notes": "^6.5.1", "@storybook/addon-react-native-web": "^0.0.19", "@storybook/builder-webpack5": "^6.5.16", "@storybook/manager-webpack5": "^6.5.16", "@storybook/react": "^6.5.14", "@storybook/react-native": "^6.5.3", "@testing-library/jest-native": "^5.4.2", "@testing-library/react": "^14.0.0", "@testing-library/react-native": "^12.1.2", "@tsconfig/react-native": "^2.0.2", "@types/jest": "^29.2.1", "@types/lodash": "^4.14.194", "@types/mathjs": "^9.4.2", "@types/react": "^18.0.24", "@types/react-native-linear-gradient": "^2.4.0", "@types/react-native-video": "^5.0.15", "@types/react-test-renderer": "^18.0.0", "@types/uuid": "^9.0.2", "babel-jest": "^29.2.1", "babel-loader": "^9.1.2", "babel-plugin-react-native-web": "^0.19.4", "eslint": "^8.19.0", "jest": "^29.2.1", "jsdoc-babel": "^0.5.0", "metro-react-native-babel-preset": "0.73.9", "patch-package": "^7.0.2", "prettier": "^2.4.1", "react-scripts": "^5.0.1", "react-test-renderer": "18.2.0", "typescript": "4.8.4", "url-loader": "^4.1.1", "webpack": "^5.84.0", "webpack-cli": "^5.1.1", "webpack-dev-server": "^4.15.0" },

[ishansingh2003]

let me know if you want something specific. It's all it does shows logs for a secs and then phoof I have Xcode (Version 14.3.1 (14E300c))

[joshuayoes]

@ishansingh2003 I don't see any reactotron packages in your package.json.

Can you donpm install reactotron-core-client@latest and npm install reactotron-react-native@latest in your app and try again?

[ishansingh2003]

Hi @joshuayoes , Sorry i did changed branches that's why the package.json is diff.Just to be sure i tried your steps again but of no luck.

[joshuayoes]

Can you try a fresh install? Like removing your node_modules and doing npm install? I've had an issue like this but it was during one of the beta versions and it makes me wonder if an old version is getting used.

[joshuayoes]

Additionally, checkout any Reactotron.display or Reactotron.preview calls in your app and see if there is anything missing

[ishansingh2003]

Hi @joshuayoes , It's still the same, deleted all node modules and .lock files. re installed pods, but it's still the same. Also, i don't have any Reactotron.display or Reactotron.preview call in my app.

[joshuayoes]

@ishansingh2003 can you post a reproduction? If you could strip out all of the sensitive info out of your app, isolate Reactotron, and post it to a GitHub repo, I can clone it down and investigate further.

[ishansingh2003]

Hi @joshuayoes , I am sorry, it would be difficult to post my repo, as it's a really big project and difficult to just put my isolated Reactotron code. Let me see what i can do.

[frankcalise]

Could you post your reactotron set up (connection, configuration of plugins) and which packages you are using?

Would be helpful to know what data you're logging out.

Seems like something unexpected from https://github.com/infinitered/reactotron/blob/4ec6cc161761339edf2aede28593d90109411242/lib/reactotron-core-ui/src/timelineCommands/LogCommand/index.tsx#L176

Maybe we could try/catch here? My only thought is it's a function or something being passed?

[ishansingh2003]

Hi @frankcalise, Apologies for late reply, I was off for new year. I will send you my setup

"reactotron-core-client": "^2.8.11", "reactotron-react-native": "^5.0.4",

I am following the boilerplate setup for reactotron as per the documentation from here (https://github.com/infinitered/reactotron/blob/master/docs/quick-start/react-native.md#installing-reactotronapp)

[ahmed-abdelkader-00]

I'm also experiencing the same issue in one of my projects, it is happening only in android but iOS is working fine.

[alfilimonov]

The same. Tried like 4 versions of reactotron and still the same.

Timeline tab crashes each time app performing api request

[morganick]

@alfilimonov does this happen for all API requests or just a specific one? What's the payload size and type returned by the API?

[ishansingh2003]

The same. Tried like 4 versions of reactotron and still the same.

Timeline tab crashes each time app performing api request

I am also facing the same, as soon as i click on timeline, it crashes.

[asen23]

Could you post your reactotron set up (connection, configuration of plugins) and which packages you are using?

Would be helpful to know what data you're logging out.

Seems like something unexpected from

https://github.com/infinitered/reactotron/blob/4ec6cc161761339edf2aede28593d90109411242/lib/reactotron-core-ui/src/timelineCommands/LogCommand/index.tsx#L176

Maybe we could try/catch here? My only thought is it's a function or something being passed?

I think you can trigger the error easily by passing null to the function you linked.

I tried to run the function in my browser and passing null make it throw

I can easily reproduce the bug by doing console.log(null) too

maybe to fix it just check for null in the beginning rather than the end