Reactotron not connecting

[JonCognioDigital]

Hi,

I installed Reactotron tonight and it seemed to work well at first, I started installing plugins and playing with logging. It was all going great until all of a sudden it won't connect.

No errors. just nothing....

I am using Expo, a real Android device using Expo's tunneling, my lan IP is 192.168.0.22:19000

Here is my config

import url from "url"
import { NativeModules } from "react-native";
import Reactotron, { asyncStorage, openInEditor, networking, trackGlobalErrors } from 'reactotron-react-native'
import { reactotronRedux } from "reactotron-redux"
import apisaucePlugin from 'reactotron-apisauce'

const { hostname } = url.parse(NativeModules.SourceCode.scriptURL)

const reactotron = Reactotron
  .configure({host: hostname })
  .use(networking())
  .use(reactotronRedux())
  .use(asyncStorage())
  .use(openInEditor())
  .use(trackGlobalErrors())
  .use(apisaucePlugin({
    // ignoreContentTypes: /^(image)\/.*$/i   // <--- a way to skip printing the body of some requests (default is any image)
  }))
  .useReactNative()
  .connect()

  export default reactotron

[skellock]

What does hostname resolve to? Hopefully 192.168.0.22. Just the IP address itself.

You can update that whole reactotron block to become:

const reactotron = Reactotron
  .configure({ host: hostname })
  .useReactNative()
  .use(reactotronRedux())

Notice how I removed the connect() call?

The reason is because there's a timing issue where if you don't have redux setup yet, the app will connect and ask for data from the store before redux comes to life.

For redux apps, it's better to defer the Reactotron.connect() call to the componentDidMount function of the root component.

Give that a shot.

[JonCognioDigital]

That's absolutely perfect and worked first time.

Can I assume that:

.use(networking()) .use(asyncStorage()) .use(openInEditor())

etc. aren't needed because they're used by default or did you just remove them from your example for brevity and I need to add all the plugins back in?

[rmevans9]

He removed them as they are setup via the .useReactNative() bit. useReactNative is a helper call to setup all plugins that are shipped with reactotron-react-native.

ref: https://github.com/infinitered/reactotron/blob/master/packages/reactotron-react-native/src/index.js#L70

[JonCognioDigital]

Thanks,

I can see from that page that the only plugin not ncluded by default is apiSauce so I'll keep that in.

