Use the tool on a React Native project without Flipper or react-native-debugger app

[fabiendem]

Intended outcome:

I want to use the Apollo Client Devtools in a React Native project, without Flipper or the React Native Debugger (https://github.com/jhen0409/react-native-debugger).

https://github.com/jhen0409/react-native-debugger is gradually losing love from the RN community because Flipper was the go to solution. Now Flipper is getting replaced with an integrated Chrome debugger.

Actual outcome:

I have added the extension to my browser, but without much surprise, it doesn't connect to my react native app. I'm curious if I am missing something, or if it's not possible for now.

Thank you!

How to reproduce the issue:

• Install the Chrome extension
• Start the RN app in DEV mode, with connectToDevTools: true,
• Try to connect the client to the dev tool in Chrome
• It times out

Desktop (please complete the following information):

• OS: [e.g. iOS] Android
• Browser [e.g. chrome, safari] Chrome
• Browser version [e.g. 22] 126.0.6478.62 (Official Build) (arm64)
• Extension version [e.g. 3.0] Latest 4.15.2

[jerelmiller]

Hey @fabiendem 👋

I'm a bit unfamiliar with any of the RN debuggers as I've not worked much with React Native, but cool to hear an integrated Chrome debugger is there.

The devtools work by relying on the client instance setting window.__APOLLO_CLIENT__ to itself when connectToDevTools is true. Is the RN app a remote instance? Perhaps check to see if window.__APOLLO_CLIENT__ is getting set in the browser?

I'll have to dig into the specifics of how the Chrome debugger and RN work together, but I'm afraid I have some other priorities at the moment so I can't commit to anything yet.

[fabiendem]

Hey @jerelmiller, Thank you, ok understood 👍

Here are some interesting links FYI:

• https://github.com/react-native-community/discussions-and-proposals/discussions/733
• RFC https://github.com/react-native-community/discussions-and-proposals/pull/641

I am also clueless about how the debugger is connected to the app. I will ask over there if they can provide any guidance.

[fabiendem]

Asked at https://github.com/react-native-community/discussions-and-proposals/discussions/733#discussioncomment-9894320

[jerelmiller]

Appreciate the links! This is helpful.

[fabiendem]

cc https://github.com/react-native-community/discussions-and-proposals/discussions/733#discussioncomment-9904398