Make RCTUnsafeExecuteOnMainQueueSync safer

Summary:
# Problem

Sync rendering/events (i.e: execute js now below), when used in conjunction with js -> ui sync calls, can deadlock react native:

## Deadlock #1
**Main thread**: execute js now:
  * Main thread puts a block on the js queue, to capture the runtime.
 * Main thread then then goes to sleep, waiting for runtime to be captured

**JS thread**: execute ui code synchronously:
* Js thread schedules a block on the ui thread
* Js thread then goes to sleep, waiting for that block to execute.
* **The application deadlocks**

| {F1978009555} |  {F1978009612} |

## Deadlock #2
**JS thread**: execute ui code synchronously:
* Js thread schedules a block on the ui thread
* Js thread then goes to sleep waiting for that block to execute.

**Main thread**: execute js now:
* Main thread puts a block on the js queue, to capture the runtime.
* Main thread then then goes to sleep, waiting for runtime to be captured
* **The application deadlocks.**

|  {F1978009690}  | {F1978009701} |

# Changes
This diff attempts to fix those deadlocks. How:
* This diff introduces a stateful "execute js now" coordinator.
* In "execute ui code synchronously" (js thread):
   * Before going to sleep, the js thread posts its ui work to the "execute js now" coordinator.
* In "execute js now" (main thread):
   * Before trying to capture the runtime, the main thread executes "pending ui work", if it exists.
   * While the main thread is sleeping, waiting for runtime capture, it can be woken up, and asked to execute "pending ui work."

## Mitigation: Deadlock #1
**Main thread**: execute js now:
* Main thread puts a block on the js queue, to capture the runtime.
* Main thread then then goes to sleep, waiting for runtime to be captured

**JS Thread**: execute ui code synchronously:
* Js thread schedules this block on the ui thread.
* ***New***: Js thread also assigns this block to the coordinator. *And wakes up the main thread*.
* Js thread goes to sleep.

The main thread wakes up:
* Main thread **executes** the ui block assigned to the coordinator. **This cancels the ui block scheduled on the main queue.**
* Main thread goes back to sleep.
* The js thread wakes up, moves on to the next task.

The runtime is captured by the main thread.

| {F1978010383} | {F1978010363} |  {F1978010371} |  {F1978010379}

## Mitigation: Deadlock #2
**JS Thread**: execute ui code synchronously:
* Js thread schedules this block on the ui thread.
* ***New***: Js thread also assigns this block to the coordinator. *And wakes up the main thread*.
* Js thread goes to sleep.

**Main thread**: execute js now
* Main thread executes the ui block immediately. (This cancels the ui block on the main queue).
* Js thread wakes up and moves onto the next task.

Main thread captures the runtime.

|  {F1978010525}  |  {F1978010533} |  {F1978010542} |

Differential Revision: D74769326

Author: RSNara

packages/react-native/React/Base/RCTUtils.mm

@@ -19,6 +19,7 @@
 #import <CommonCrypto/CommonCrypto.h>
 
 #import <React/RCTUtilsUIOverride.h>
+#import <ReactCommon/RuntimeExecutorSyncUIThreadUtils.h>
 #import "RCTAssert.h"
 #import "RCTLog.h"
 
@@ -295,6 +296,11 @@ void RCTExecuteOnMainQueue(dispatch_block_t block)
   }
 }
 
+static BOOL RCTIsJSThread()
+{
+  return [[NSThread currentThread].name containsString:@"JavaScript"];
+}
+
 // Please do not use this method
 // unless you know what you are doing.
 void RCTUnsafeExecuteOnMainQueueSync(dispatch_block_t block)
@@ -311,7 +317,12 @@ void RCTUnsafeExecuteOnMainQueueSyncWithError(dispatch_block_t block, NSString *
     return;
   }
 
