react-native-windows 0.80.0 → 0.80.5

package/Microsoft.ReactNative/Fabric/platform/react/renderer/graphics/PlatformColorUtils.h

@@ -17,7 +17,4 @@ winrt::Windows::UI::Color ResolvePlatformColor(const std::vector<std::string> &s
 // Get appropriate placeholder text color for TextInput based on focus state and background
 SharedColor GetTextInputPlaceholderColor(bool isFocused, const winrt::Windows::UI::Color &backgroundColor = {});
 
-// Get default text foreground color for Text component (theme-aware)
-SharedColor GetDefaultTextColor();
-
 } // namespace facebook::react

package/Microsoft.ReactNative/Fabric/platform/react/threading/TaskDispatchThread.cpp

@@ -12,8 +12,11 @@
 
 #include <folly/portability/SysResource.h>
 #include <folly/system/ThreadName.h>
-#include <chrono>
+#include <condition_variable>
 #include <future>
+#include <mutex>
+#include <queue>
+#include <thread>
 #include <utility>
 
 #include <glog/logging.h>
@@ -25,40 +28,88 @@
 
 namespace facebook::react {
 
-TaskDispatchThread::TaskDispatchThread(std::string threadName, int priorityOffset) noexcept
-    : threadName_(std::move(threadName)) {
-#ifdef ANDROID
-  // Attaches the thread to JVM just in case anything calls out to Java
-  thread_ = std::thread([&]() {
-    facebook::jni::ThreadScope::WithClassLoader([&]() {
-      int result = setpriority(PRIO_PROCESS, static_cast<pid_t>(::syscall(SYS_gettid)), priorityOffset);
+class TaskDispatchThread::Impl : public std::enable_shared_from_this<TaskDispatchThread::Impl> {
+ public:
+  Impl(std::string &&threadName) noexcept;
+  ~Impl() noexcept;
+
+  void start() noexcept;
+  bool isOnThread() noexcept;
+  bool isRunning() noexcept;
+  void runAsync(TaskFn &&task, std::chrono::milliseconds delayMs = std::chrono::milliseconds::zero()) noexcept;
+  void runSync(TaskFn &&task) noexcept;
+  void quit() noexcept;
+  void loop() noexcept;
+
+ private:
+  struct Task {
+    TimePoint dispatchTime;
+    TaskFn fn;
+
+    Task(TimePoint dispatchTime, TaskFn &&fn) : dispatchTime(dispatchTime), fn(std::move(fn)) {}
+
+    bool operator<(const Task &other) const {
+      // Have the earliest tasks be at the front of the queue.
+      return dispatchTime > other.dispatchTime;
+    }
+  };
+
+  std::mutex queueLock_;
+  std::condition_variable loopCv_;
+  std::priority_queue<Task> queue_;
+  std::atomic<bool> running_{true};
+  std::string threadName_;
+  std::thread thread_;
+};
+
+TaskDispatchThread::TaskDispatchThread(std::string threadName, int /*priorityOffset*/) noexcept
+    : impl_(std::make_shared<Impl>(std::move(threadName))) {
+  impl_->start();
+}
 
-      if (result != 0) {
-        LOG(INFO) << " setCurrentThreadPriority failed with pri errno: " << errno;
-      }
+TaskDispatchThread::~TaskDispatchThread() noexcept {
+  impl_->quit();
+}
 
-      loop();
-    });
-  });
+bool TaskDispatchThread::isOnThread() noexcept {
+  return impl_->isOnThread();
+}
 
-#else
-  thread_ = std::thread(&TaskDispatchThread::loop, this);
-#endif
+bool TaskDispatchThread::isRunning() noexcept {
+  return impl_->isRunning();
 }
 
-TaskDispatchThread::~TaskDispatchThread() noexcept {
+void TaskDispatchThread::runAsync(TaskFn &&task, std::chrono::milliseconds delayMs) noexcept {
+  impl_->runAsync(std::move(task), delayMs);
+}
+
+void TaskDispatchThread::runSync(TaskFn &&task) noexcept {
+  impl_->runSync(std::move(task));
+}
+
+void TaskDispatchThread::quit() noexcept {
+  impl_->quit();
+}
+
+TaskDispatchThread::Impl::Impl(std::string &&threadName) noexcept : threadName_(std::move(threadName)) {}
+
+TaskDispatchThread::Impl::~Impl() noexcept {
   quit();
 }
 
-bool TaskDispatchThread::isOnThread() noexcept {
+void TaskDispatchThread::Impl::start() noexcept {
+  thread_ = std::thread([self = shared_from_this()]() { self->loop(); });
+}
+
+bool TaskDispatchThread::Impl::isOnThread() noexcept {
   return std::this_thread::get_id() == thread_.get_id();
 }
 
-bool TaskDispatchThread::isRunning() noexcept {
+bool TaskDispatchThread::Impl::isRunning() noexcept {
   return running_;
 }
 
-void TaskDispatchThread::runAsync(TaskFn &&task, std::chrono::milliseconds delayMs) noexcept {
+void TaskDispatchThread::Impl::runAsync(TaskFn &&task, std::chrono::milliseconds delayMs) noexcept {
   if (!running_) {
     return;
   }
@@ -68,7 +119,7 @@ void TaskDispatchThread::runAsync(TaskFn &&task, std::chrono::milliseconds delay
   loopCv_.notify_one();
 }
 
-void TaskDispatchThread::runSync(TaskFn &&task) noexcept {
+void TaskDispatchThread::Impl::runSync(TaskFn &&task) noexcept {
   std::promise<void> promise;
   runAsync([&]() {
     if (running_) {
@@ -79,7 +130,7 @@ void TaskDispatchThread::runSync(TaskFn &&task) noexcept {
   promise.get_future().wait();
 }
 
-void TaskDispatchThread::quit() noexcept {
+void TaskDispatchThread::Impl::quit() noexcept {
   if (!running_) {
     return;
   }
@@ -94,7 +145,7 @@ void TaskDispatchThread::quit() noexcept {
   }
 }
 
-void TaskDispatchThread::loop() noexcept {
+void TaskDispatchThread::Impl::loop() noexcept {
   if (!threadName_.empty()) {
     folly::setThreadName(threadName_);
   }

package/Microsoft.ReactNative/Fabric/platform/react/threading/TaskDispatchThread.h

@@ -11,11 +11,8 @@
 #pragma once
 
 #include <chrono>
-#include <condition_variable>
 #include <functional>
-#include <mutex>
-#include <queue>
-#include <thread>
+#include <memory>
 
 namespace facebook::react {
 
@@ -47,27 +44,9 @@ class TaskDispatchThread {
   /** Shut down and clean up the thread. */
   void quit() noexcept;
 
- protected:
-  struct Task {
-    TimePoint dispatchTime;
-    TaskFn fn;
-
-    Task(TimePoint dispatchTime, TaskFn &&fn) : dispatchTime(dispatchTime), fn(std::move(fn)) {}
-
-    bool operator<(const Task &other) const {
-      // Have the earliest tasks be at the front of the queue.
-      return dispatchTime > other.dispatchTime;
-    }
-  };
-
-  void loop() noexcept;
-
-  std::mutex queueLock_;
-  std::condition_variable loopCv_;
-  std::priority_queue<Task> queue_;
-  std::atomic<bool> running_{true};
-  std::string threadName_;
-  std::thread thread_;
+ private:
+  class Impl;
+  std::shared_ptr<Impl> impl_;
 };
 
 } // namespace facebook::react

package/Microsoft.ReactNative/JsiApi.cpp

@@ -479,7 +479,7 @@ facebook::jsi::JSError const &jsError) {                             \
       }();
     )JS");
   // TODO: consider implementing this script as a resource file and loading it with the resource URL.
-  jsiRuntime->evaluateJavaScript(jsiPalBuffer, "Form_JSI_API_not_a_real_file");
+  jsiRuntime->evaluateJavaScript(jsiPalBuffer, "jsi-internal://host-function-manager.js");
   ReactNative::JsiRuntime abiJsiResult{make<JsiRuntime>(Mso::Copy(jsiRuntimeHolder), Mso::Copy(jsiRuntime))};
   std::scoped_lock lock{s_mutex};
   auto it = s_jsiRuntimeMap.try_emplace(reinterpret_cast<uintptr_t>(jsiRuntime.get()), abiJsiResult);

package/Microsoft.ReactNative/Microsoft.ReactNative.vcxproj

@@ -268,6 +268,7 @@
       <SubType>Code</SubType>
     </ClInclude>
     <ClInclude Include="ReactHost\AsyncActionQueue.h" />
+    <ClInclude Include="ReactHost\DebuggerNotifications.h" />
     <ClInclude Include="ReactHost\InstanceFactory.h" />
     <ClInclude Include="ReactHost\IReactInstanceInternal.h" />
     <ClInclude Include="ReactHost\JSBundle.h" />

package/Microsoft.ReactNative/Microsoft.ReactNative.vcxproj.filters

@@ -313,6 +313,9 @@
     <ClInclude Include="ReactHost\AsyncActionQueue.h">
       <Filter>ReactHost</Filter>
     </ClInclude>
+    <ClInclude Include="ReactHost\DebuggerNotifications.h">
+      <Filter>ReactHost</Filter>
+    </ClInclude>    
     <ClInclude Include="ReactHost\InstanceFactory.h">
       <Filter>ReactHost</Filter>
     </ClInclude>

package/Microsoft.ReactNative/ReactHost/DebuggerNotifications.h

@@ -0,0 +1,54 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
+
+#pragma once
+
+#include <winrt/Microsoft.ReactNative.h>
+
+namespace Microsoft::ReactNative {
+
+struct DebuggerNotifications {
+  static winrt::Microsoft::ReactNative::IReactPropertyName ShowDebuggerPausedOverlayEventName() noexcept {
+    static winrt::Microsoft::ReactNative::IReactPropertyName propertyName{
+        winrt::Microsoft::ReactNative::ReactPropertyBagHelper::GetName(
+            winrt::Microsoft::ReactNative::ReactPropertyBagHelper::GetNamespace(L"ReactNative.Debugger"),
+            L"ShowDebuggerPausedOverlay")};
+    return propertyName;
+  }
+
+  static void OnShowDebuggerPausedOverlay(
+      winrt::Microsoft::ReactNative::IReactNotificationService const &service,
+      std::string message,
+      std::function<void()> onResume) {
+    const winrt::Microsoft::ReactNative::ReactNonAbiValue<std::tuple<std::string, std::function<void()>>> nonAbiValue{
+        std::in_place, std::tie(message, onResume)};
+    service.SendNotification(ShowDebuggerPausedOverlayEventName(), nullptr, nonAbiValue);
+  }
+
+  static void OnHideDebuggerPausedOverlay(winrt::Microsoft::ReactNative::IReactNotificationService const &service) {
+    service.SendNotification(ShowDebuggerPausedOverlayEventName(), nullptr, nullptr);
+  }
+
+  static winrt::Microsoft::ReactNative::IReactNotificationSubscription SubscribeShowDebuggerPausedOverlay(
+      winrt::Microsoft::ReactNative::IReactNotificationService const &service,
+      winrt::Microsoft::ReactNative::IReactDispatcher const &dispatcher,
+      std::function<void(std::string, std::function<void()>)> showCallback,
+      std::function<void()> hideCallback) {
+    return service.Subscribe(
+        ShowDebuggerPausedOverlayEventName(),
+        dispatcher,
+        [showCallback, hideCallback](auto &&, winrt::Microsoft::ReactNative::IReactNotificationArgs const &args) {
+          if (args.Data()) {
+            const auto [message, onResume] = args.Data()
+                                                 .as<winrt::Microsoft::ReactNative::ReactNonAbiValue<
+                                                     std::tuple<std::string, std::function<void()>>>>()
+                                                 .Value();
+            showCallback(message, onResume);
+          } else {
+            hideCallback();
+          }
+        });
+  }
+};
+
+} // namespace Microsoft::ReactNative

package/Microsoft.ReactNative/ReactHost/React.h

@@ -33,6 +33,10 @@
 #include <Fabric/Composition/UriImageManager.h>
 #endif
 
+namespace facebook::react::jsinspector_modern {
+class HostTarget;
+} // namespace facebook::react::jsinspector_modern
+
 namespace Mso::React {
 
 // Forward declarations
@@ -216,9 +220,9 @@ struct ReactOptions {
   //! Base path of the SDX. The absolute path of the SDX can be constructed from this and the Identity.
   std::string BundleRootPath;
 
-  //! Javascript Bundles
-  //! This List includes both Platform and User Javascript Bundles
-  //! Bundles are loaded into Javascript engine in the same order
+  //! JavaScript Bundles
+  //! This List includes both Platform and User JavaScript Bundles
+  //! Bundles are loaded into JavaScript engine in the same order
   //! as they are specified in this list.
   std::vector<Mso::CntPtr<IJSBundle>> JSBundles;
 
@@ -237,7 +241,7 @@ struct ReactOptions {
   //! during development to report JavaScript errors to users
   std::shared_ptr<Mso::React::IRedBoxHandler> RedBoxHandler;
 
-  //! Flag to suggest sdx owner's preference on enabling Bytecode caching in Javascript Engine for corresponding SDX.
+  //! Flag to suggest sdx owner's preference on enabling Bytecode caching in JavaScript Engine for corresponding SDX.
   bool EnableBytecode{true};
 
   //! Flag controlling whether the JavaScript engine uses JIT compilation.
@@ -347,6 +351,9 @@ struct ReactOptions {
   //! The callback is called when IReactInstance is destroyed and must not be used anymore.
   //! It is called from the native queue.
   OnReactInstanceDestroyedCallback OnInstanceDestroyed;
+
+  //! The HostTarget instance for modern inspector integration.
+  facebook::react::jsinspector_modern::HostTarget *InspectorHostTarget;
 };
 
 //! IReactHost manages a ReactNative instance.

package/Microsoft.ReactNative/ReactHost/ReactHost.cpp

@@ -8,9 +8,16 @@
 
 #include <CppRuntimeOptions.h>
 
+#include <jsinspector-modern/HostCommand.h>
+#include <jsinspector-modern/InspectorFlags.h>
 #include <react/featureflags/ReactNativeFeatureFlags.h>
 #include <react/featureflags/ReactNativeFeatureFlagsDefaults.h>
 
+#include "Inspector/ReactInspectorThread.h"
+#include "ReactHost/DebuggerNotifications.h"
+
+using namespace facebook::react;
+
 namespace Mso::React {
 
 //=============================================================================================
@@ -282,6 +289,10 @@ bool ReactOptions::EnableDefaultCrashHandler() const noexcept {
   return winrt::unbox_value_or<bool>(properties.Get(EnableDefaultCrashHandlerProperty()), false);
 }
 
+//=============================================================================================
+// ReactNativeWindowsFeatureFlags implementation
+//=============================================================================================
+
 class ReactNativeWindowsFeatureFlags : public facebook::react::ReactNativeFeatureFlagsDefaults {
  public:
   bool enableBridgelessArchitecture() override {
@@ -295,9 +306,77 @@ class ReactNativeWindowsFeatureFlags : public facebook::react::ReactNativeFeatur
   bool enableCppPropsIteratorSetter() override {
     return true;
   }
+
+  bool fuseboxEnabledRelease() override {
+    return true; // Enable Fusebox (modern CDP backend) by default for React Native Windows
+  }
+};
+
+//=============================================================================================
+// ReactInspectorHostTargetDelegate implementation
+//=============================================================================================
+
+class ReactInspectorHostTargetDelegate : public jsinspector_modern::HostTargetDelegate,
+                                         public std::enable_shared_from_this<ReactInspectorHostTargetDelegate> {
+ public:
+  ReactInspectorHostTargetDelegate(Mso::WeakPtr<ReactHost> &&reactHost) noexcept : m_reactHost(std::move(reactHost)) {}
+
+  jsinspector_modern::HostTargetMetadata getMetadata() override {
+    jsinspector_modern::HostTargetMetadata metadata{};
+    metadata.integrationName = "React Native Windows (Host)";
+    metadata.platform = "windows";
+
+    if (Mso::CntPtr<ReactHost> reactHost = m_reactHost.GetStrongPtr()) {
+      const ReactOptions &options = reactHost->Options();
+      if (!options.Identity.empty()) {
+        std::string identity = options.Identity;
+        // Replace illegal characters with underscore
+        for (char &c : identity) {
+          if (c == '\\' || c == '/' || c == ':' || c == '*' || c == '?' || c == '"' || c == '<' || c == '>' ||
+              c == '|') {
+            c = '_';
+          }
+        }
+        metadata.appDisplayName = identity;
+      }
+    }
+
+    wchar_t computerName[MAX_COMPUTERNAME_LENGTH + 1];
+    DWORD size = MAX_COMPUTERNAME_LENGTH + 1;
+    if (GetComputerNameW(computerName, &size)) {
+      metadata.deviceName = winrt::to_string(computerName);
+    }
+
+    return metadata;
+  }
+
+  void onReload(jsinspector_modern::HostTargetDelegate::PageReloadRequest const &request) override {
+    if (Mso::CntPtr<ReactHost> reactHost = m_reactHost.GetStrongPtr()) {
+      reactHost->ReloadInstance();
+    }
+  }
+
+  void onSetPausedInDebuggerMessage(
+      jsinspector_modern::HostTargetDelegate::OverlaySetPausedInDebuggerMessageRequest const &request) override {
+    if (Mso::CntPtr<ReactHost> reactHost = m_reactHost.GetStrongPtr()) {
+      auto notifications = reactHost->Options().Notifications;
+      if (request.message.has_value()) {
+        ::Microsoft::ReactNative::DebuggerNotifications::OnShowDebuggerPausedOverlay(
+            notifications, request.message.value(), [weakReactHost = m_reactHost]() {
+              if (Mso::CntPtr<ReactHost> strongReactHost = weakReactHost.GetStrongPtr()) {
+                strongReactHost->OnDebuggerResume();
+              }
+            });
+      } else {
+        ::Microsoft::ReactNative::DebuggerNotifications::OnHideDebuggerPausedOverlay(notifications);
+      }
+    }
+  }
+
+ private:
+  Mso::WeakPtr<ReactHost> m_reactHost;
 };
 
-std::once_flag g_FlagInitFeatureFlags;
 //=============================================================================================
 // ReactHost implementation
 //=============================================================================================
@@ -305,9 +384,16 @@ std::once_flag g_FlagInitFeatureFlags;
 ReactHost::ReactHost(Mso::DispatchQueue const &queue) noexcept
     : Super{EnsureSerialQueue(queue)},
       m_options{Queue(), m_mutex},
-      m_notifyWhenClosed{ReactHostRegistry::Register(*this), Queue(), m_mutex} {
-  std::call_once(g_FlagInitFeatureFlags, []() noexcept {
-    facebook::react::ReactNativeFeatureFlags::override(std::make_unique<ReactNativeWindowsFeatureFlags>());
+      m_notifyWhenClosed{ReactHostRegistry::Register(*this), Queue(), m_mutex},
+      m_inspectorHostTargetDelegate{std::make_shared<ReactInspectorHostTargetDelegate>(this)},
+      m_inspectorHostTarget{
+          jsinspector_modern::HostTarget::create(*m_inspectorHostTargetDelegate, [](std::function<void()> &&callback) {
+            ::Microsoft::ReactNative::ReactInspectorThread::Instance().Post(
+                [callback = std::move(callback)]() { callback(); });
+          })} {
+  static std::once_flag initFeatureFlagsOnce;
+  std::call_once(initFeatureFlagsOnce, []() noexcept {
+    ReactNativeFeatureFlags::override(std::make_unique<ReactNativeWindowsFeatureFlags>());
   });
 }
 
@@ -319,15 +405,16 @@ void ReactHost::Finalize() noexcept {
   // Since each AsyncAction has a strong ref count to ReactHost, the AsyncActionQueue must be empty.
   // Thus, we only need to call UnloadInQueue to unload ReactInstance if the ReactHost is not closed yet.
   if (Mso::Promise<void> notifyWhenClosed = m_notifyWhenClosed.Exchange(nullptr)) {
-    UnloadInQueue(0).Then<Mso::Executors::Inline>(
-        [notifyWhenClosed = std::move(notifyWhenClosed)]() noexcept { notifyWhenClosed.TrySetValue(); });
+    UnloadInQueue(UnloadReason::CloseHost, 0)
+        .Then<Mso::Executors::Inline>(
+            [notifyWhenClosed = std::move(notifyWhenClosed)]() noexcept { notifyWhenClosed.TrySetValue(); });
   }
 }
 
 void ReactHost::Close() noexcept {
   InvokeInQueue([this]() noexcept {
     // Put the ReactHost to the closed state, unload ReactInstance, and notify the closing Promise.
-    auto whenClosed = m_actionQueue.Load()->PostAction(MakeUnloadInstanceAction());
+    auto whenClosed = m_actionQueue.Load()->PostAction(MakeUnloadInstanceAction(UnloadReason::CloseHost));
 
     // After we set the m_notifyWhenClosed to null, the ReactHost is considered to be closed.
     Mso::SetPromiseValue(m_notifyWhenClosed.Exchange(nullptr), std::move(whenClosed));
@@ -379,12 +466,14 @@ Mso::Future<void> ReactHost::ReloadInstance() noexcept {
 
 Mso::Future<void> ReactHost::ReloadInstanceWithOptions(ReactOptions &&options) noexcept {
   return PostInQueue([this, options = std::move(options)]() mutable noexcept {
-    return m_actionQueue.Load()->PostActions({MakeUnloadInstanceAction(), MakeLoadInstanceAction(std::move(options))});
+    return m_actionQueue.Load()->PostActions(
+        {MakeUnloadInstanceAction(UnloadReason::Unload), MakeLoadInstanceAction(std::move(options))});
   });
 }
 
 Mso::Future<void> ReactHost::UnloadInstance() noexcept {
-  return PostInQueue([this]() noexcept { return m_actionQueue.Load()->PostAction(MakeUnloadInstanceAction()); });
+  return PostInQueue(
+      [this]() noexcept { return m_actionQueue.Load()->PostAction(MakeUnloadInstanceAction(UnloadReason::Unload)); });
 }
 
 AsyncAction ReactHost::MakeLoadInstanceAction(ReactOptions &&options) noexcept {
@@ -393,11 +482,13 @@ AsyncAction ReactHost::MakeLoadInstanceAction(ReactOptions &&options) noexcept {
   };
 }
 
-AsyncAction ReactHost::MakeUnloadInstanceAction() noexcept {
+AsyncAction ReactHost::MakeUnloadInstanceAction(UnloadReason reason) noexcept {
   Mso::Internal::VerifyIsInQueueElseCrash(Queue());
   size_t unloadActionId = ++m_nextUnloadActionId;
   m_pendingUnloadActionId = unloadActionId;
-  return [spThis = Mso::CntPtr{this}, unloadActionId]() noexcept { return spThis->UnloadInQueue(unloadActionId); };
+  return [spThis = Mso::CntPtr{this}, reason, unloadActionId]() noexcept {
+    return spThis->UnloadInQueue(reason, unloadActionId);
+  };
 }
 
 Mso::CntPtr<IReactViewHost> ReactHost::MakeViewHost(ReactViewOptions &&options) noexcept {
@@ -428,6 +519,18 @@ Mso::Future<void> ReactHost::LoadInQueue(ReactOptions &&options) noexcept {
     return Mso::MakeCanceledFuture();
   }
 
+  // Start or stop inspector page if needed.
+  // Make sure to update the both copies of options.
+  if (IsInspectable()) {
+    AddInspectorPage();
+    options.InspectorHostTarget = m_inspectorHostTarget.get();
+    m_options.Load().InspectorHostTarget = m_inspectorHostTarget.get();
+  } else {
+    RemoveInspectorPage();
+    options.InspectorHostTarget = nullptr;
+    m_options.Load().InspectorHostTarget = nullptr;
+  }
+
   Mso::Promise<void> whenCreated;
   Mso::Promise<void> whenLoaded;
 
@@ -463,7 +566,7 @@ Mso::Future<void> ReactHost::LoadInQueue(ReactOptions &&options) noexcept {
   });
 }
 
-Mso::Future<void> ReactHost::UnloadInQueue(size_t unloadActionId) noexcept {
+Mso::Future<void> ReactHost::UnloadInQueue(UnloadReason reason, size_t unloadActionId) noexcept {
   Mso::Internal::VerifyIsInQueueElseCrash(Queue());
 
   // If the pending unload action Id does not match, then we have newer unload action,
@@ -485,21 +588,25 @@ Mso::Future<void> ReactHost::UnloadInQueue(size_t unloadActionId) noexcept {
 
   // We unload ReactInstance after all view instances are unloaded.
   // It is safe to capture 'this' because the Unload action keeps a strong reference to ReactHost.
-  return Mso::WhenAllCompleted(unloadCompletionList).Then(m_executor, [this](Mso::Maybe<void> && /*value*/) noexcept {
-    Mso::Future<void> onUnloaded;
-    if (auto reactInstance = m_reactInstance.Exchange(nullptr)) {
-      onUnloaded = reactInstance->Destroy();
-    }
-
-    m_isInstanceUnloading.Store(false);
-    m_lastError.Store({});
-
-    if (!onUnloaded) {
-      onUnloaded = Mso::MakeSucceededFuture();
-    }
-
-    return onUnloaded;
-  });
+  return Mso::WhenAllCompleted(unloadCompletionList)
+      .Then(m_executor, [this, reason](Mso::Maybe<void> && /*value*/) noexcept {
+        Mso::Future<void> onUnloaded;
+        if (auto reactInstance = m_reactInstance.Exchange(nullptr)) {
+          onUnloaded = reactInstance->Destroy();
+        }
+
+        m_isInstanceUnloading.Store(false);
+        m_lastError.Store({});
+
+        if (!onUnloaded) {
+          onUnloaded = Mso::MakeSucceededFuture();
+        }
+
+        if (reason == UnloadReason::CloseHost) {
+          RemoveInspectorPage();
+        }
+        return onUnloaded;
+      });
 }
 
 void ReactHost::ForEachViewHost(const Mso::FunctorRef<void(ReactViewHost &)> &action) noexcept {
@@ -528,6 +635,65 @@ void ReactHost::DetachViewHost(ReactViewHost &viewHost) noexcept {
   viewHosts.erase(it);
 }
 
+bool ReactHost::IsInspectable() noexcept {
+  ReactOptions &options = m_options.Load();
+  return options.JsiEngine() == JSIEngine::Hermes && options.UseDirectDebugger();
+}
+
+void ReactHost::AddInspectorPage() noexcept {
+  std::optional<int32_t> &inspectorPageId = m_inspectorPageId.Load();
+  if (inspectorPageId.has_value())
+    return;
+
+  jsinspector_modern::InspectorTargetCapabilities capabilities;
+  capabilities.nativePageReloads = true;
+  capabilities.prefersFuseboxFrontend = true;
+
+  auto metadata = m_inspectorHostTargetDelegate->getMetadata();
+  std::string pageName;
+  if (metadata.appDisplayName.has_value() && !metadata.appDisplayName.value().empty()) {
+    pageName = metadata.appDisplayName.value();
+  } else {
+    pageName = "React Native Windows (Experimental)";
+  }
+  if (metadata.deviceName.has_value() && !metadata.deviceName.value().empty()) {
+    pageName += " (" + metadata.deviceName.value() + ")";
+  }
+
+  inspectorPageId = jsinspector_modern::getInspectorInstance().addPage(
+      pageName,
+      "Hermes",
+      [weakInspectorHostTarget =
+           std::weak_ptr(m_inspectorHostTarget)](std::unique_ptr<jsinspector_modern::IRemoteConnection> remote)
+          -> std::unique_ptr<jsinspector_modern::ILocalConnection> {
+        if (std::shared_ptr<jsinspector_modern::HostTarget> inspectorHostTarget = weakInspectorHostTarget.lock()) {
+          return inspectorHostTarget->connect(std::move(remote));
+        }
+
+        // This can happen if we're about to shut down. Reject the connection.
+        return nullptr;
+      },
+      capabilities);
+}
+
+void ReactHost::RemoveInspectorPage() noexcept {
+  std::optional<int32_t> &inspectorPageId = m_inspectorPageId.Load();
+  if (!inspectorPageId.has_value())
+    return;
+
+  jsinspector_modern::getInspectorInstance().removePage(*inspectorPageId);
+  inspectorPageId.reset();
+}
+
+void ReactHost::OnDebuggerResume() noexcept {
+  ::Microsoft::ReactNative::ReactInspectorThread::Instance().Post(
+      [weakInspectorHostTarget = std::weak_ptr(m_inspectorHostTarget)]() {
+        if (std::shared_ptr<jsinspector_modern::HostTarget> inspectorHostTarget = weakInspectorHostTarget.lock()) {
+          inspectorHostTarget->sendCommand(jsinspector_modern::HostCommand::DebuggerResume);
+        }
+      });
+}
+
 //=============================================================================================
 // ReactViewHost implementation
 //=============================================================================================
@@ -579,8 +745,8 @@ Mso::Future<void> ReactViewHost::AttachViewInstance(IReactViewInstance &viewInst
     m_reactHost->AttachViewHost(*this);
 
     return InitViewInstanceInQueue();
-    //// Schedule the viewInstance load in the action queue since there can be other load actions in the queue that need
-    //// to be consolidated.
+    // Schedule the viewInstance load in the action queue since there can be other load actions in the queue that need
+    // to be consolidated.
     // return m_actionQueue.Load()->PostAction(MakeInitViewInstanceAction());
   });
 }