Unfortunately, tonight it has stopped working again completely. I had to switch to using the expo app because for some reason Expo had stopped showing console.logs in the console (or anything after starting the package manager actually which was some kind of bug I couldn't work out). Since switching to the Expo app Reactotron hasn't worked, despite still being in LAN mode on the same API and desite moving the .connect() call to App.js componentDidMount (which had previously fixed the problem).

I'm now just getting absolutely nothing from Reactotron, but it is still connecting to React Native Debugger with no problems.

[JonCognioDigital]

I ran netstat to see if anything was listening on port 9090 and it seems like every few secons Reactotron is trying to establish a connection from a different port on an internal IP ending in 26. Is this right?

[Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:37266 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:37274 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:37283 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:37291 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:37299 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:37306 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:37313 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:37324 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:37339 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:37358 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:37367 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:37375 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:37385 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:37398 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:37407 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:37425 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:37432 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:37440 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:37477 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:49936 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:49943 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:49956 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:49964 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:49969 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:49972 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:49980 ESTABLISHED [Reactotron.exe] TCP 192.168.0.22:9090 192.168.0.26:49987 ESTABLISHED [Reactotron.exe]

[rmevans9]

I know Expo and reactotron has had some connectivity issues. In your configure I would suggest adding your IP as the host to see if that makes it work. Something like this:

.configure({ host: '<YOUR IP>' })

Yes, apisauce plugin is not on there as it is not shipped with reactotron-react-native. That said the networking plugin supersedes the apisauce plugin as it listens to all network traffic in RN (at least in the RN side, not the native side)

[JonCognioDigital]

Ah ok, I was wondering what else it would give me but if it doesn't then I'll remove it. I am already configuring my hostName (you can see how in my first post) but it doesn't seem to make any difference now. The Reactotron client doesn't seem to have any options so I'm running out of ideas trying to work out if my code isn't broadcasting correctly or Reactotron isn't listening correctly. There must be a mismatch somewhere but hunting it down is difficult.

[JonCognioDigital]

OK, so I think I'm ready to give up on this now and just use React Native Debugger. Which is a shame as it looks like Reactotron has some nice features. Thanks for trying to help me out but I'm now back to the most basic implementation, no plugins, no redux, just a simple .configure() with the correct hostname and connect() inside my App's componentDidMount and unfortunately the Reactotron client is completely unresponsive and sees no connections.

[rmevans9]

Hey @jon64digital,

I am sorry to hear that you are still having this trouble. Can I ask if you can put a small repo up reproducing this issue so that I can actually try and fix it locally so I can provide better solutions?

Thanks!

[bsendras]

@jon64digital I had a similar issue with the project that I am currently working on. Reactotron.app never received a connection from my application. No errors, no logs, no nothing. I tested it on a separate brand new app, following the minimal config as is explained in the RADME file. That worked fine. But there were no difference between both apps configs. So I check both package.json files.

What my non-working project had:

    "reactotron-react-native": "^1.14.0",
    "reactotron-redux": "^1.13.0", // because I keep the navigation state in my redux store, you might not have/need this.

What my new test working project had:

    "reactotron-react-native": "^2.1.0",
    "reactotron-redux": "^2.1.0",

So I installed those new versions of reactotron dependencies, build the app again and finally it was able to connect to Reactotron.app(v2.1.2 by the way).

Hope, it helps.

[gabmichels]

@bsendras awesome mate, that worked for me. cheers!

[pengcao1]

@bsendras great. It's worked for me. thanks

[crobinson42]

For me I had to put in my machines local IP to get it to connect

Reactotron
  .configure({ host: '192.168.0.148' })
  .useReactNative()
  .connect

[shrikant-thd]

For me, I was using "reactotron-react-native": "^1.14.0" but my Reactotron version was 2.6.0

I upgraded "reactotron-react-native": "^2.6.0" but that still didn't work for me. So downgraded it back to 1.14.0 and did the same to Reactotron and it finally worked.

[rmevans9]

Hmm... it is concerning that you were having connectivity issues on the later version of reactotron. I will do some testing to see if I can figure out what is going wrong.

[kevinvangelder]

For anyone having connectivity issues, remember that you'll need to run adb reverse tcp:9090 tcp:9090 every time you reconnect your physical device or emulator. Most likely everyone above has already done this, but for any new users that come here looking for answers it might be helpful.

[xstable]

I got some trouble too with this. I've tried with IP, which didn't work. After doing the adb reverse tcp:9090 tcp:9090 and removing the 'host' property from config() it works now. Thanks @kevinvangelder

[Fredsters]

I'm using a real ios device for developing. Also I use expo. https://expo.io.

I use connection over lan.

I use version "reactotron-react-native": "^3.2.2". Reactotron is on version 2.11.2-beta.1 I have tried Reactotron.configure({lan: 'exp://192.168.0.241:19000'}).useReactNative() with various parameters. .connect() is called in componentDidMount

How can I do the adb reverse tcp:9090 tcp:9090 thing. In the command line? I get: error: no devices/emulators found

[rmevans9]

Adb is an android utility so it will not work in your case. I would suggest putting your machines up in the host property in your configure call

[Fredsters]

I did use it like this Reactotron.configure({host: '<my-ip-address>'}).useReactNative() now.... And it worked! I am sure I already tried it like this before. I tried it now on a differenct Pc and used the msi installation (not the exe) maybe that made a difference? However it works now. Thank you very much.

[Fredsters]

Still doesn't work on my other Pc. Don't know why...

[Fredsters]

I added a rule in my firewall to open port 9090, now it works on this pc as well. Thanks for help and I hope I can help others in the future.

[chulijimmi]

Here my setup

Phone connected over wifi -> IP 192.168.0.4 MacbookPro (as server) connected over wifi -> IP 192.168.0.3 Reactotron run in macbook port 9090 React Native run on server port 9091

So first time we should reverse the adb port 9090 to 9091. Which is the reactotron on the phone is looking for port 9090 and the server run on port 9091.

Command step 1 adb reverse tcp:9090 tcp:9091

After it we want to connect our phone over wifi, so just run Command step 2 adb tcpip 5555 Command step 3 adb connect 192.168.0.4:5555

To run react native I recommend to use script in package.json

Command step 4 react-native run-android --port 9091

The last one check your reactotron configuration

Reactotron
.configure({
    host: '192.168.0.3',
    name: 'appname'
})
.useReactNative()
.connect();

And done reactotron connected. For troubleshooting make sure adb kill-server and run adb start-server again and check your firewall on your server.

[gsklee]

@rmevans9 I think there are two ways to solve this issue:

• We settle on the fact that this is not a Reactotron-specific problem but something endemic to how an Android RN app works with a dev server, create a section in the README and ask everyone to modify their npm start script to run adb reverse before running react-native start

• We could try executing the adb reverse shell script from Node.js whenever a new reactotron-core-server instance is being spinning up

[giscafer]

same issue

[rmevans9]

@gsklee There is actually some code that tries to solve this issue and the fix might be much simpler then that. We have a library that tries to get the IP address from RN directly when using a dev version of the app. I think the problem is no one really knows this and overwrites the host option when using configure. The fix might be as simple as "Don't pass host when calling configure". That said @giscafer can you please show us your configure call for reactotron?

Ref: https://github.com/infinitered/reactotron-react-native/blob/master/src/reactotron-react-native.ts#L21

[gsklee]

@rmevans9 Not true; this issue happens when you don't set any option within .configure() as well. According to the RN docs the adb reverse step is necessary for Android and either the users have to do it themselves or Reactotron can do it for the users; for example this is how React Native Debugger does it: https://github.com/jhen0409/react-native-debugger/blob/04db26a283532966a55ddb9ecdd7dd3615b1e6d1/app/utils/adb.js

[rmevans9]

Hmm then the getHost code is not working like it used to. Could probably pull that out while making the change to handle this better.

[MicxSamonte]

this issue still persist on my workspace. already did the ff:

• adb reverse the port 9090 (and checked via reverse list)
• set the machine ip on the Reactotron configure host param
• verified if the host machine is visible in the LAN from the device (via pingtools)
• restart packagers and rerun app everytime

I'm using Reactotron 2.15.1, and my RN package versions are the ff:

    "reactotron-react-native": "^2.1.0",
    "reactotron-redux": "^2.1.0",
    "reactotron-redux-saga": "^3.0.0",

[ChenhuaWANG22]

In my case, it's the WIFI NETWORK TYPE which blocks Reactotron to discover my PC.

I use a Windows 10 PC and a real android mobile phone to do testing and they are in the same home network domain. Both mobile phone and PC connect to the router by Wifi. I have to set the wifi type to PRIVATE NETWORK on PC instead of PUBLIC NETWORK to make Reactotron connect correctly.

I discover this during adding a rule in my firewall to open port 9090. At the end I found it's not the rules which work but the type of network. Well, still thank you @Fredsters.

Hope it will help others.