From 511f29b8a701064a01143356bc8e3cfbcba147b8 Mon Sep 17 00:00:00 2001
From: Moti Zilberman <moti@meta.com>
Date: Thu, 21 Mar 2024 10:39:33 -0700
Subject: [PATCH] Detect non-Fusebox frontends and log a message (#43574)

Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/43574

Changelog: [Internal]

Once we start rolling out the Fusebox backend, users might still try to use the debugger frontends they're used to, for which we can't guarantee reliability. Let's detect this and log a message letting them know about the supported Fusebox launch flows.

Reviewed By: huntie

Differential Revision: D55122115

fbshipit-source-id: a17c0c6b9140059f489e0852fe673306fb6ef8f5
---
 .../jsinspector-modern/HostAgent.cpp          | 24 +++++++++++++++++--
 .../jsinspector-modern/HostAgent.h            |  4 ++++
 .../jsinspector-modern/SessionState.h         |  2 --
 3 files changed, 26 insertions(+), 4 deletions(-)

diff --git a/packages/react-native/ReactCommon/jsinspector-modern/HostAgent.cpp b/packages/react-native/ReactCommon/jsinspector-modern/HostAgent.cpp
index f3614b08faa..5d9ddda55be 100644
--- a/packages/react-native/ReactCommon/jsinspector-modern/HostAgent.cpp
+++ b/packages/react-native/ReactCommon/jsinspector-modern/HostAgent.cpp
@@ -45,7 +45,7 @@ void HostAgent::handleRequest(const cdp::PreparsedRequest& req) {
   if (req.method == "Log.enable") {
     sessionState_.isLogDomainEnabled = true;
 
-    if (sessionState_.isFuseboxClientDetected) {
+    if (fuseboxClientType_ == FuseboxClientType::Fusebox) {
       sendFuseboxNotice();
     }
 
@@ -66,6 +66,14 @@ void HostAgent::handleRequest(const cdp::PreparsedRequest& req) {
   } else if (req.method == "Runtime.enable") {
     sessionState_.isRuntimeDomainEnabled = true;
 
+    if (fuseboxClientType_ == FuseboxClientType::Unknown) {
+      // Since we know the Fusebox frontend sends
+      // FuseboxClient.setClientMetadata before enabling the Runtime domain, we
+      // can conclude that we're dealing with some other client.
+      fuseboxClientType_ = FuseboxClientType::NonFusebox;
+      sendNonFuseboxNotice();
+    }
+
     shouldSendOKResponse = true;
     isFinishedHandlingRequest = false;
   } else if (req.method == "Runtime.disable") {
@@ -100,7 +108,7 @@ void HostAgent::handleRequest(const cdp::PreparsedRequest& req) {
     shouldSendOKResponse = true;
     isFinishedHandlingRequest = true;
   } else if (req.method == "FuseboxClient.setClientMetadata") {
-    sessionState_.isFuseboxClientDetected = true;
+    fuseboxClientType_ = FuseboxClientType::Fusebox;
 
     if (sessionState_.isLogDomainEnabled) {
       sendFuseboxNotice();
@@ -136,6 +144,18 @@ void HostAgent::sendFuseboxNotice() {
       kFuseboxNotice, {"font-family: sans-serif;", "font-family: monospace;"});
 }
 
+void HostAgent::sendNonFuseboxNotice() {
+  static constexpr auto kNonFuseboxNotice =
+      ANSI_COLOR_BG_YELLOW ANSI_WEIGHT_BOLD
+      "NOTE: " ANSI_WEIGHT_RESET
+      "You are using an unsupported debugging client. "
+      "Use the Dev Menu in your app (or type `j` in the Metro terminal) to open the latest, supported React Native debugger."sv;
+
+  std::vector<std::string> args;
+  args.emplace_back(kNonFuseboxNotice);
+  sendConsoleMessage({ConsoleAPIType::kInfo, args});
+}
+
 void HostAgent::sendInfoLogEntry(
     std::string_view text,
     std::initializer_list<std::string_view> args) {
diff --git a/packages/react-native/ReactCommon/jsinspector-modern/HostAgent.h b/packages/react-native/ReactCommon/jsinspector-modern/HostAgent.h
index 6a4f8fe6f39..363339fac6d 100644
--- a/packages/react-native/ReactCommon/jsinspector-modern/HostAgent.h
+++ b/packages/react-native/ReactCommon/jsinspector-modern/HostAgent.h
@@ -62,6 +62,8 @@ class HostAgent final {
   void setCurrentInstanceAgent(std::shared_ptr<InstanceAgent> agent);
 
  private:
+  enum class FuseboxClientType { Unknown, Fusebox, NonFusebox };
+
   /**
    * Send a simple Log.entryAdded notification with the given
    * \param text. You must ensure that the frontend has enabled Log
@@ -76,6 +78,7 @@ class HostAgent final {
       std::initializer_list<std::string_view> args = {});
 
   void sendFuseboxNotice();
+  void sendNonFuseboxNotice();
 
   /**
    * Send a console message to the frontend, or buffer it to be sent later.
@@ -86,6 +89,7 @@ class HostAgent final {
   HostTargetController& targetController_;
   const HostTarget::SessionMetadata sessionMetadata_;
   std::shared_ptr<InstanceAgent> instanceAgent_;
+  FuseboxClientType fuseboxClientType_{FuseboxClientType::Unknown};
 
   /**
    * A shared reference to the session's state. This is only safe to access
diff --git a/packages/react-native/ReactCommon/jsinspector-modern/SessionState.h b/packages/react-native/ReactCommon/jsinspector-modern/SessionState.h
index 69a75c5b7a7..36c4c72666f 100644
--- a/packages/react-native/ReactCommon/jsinspector-modern/SessionState.h
+++ b/packages/react-native/ReactCommon/jsinspector-modern/SessionState.h
@@ -36,8 +36,6 @@ struct SessionState {
   std::unordered_map<std::string, ExecutionContextSelectorSet>
       subscribedBindings;
 
-  bool isFuseboxClientDetected{false};
-
   /**
    * Messages logged through the HostAgent::sendConsoleMessage and
    * InstanceAgent::sendConsoleMessage utilities that have not yet been sent to