[0.83] Multi-host compatibility for Network and Performance in React Native DevTools

[huntie]

Multiple React Native hosts warning

If you're on this page, you might have seen the following message in React Native DevTools in versions 0.83 and onwards. This happens when we've conditionally disabled the Performance and Network features, based on detecting a multiple React Native host setup.

What this means

The Network and Performance features cross over with parts of React Native's architecture that exist outside the scope of a given React Native Host, breaking out of the strict lifecycle model for our debugger. As such, this could lead to undefined behaviour via data being emitted across hosts — so we are disabling these features for safety.

Having multiple hosts in a React Native app is not the default configuration, and does not happen under the Community Template or Expo, but may exist in some specialist or brownfield app setups.

When are we fixing this?

We have a design for correctly scoping these features so that we can safely support them under multiple hosts, and intend to update them in future. However, we have no planned timeline for this fix at this moment.

[mjmasn]

[Resolved in RC5] Multi-host detection false positive for legacy Hermes ConnectionDemux targets (Reanimated / react-native-worklets)

@huntie just to check, if we're seeing the '...multiple React Native hosts, which is not currently supported' message on the network and performance tabs in RN 0.83.0-rc.x, is that likely due to something like react-native-worklets (used by react-native-reanimated)?

[dannyhw]

[In progress] Expo Go launcher compatibility

hi @huntie I seem to be getting this in expo go apps, is that expected? (expo 55, react native 83)

[colaquecez]

Yeah the issue is the new RN version, I needed to downgrade to 0.83.4.

[MaganAnkur]

I am using 0.83.4 but still getting it

[colaquecez]

@MaganAnkur did you update the react-native-worklets? I needed to also downgrade that to 0.7.2

[MaganAnkur]

Yes @colaquecez here is my dependency list: #954 (reply in thread)

[darpsoft]

I'm using "react-native": "0.83.8" + "react-native-reanimated": "4.3.0" + "react-native-worklets": "0.8.1", and I applied this patch—it works perfectly for me.

react-native-worklets+0.8.1.patch

diff --git a/node_modules/react-native-worklets/Common/cpp/worklets/WorkletRuntime/WorkletHermesRuntime.cpp b/node_modules/react-native-worklets/Common/cpp/worklets/WorkletRuntime/WorkletHermesRuntime.cpp
index 22388b6..3ec7882 100644
--- a/node_modules/react-native-worklets/Common/cpp/worklets/WorkletRuntime/WorkletHermesRuntime.cpp
+++ b/node_modules/react-native-worklets/Common/cpp/worklets/WorkletRuntime/WorkletHermesRuntime.cpp
@@ -63,8 +63,14 @@ WorkletHermesRuntime::WorkletHermesRuntime(
     const std::string &name)
     : jsi::WithRuntimeDecorator<WorkletsReentrancyCheck>(*runtime, reentrancyCheck_), runtime_(std::move(runtime)) {
 #if HERMES_ENABLE_DEBUGGER && !defined(HERMES_V1_ENABLED)
-  auto adapter = std::make_unique<HermesExecutorRuntimeAdapter>(*runtime_, jsQueue);
-  debugToken_ = chrome::enableDebugging(std::move(adapter), name);
+  // FOODIE PATCH: skip worklet debug target registration to avoid RN 0.83.5+
+  // false-positive "multiple React Native hosts" in DevTools, which disables
+  // the Network and Performance tabs. See react-native-community/
+  // discussions-and-proposals#954. Revert once upstream fix lands.
+  (void)jsQueue;
+  (void)name;
+  // auto adapter = std::make_unique<HermesExecutorRuntimeAdapter>(*runtime_, jsQueue);
+  // debugToken_ = chrome::enableDebugging(std::move(adapter), name);
 #endif // HERMES_ENABLE_DEBUGGER && !defined(HERMES_V1_ENABLED)
 
 #ifndef NDEBUG
@@ -92,8 +98,9 @@ WorkletHermesRuntime::WorkletHermesRuntime(
 
 WorkletHermesRuntime::~WorkletHermesRuntime() {
 #if HERMES_ENABLE_DEBUGGER && !defined(HERMES_V1_ENABLED)
+  // FOODIE PATCH: paired with the skipped enableDebugging call above.
   // We have to disable debugging before the runtime is destroyed.
-  chrome::disableDebugging(debugToken_);
+  // chrome::disableDebugging(debugToken_);
 #endif // HERMES_ENABLE_DEBUGGER && !defined(HERMES_V1_ENABLED)
 }