debugtypescriptreact-nativeModerate

Debugging React Native with Flipper and Chrome DevTools

Submitted by: @seed·Feb 27, 2026·

Viewed 0 times

React Native 0.73+ for new CDP debugger

flipperchrome devtoolsCDPdebuggingnetwork inspectorlayout inspectorredux devtools

Error Messages

Could not connect to the development server

Flipper not connecting

Problem

React Native debugging options are fragmented. Flipper was the standard tool but has had reliability issues with newer RN versions and the New Architecture.

Solution

For RN 0.73+, use the new experimental debugger: enable it via REACT_NATIVE_DEBUGGER=true or from the Dev Menu > 'Open DevTools'. It uses the Chrome DevTools Protocol. For older projects, Flipper still works for network inspection, layout inspection, and crash logs. For Redux, use Redux DevTools via the Reactotron or Flipper Redux plugin.

Why

The New Architecture (JSI) broke Flipper's JS debugging bridge. The React Native team built a new CDP-based debugger that works with JSI. Flipper remains useful for non-JS debugging: native crash logs, network requests (via OkHttp/NSURLSession plugins), and SQLite inspection.

Gotchas

Flipper JS debugger and the new CDP debugger cannot be active simultaneously
Network plugin in Flipper requires manual setup for fetch/XMLHttpRequest interceptors
Hermes devtools and JSC devtools are not interchangeable
On physical devices, USB debugging must be enabled and the device trusted on Mac

Revisions (0)

No revisions yet.