-  if (facebook::react::ReactNativeFeatureFlags::disableMainQueueSyncDispatchIOS()) {
+  if (facebook::react::ReactNativeFeatureFlags::enableSaferMainQueueSyncDispatchOnIOS()) {
+    if (RCTIsJSThread()) {
+      facebook::react::postPotentiallyDeadlockingUITask(block).wait();
+      return;
+    }
+  } else if (facebook::react::ReactNativeFeatureFlags::disableMainQueueSyncDispatchIOS()) {
     RCTLogError(
         @"RCTUnsafeExecuteOnMainQueueSync: %@",
         context ?: @"Sync dispatches to the main queue can deadlock React Native.");
@@ -340,7 +351,12 @@ static void RCTUnsafeExecuteOnMainQueueOnceSync(dispatch_once_t *onceToken, disp
     return;
   }
 
-  if (facebook::react::ReactNativeFeatureFlags::disableMainQueueSyncDispatchIOS()) {
+  if (facebook::react::ReactNativeFeatureFlags::enableSaferMainQueueSyncDispatchOnIOS()) {
+    if (RCTIsJSThread()) {
+      facebook::react::postPotentiallyDeadlockingUITask(block).wait();
+      return;
+    }
+  } else if (facebook::react::ReactNativeFeatureFlags::disableMainQueueSyncDispatchIOS()) {
     RCTLogError(@"RCTUnsafeExecuteOnMainQueueOnceSync: Sync dispatches to the main queue can deadlock React Native.");
   }
 

packages/react-native/ReactCommon/runtimeexecutor/platform/ios/ReactCommon/RuntimeExecutorSyncUIThreadUtils.h

@@ -10,6 +10,7 @@
 #include <ReactCommon/RuntimeExecutor.h>
 
 #include <jsi/jsi.h>
+#include <future>
 
 namespace facebook::react {
 
@@ -36,4 +37,8 @@ inline static DataT executeSynchronouslyOnSameThread_CAN_DEADLOCK(
 
   return data;
 }
+
+std::future<void> postPotentiallyDeadlockingUITask(
+    std::function<void()> runnable);
+
 } // namespace facebook::react

packages/react-native/ReactCommon/runtimeexecutor/platform/ios/ReactCommon/RuntimeExecutorSyncUIThreadUtils.mm

@@ -5,11 +5,110 @@
  * LICENSE file in the root directory of this source tree.
  */
 
+#import <Foundation/Foundation.h>
+
 #import <ReactCommon/RuntimeExecutorSyncUIThreadUtils.h>
-#include <mutex>
-#include <thread>
+#import <react/debug/react_native_assert.h>
+#import <react/featureflags/ReactNativeFeatureFlags.h>
+#import <react/utils/OnScopeExit.h>
+#import <functional>
+#import <mutex>
+
+namespace {
+struct UITask {
+  std::promise<void> _isDone;
+  std::mutex _mutex;
+  std::function<void()> _uiWork;
+  std::atomic_bool _hasStarted;
+
+ public:
+  UITask(std::function<void()> uiWork) : _uiWork(uiWork), _hasStarted(false) {}
+
+  void run()
+  {
+    bool expected = false;
+    if (!_hasStarted.compare_exchange_strong(expected, true)) {
+      return;
+    }
+    facebook::react::OnScopeExit onScopeExit(^{
+      _uiWork = nil;
+      _isDone.set_value();
+    });
+    _uiWork();
+  }
+
+  bool hasStarted()
+  {
+    return _hasStarted.load();
+  }
+
+  std::future<void> getFuture()
+  {
+    return _isDone.get_future();
+  }
+};
+} // namespace
+
+static std::mutex _mutex;
+static std::condition_variable _cv;
+
+// Global state
+static bool _isRunningPendingUITask = false;
+static std::shared_ptr<UITask> _pendingUITask;
 
 namespace facebook::react {
+namespace {
+
+void runPendingUITask()
+{
+  OnScopeExit onScopeExit([&]() {
+    _pendingUITask = nullptr;
+    _isRunningPendingUITask = false;
+  });
+  _isRunningPendingUITask = true;
+  _pendingUITask->run();
+}
+
+void saferExecuteSynchronouslyOnSameThread_CAN_DEADLOCK(
+    const RuntimeExecutor &runtimeExecutor,
+    std::function<void(jsi::Runtime &runtime)> &&jsWork) noexcept
+{
+  react_native_assert([[NSThread currentThread] isMainThread] && !_isRunningPendingUITask);
+
+  jsi::Runtime *runtime = nullptr;
+  std::mutex jsWorkDone;
+
+  jsWorkDone.lock();
+  OnScopeExit onScopeExit([&]() { jsWorkDone.unlock(); });
+
+  {
+    std::unique_lock<std::mutex> lock(_mutex);
+    if (_pendingUITask) {
+      runPendingUITask();
+    }
+
+    runtimeExecutor([&](jsi::Runtime &rt) {
+      runtime = &rt;
+      _cv.notify_one();
+
+      // Block the js thread until jsWork finishes on calling thread
+      jsWorkDone.lock();
+    });
+
+    while (true) {
+      _cv.wait(lock, [&] { return runtime != nullptr || _pendingUITask != nullptr; });
+
+      if (_pendingUITask != nullptr) {
+        runPendingUITask();
+      } else {
+        break;
+      }
+    }
+  }
+
+  jsWork(*runtime);
+}
+
 /**
  * Example order of events (when not a sync call in runtimeExecutor
  * jsWork):
@@ -26,7 +125,7 @@
  * - [JS thread] Signal runtime capture block is finished:
  *               runtimeCaptureBlockDone.unlock()
  */
-void executeSynchronouslyOnSameThread_CAN_DEADLOCK(
+void legacyExecuteSynchronouslyOnSameThread_CAN_DEADLOCK(
     const RuntimeExecutor &runtimeExecutor,
     std::function<void(jsi::Runtime &runtime)> &&jsWork) noexcept
 {
@@ -41,7 +140,7 @@ void executeSynchronouslyOnSameThread_CAN_DEADLOCK(
   jsWorkDone.lock();
   runtimeCaptureBlockDone.lock();
 
-  jsi::Runtime *runtimePtr;
+  jsi::Runtime *runtimePtr = nullptr;
 
   auto threadId = std::this_thread::get_id();
   auto runtimeCaptureBlock = [&](jsi::Runtime &runtime) {
@@ -67,4 +166,32 @@ void executeSynchronouslyOnSameThread_CAN_DEADLOCK(
   runtimeCaptureBlockDone.lock();
 }
 
+} // namespace
+
+void executeSynchronouslyOnSameThread_CAN_DEADLOCK(
+    const RuntimeExecutor &runtimeExecutor,
+    std::function<void(jsi::Runtime &runtime)> &&jsWork) noexcept
+{
+  if (ReactNativeFeatureFlags::enableSaferMainQueueSyncDispatchOnIOS()) {
+    saferExecuteSynchronouslyOnSameThread_CAN_DEADLOCK(runtimeExecutor, std::move(jsWork));
+  } else {
+    legacyExecuteSynchronouslyOnSameThread_CAN_DEADLOCK(runtimeExecutor, std::move(jsWork));
+  }
+}
+
+std::future<void> postPotentiallyDeadlockingUITask(std::function<void()> work)
+{
+  std::lock_guard<std::mutex> lock(_mutex);
+  react_native_assert((!_pendingUITask || _pendingUITask->hasStarted()));
+
+  auto uiTask = std::make_shared<UITask>(work);
+  dispatch_async(dispatch_get_main_queue(), ^{
+    uiTask->run();
+  });
+
+  _pendingUITask = uiTask;
+  _cv.notify_one();
+  return uiTask->getFuture();
+}
+
 } // namespace facebook::react