react-native 0.0.0-e6fc20ee6 → 0.0.0-e9440508e-20211011-2008

package/ReactAndroid/src/main/java/com/facebook/react/devsupport/DevSupportManagerBase.java

@@ -17,22 +17,22 @@ import android.content.Intent;
 import android.content.IntentFilter;
 import android.content.pm.PackageInfo;
 import android.content.pm.PackageManager;
+import android.graphics.Color;
+import android.graphics.Typeface;
 import android.hardware.SensorManager;
 import android.util.Pair;
+import android.view.Gravity;
 import android.view.View;
 import android.widget.EditText;
+import android.widget.TextView;
 import android.widget.Toast;
 import androidx.annotation.Nullable;
 import androidx.annotation.UiThread;
 import com.facebook.common.logging.FLog;
-import com.facebook.debug.holder.PrinterHolder;
-import com.facebook.debug.tags.ReactDebugOverlayTags;
 import com.facebook.infer.annotation.Assertions;
 import com.facebook.react.R;
 import com.facebook.react.bridge.DefaultNativeModuleCallExceptionHandler;
 import com.facebook.react.bridge.JSBundleLoader;
-import com.facebook.react.bridge.JavaJSExecutor;
-import com.facebook.react.bridge.JavaScriptExecutorFactory;
 import com.facebook.react.bridge.ReactContext;
 import com.facebook.react.bridge.ReactMarker;
 import com.facebook.react.bridge.ReactMarkerConstants;
@@ -41,21 +41,21 @@ import com.facebook.react.bridge.UiThreadUtil;
 import com.facebook.react.common.DebugServerException;
 import com.facebook.react.common.ReactConstants;
 import com.facebook.react.common.ShakeDetector;
-import com.facebook.react.common.futures.SimpleSettableFuture;
+import com.facebook.react.common.SurfaceDelegate;
+import com.facebook.react.common.SurfaceDelegateFactory;
 import com.facebook.react.devsupport.DevServerHelper.PackagerCommandListener;
+import com.facebook.react.devsupport.interfaces.BundleLoadCallback;
 import com.facebook.react.devsupport.interfaces.DevBundleDownloadListener;
 import com.facebook.react.devsupport.interfaces.DevOptionHandler;
-import com.facebook.react.devsupport.interfaces.DevSplitBundleCallback;
 import com.facebook.react.devsupport.interfaces.DevSupportManager;
 import com.facebook.react.devsupport.interfaces.ErrorCustomizer;
+import com.facebook.react.devsupport.interfaces.ErrorType;
 import com.facebook.react.devsupport.interfaces.PackagerStatusCallback;
 import com.facebook.react.devsupport.interfaces.StackFrame;
 import com.facebook.react.modules.core.RCTNativeAppEventEmitter;
-import com.facebook.react.modules.debug.interfaces.DeveloperSettings;
 import com.facebook.react.packagerconnection.RequestHandler;
 import com.facebook.react.packagerconnection.Responder;
 import java.io.File;
-import java.io.IOException;
 import java.net.MalformedURLException;
 import java.net.URL;
 import java.util.ArrayList;
@@ -63,44 +63,35 @@ import java.util.LinkedHashMap;
 import java.util.List;
 import java.util.Locale;
 import java.util.Map;
-import java.util.concurrent.ExecutionException;
-import java.util.concurrent.TimeUnit;
-import java.util.concurrent.TimeoutException;
 
-public abstract class DevSupportManagerBase
-    implements DevSupportManager, PackagerCommandListener, DevInternalSettings.Listener {
+public abstract class DevSupportManagerBase implements DevSupportManager {
+
+  public interface CallbackWithBundleLoader {
+    void onSuccess(JSBundleLoader bundleLoader);
+
+    void onError(String url, Throwable cause);
+  }
 
   private static final int JAVA_ERROR_COOKIE = -1;
   private static final int JSEXCEPTION_ERROR_COOKIE = -1;
-  private static final String JS_BUNDLE_FILE_NAME = "ReactNativeDevBundle.js";
-  private static final String JS_SPLIT_BUNDLES_DIR_NAME = "dev_js_split_bundles";
   private static final String RELOAD_APP_ACTION_SUFFIX = ".RELOAD_APP_ACTION";
   private static final String FLIPPER_DEBUGGER_URL =
       "flipper://null/Hermesdebuggerrn?device=React%20Native";
   private static final String FLIPPER_DEVTOOLS_URL = "flipper://null/React?device=React%20Native";
-  private boolean mIsSamplingProfilerEnabled = false;
-
-  private enum ErrorType {
-    JS,
-    NATIVE
-  }
-
   private static final String EXOPACKAGE_LOCATION_FORMAT =
       "/data/local/tmp/exopackage/%s//secondary-dex";
 
   public static final String EMOJI_HUNDRED_POINTS_SYMBOL = " \uD83D\uDCAF";
   public static final String EMOJI_FACE_WITH_NO_GOOD_GESTURE = " \uD83D\uDE45";
 
-  private final List<ExceptionLogger> mExceptionLoggers = new ArrayList<>();
-
   private final Context mApplicationContext;
   private final ShakeDetector mShakeDetector;
   private final BroadcastReceiver mReloadAppBroadcastReceiver;
   private final DevServerHelper mDevServerHelper;
   private final LinkedHashMap<String, DevOptionHandler> mCustomDevOptions = new LinkedHashMap<>();
-  private final ReactInstanceManagerDevHelper mReactInstanceManagerHelper;
+  private final ReactInstanceDevHelper mReactInstanceDevHelper;
   private final @Nullable String mJSAppBundleName;
-  private final File mJSBundleTempFile;
+  private final File mJSBundleDownloadedFile;
   private final File mJSSplitBundlesDir;
   private final DefaultNativeModuleCallExceptionHandler mDefaultNativeModuleCallExceptionHandler;
   private final DevLoadingViewController mDevLoadingViewController;
@@ -118,6 +109,7 @@ public abstract class DevSupportManagerBase
   private @Nullable RedBoxHandler mRedBoxHandler;
   private @Nullable String mLastErrorTitle;
   private @Nullable StackFrame[] mLastErrorStack;
+  private @Nullable ErrorType mLastErrorType;
   private int mLastErrorCookie = 0;
   private @Nullable DevBundleDownloadListener mBundleDownloadListener;
   private @Nullable List<ErrorCustomizer> mErrorCustomizers;
@@ -127,37 +119,31 @@ public abstract class DevSupportManagerBase
 
   private @Nullable Map<String, RequestHandler> mCustomPackagerCommandHandlers;
 
-  public DevSupportManagerBase(
-      Context applicationContext,
-      ReactInstanceManagerDevHelper reactInstanceManagerHelper,
-      @Nullable String packagerPathForJSBundleName,
-      boolean enableOnCreate,
-      int minNumShakes) {
-
-    this(
-        applicationContext,
-        reactInstanceManagerHelper,
-        packagerPathForJSBundleName,
-        enableOnCreate,
-        null,
-        null,
-        minNumShakes,
-        null);
-  }
+  private @Nullable Activity currentActivity;
+  private @Nullable final SurfaceDelegateFactory mSurfaceDelegateFactory;
 
   public DevSupportManagerBase(
       Context applicationContext,
-      ReactInstanceManagerDevHelper reactInstanceManagerHelper,
+      ReactInstanceDevHelper reactInstanceDevHelper,
       @Nullable String packagerPathForJSBundleName,
       boolean enableOnCreate,
       @Nullable RedBoxHandler redBoxHandler,
       @Nullable DevBundleDownloadListener devBundleDownloadListener,
       int minNumShakes,
-      @Nullable Map<String, RequestHandler> customPackagerCommandHandlers) {
-    mReactInstanceManagerHelper = reactInstanceManagerHelper;
+      @Nullable Map<String, RequestHandler> customPackagerCommandHandlers,
+      @Nullable SurfaceDelegateFactory surfaceDelegateFactory) {
+    mReactInstanceDevHelper = reactInstanceDevHelper;
     mApplicationContext = applicationContext;
     mJSAppBundleName = packagerPathForJSBundleName;
-    mDevSettings = new DevInternalSettings(applicationContext, this);
+    mDevSettings =
+        new DevInternalSettings(
+            applicationContext,
+            new DevInternalSettings.Listener() {
+              @Override
+              public void onInternalSettingsChanged() {
+                reloadSettings();
+              }
+            });
     mBundleStatus = new InspectorPackagerConnection.BundleStatus();
     mDevServerHelper =
         new DevServerHelper(
@@ -207,75 +193,52 @@ public abstract class DevSupportManagerBase
     // start reading first reload output while the second reload starts writing to the same
     // file. As this should only be the case in dev mode we leave it as it is.
     // TODO(6418010): Fix readers-writers problem in debug reload from HTTP server
-    mJSBundleTempFile = new File(applicationContext.getFilesDir(), JS_BUNDLE_FILE_NAME);
+    final String subclassTag = getUniqueTag();
+    final String bundleFile = subclassTag + "ReactNativeDevBundle.js";
+    mJSBundleDownloadedFile = new File(applicationContext.getFilesDir(), bundleFile);
 
-    mJSSplitBundlesDir =
-        mApplicationContext.getDir(JS_SPLIT_BUNDLES_DIR_NAME, Context.MODE_PRIVATE);
+    final String splitBundlesDir = subclassTag.toLowerCase() + "_dev_js_split_bundles";
+    mJSSplitBundlesDir = mApplicationContext.getDir(splitBundlesDir, Context.MODE_PRIVATE);
 
     mDefaultNativeModuleCallExceptionHandler = new DefaultNativeModuleCallExceptionHandler();
 
     setDevSupportEnabled(enableOnCreate);
 
     mRedBoxHandler = redBoxHandler;
-    mDevLoadingViewController = new DevLoadingViewController(reactInstanceManagerHelper);
-
-    mExceptionLoggers.add(new JSExceptionLogger());
-
-    if (mDevSettings.isStartSamplingProfilerOnInit()) {
-      // Only start the profiler. If its already running, there is an error
-      if (!mIsSamplingProfilerEnabled) {
-        toggleJSSamplingProfiler();
-      } else {
-        Toast.makeText(
-                mApplicationContext,
-                "JS Sampling Profiler was already running, so did not start the sampling profiler",
-                Toast.LENGTH_LONG)
-            .show();
-      }
-    }
-  }
+    mDevLoadingViewController = new DevLoadingViewController(reactInstanceDevHelper);
+    mSurfaceDelegateFactory = surfaceDelegateFactory;
+  };
+
+  protected abstract String getUniqueTag();
 
   @Override
   public void handleException(Exception e) {
     if (mIsDevSupportEnabled) {
-
-      for (ExceptionLogger logger : mExceptionLoggers) {
-        logger.log(e);
-      }
-
+      logJSException(e);
     } else {
       mDefaultNativeModuleCallExceptionHandler.handleException(e);
     }
   }
 
-  private interface ExceptionLogger {
-    void log(Exception ex);
-  }
-
-  private class JSExceptionLogger implements ExceptionLogger {
-
-    @Override
-    public void log(Exception e) {
-      StringBuilder message =
-          new StringBuilder(
-              e.getMessage() == null ? "Exception in native call from JS" : e.getMessage());
-      Throwable cause = e.getCause();
-      while (cause != null) {
-        message.append("\n\n").append(cause.getMessage());
-        cause = cause.getCause();
-      }
+  private void logJSException(Exception e) {
+    StringBuilder message =
+        new StringBuilder(
+            e.getMessage() == null ? "Exception in native call from JS" : e.getMessage());
+    Throwable cause = e.getCause();
+    while (cause != null) {
+      message.append("\n\n").append(cause.getMessage());
+      cause = cause.getCause();
+    }
 
-      if (e instanceof JSException) {
-        FLog.e(ReactConstants.TAG, "Exception in native call from JS", e);
-        String stack = ((JSException) e).getStack();
-        message.append("\n\n").append(stack);
+    if (e instanceof JSException) {
+      FLog.e(ReactConstants.TAG, "Exception in native call from JS", e);
+      String stack = ((JSException) e).getStack();
+      message.append("\n\n").append(stack);
 
-        // TODO #11638796: convert the stack into something useful
-        showNewError(
-            message.toString(), new StackFrame[] {}, JSEXCEPTION_ERROR_COOKIE, ErrorType.JS);
-      } else {
-        showNewJavaError(message.toString(), e);
-      }
+      // TODO #11638796: convert the stack into something useful
+      showNewError(message.toString(), new StackFrame[] {}, JSEXCEPTION_ERROR_COOKIE, ErrorType.JS);
+    } else {
+      showNewJavaError(message.toString(), e);
     }
   }
 
@@ -345,7 +308,7 @@ public abstract class DevSupportManagerBase
             updateLastErrorInfo(message, stack, errorCookie, ErrorType.JS);
             // JS errors are reported here after source mapping.
             if (mRedBoxHandler != null) {
-              mRedBoxHandler.handleRedbox(message, stack, RedBoxHandler.ErrorType.JS);
+              mRedBoxHandler.handleRedbox(message, stack, ErrorType.JS);
               mRedBoxDialog.resetReporting();
             }
             mRedBoxDialog.show();
@@ -363,11 +326,11 @@ public abstract class DevSupportManagerBase
   }
 
   public @Nullable View createRootView(String appKey) {
-    return mReactInstanceManagerHelper.createRootView(appKey);
+    return mReactInstanceDevHelper.createRootView(appKey);
   }
 
   public void destroyRootView(View rootView) {
-    mReactInstanceManagerHelper.destroyRootView(rootView);
+    mReactInstanceDevHelper.destroyRootView(rootView);
   }
 
   private void hideDevOptionsDialog() {
@@ -386,17 +349,24 @@ public abstract class DevSupportManagerBase
         new Runnable() {
           @Override
           public void run() {
+            Activity context = mReactInstanceDevHelper.getCurrentActivity();
+            if (context != null && !context.isFinishing() && currentActivity != context) {
+              currentActivity = context;
+              // Create a new RedBox when currentActivity get updated
+              mRedBoxDialog =
+                  new RedBoxDialog(currentActivity, DevSupportManagerBase.this, mRedBoxHandler);
+            }
+            if (currentActivity == null || currentActivity.isFinishing()) {
+              FLog.e(
+                  ReactConstants.TAG,
+                  "Unable to launch redbox because react activity "
+                      + "is not available, here is the error that redbox would've displayed: "
+                      + message);
+              return;
+            }
             if (mRedBoxDialog == null) {
-              Activity context = mReactInstanceManagerHelper.getCurrentActivity();
-              if (context == null || context.isFinishing()) {
-                FLog.e(
-                    ReactConstants.TAG,
-                    "Unable to launch redbox because react activity "
-                        + "is not available, here is the error that redbox would've displayed: "
-                        + message);
-                return;
-              }
-              mRedBoxDialog = new RedBoxDialog(context, DevSupportManagerBase.this, mRedBoxHandler);
+              mRedBoxDialog =
+                  new RedBoxDialog(currentActivity, DevSupportManagerBase.this, mRedBoxHandler);
             }
             if (mRedBoxDialog.isShowing()) {
               // Sometimes errors cause multiple errors to be thrown in JS in quick succession. Only
@@ -410,7 +380,7 @@ public abstract class DevSupportManagerBase
             // Only report native errors here. JS errors are reported
             // inside {@link #updateJSError} after source mapping.
             if (mRedBoxHandler != null && errorType == ErrorType.NATIVE) {
-              mRedBoxHandler.handleRedbox(message, stack, RedBoxHandler.ErrorType.NATIVE);
+              mRedBoxHandler.handleRedbox(message, stack, ErrorType.NATIVE);
             }
             mRedBoxDialog.resetReporting();
             mRedBoxDialog.show();
@@ -442,6 +412,7 @@ public abstract class DevSupportManagerBase
             handleReloadJS();
           }
         });
+
     if (mDevSettings.isDeviceDebugEnabled()) {
       // For on-device debugging we link out to Flipper.
       // Since we're assuming Flipper is available, also include the DevTools.
@@ -474,27 +445,14 @@ public abstract class DevSupportManagerBase
                   mApplicationContext.getString(R.string.catalyst_open_flipper_error));
             }
           });
-    } else {
-      // For remote debugging, we open up Chrome running the app in a web worker.
-      // Note that this requires async communication, which will not work for Turbo Modules.
-      options.put(
-          mDevSettings.isRemoteJSDebugEnabled()
-              ? mApplicationContext.getString(R.string.catalyst_debug_stop)
-              : mApplicationContext.getString(R.string.catalyst_debug),
-          new DevOptionHandler() {
-            @Override
-            public void onOptionSelected() {
-              mDevSettings.setRemoteJSDebugEnabled(!mDevSettings.isRemoteJSDebugEnabled());
-              handleReloadJS();
-            }
-          });
     }
+
     options.put(
         mApplicationContext.getString(R.string.catalyst_change_bundle_location),
         new DevOptionHandler() {
           @Override
           public void onOptionSelected() {
-            Activity context = mReactInstanceManagerHelper.getCurrentActivity();
+            Activity context = mReactInstanceDevHelper.getCurrentActivity();
             if (context == null || context.isFinishing()) {
               FLog.e(
                   ReactConstants.TAG,
@@ -524,14 +482,16 @@ public abstract class DevSupportManagerBase
             bundleLocationDialog.show();
           }
         });
+
     options.put(
-        // NOTE: `isElementInspectorEnabled` is not guaranteed to be accurate.
-        mApplicationContext.getString(R.string.catalyst_inspector),
+        mDevSettings.isElementInspectorEnabled()
+            ? mApplicationContext.getString(R.string.catalyst_inspector_stop)
+            : mApplicationContext.getString(R.string.catalyst_inspector),
         new DevOptionHandler() {
           @Override
           public void onOptionSelected() {
             mDevSettings.setElementInspectorEnabled(!mDevSettings.isElementInspectorEnabled());
-            mReactInstanceManagerHelper.toggleElementInspector();
+            mReactInstanceDevHelper.toggleElementInspector();
           }
         });
 
@@ -563,17 +523,6 @@ public abstract class DevSupportManagerBase
           }
         });
 
-    options.put(
-        mIsSamplingProfilerEnabled
-            ? mApplicationContext.getString(R.string.catalyst_sample_profiler_disable)
-            : mApplicationContext.getString(R.string.catalyst_sample_profiler_enable),
-        new DevOptionHandler() {
-          @Override
-          public void onOptionSelected() {
-            toggleJSSamplingProfiler();
-          }
-        });
-
     options.put(
         mDevSettings.isFpsDebugEnabled()
             ? mApplicationContext.getString(R.string.catalyst_perf_monitor_stop)
@@ -583,7 +532,7 @@ public abstract class DevSupportManagerBase
           public void onOptionSelected() {
             if (!mDevSettings.isFpsDebugEnabled()) {
               // Request overlay permission if needed when "Show Perf Monitor" option is selected
-              Context context = mReactInstanceManagerHelper.getCurrentActivity();
+              Context context = mReactInstanceDevHelper.getCurrentActivity();
               if (context == null) {
                 FLog.e(ReactConstants.TAG, "Unable to get reference to react activity");
               } else {
@@ -610,15 +559,25 @@ public abstract class DevSupportManagerBase
 
     final DevOptionHandler[] optionHandlers = options.values().toArray(new DevOptionHandler[0]);
 
-    Activity context = mReactInstanceManagerHelper.getCurrentActivity();
+    Activity context = mReactInstanceDevHelper.getCurrentActivity();
     if (context == null || context.isFinishing()) {
       FLog.e(
           ReactConstants.TAG,
           "Unable to launch dev options menu because react activity " + "isn't available");
       return;
     }
+
+    final TextView textView = new TextView(getApplicationContext());
+    textView.setText("React Native DevMenu (" + getUniqueTag() + ")");
+    textView.setPadding(0, 50, 0, 0);
+    textView.setGravity(Gravity.CENTER);
+    textView.setTextColor(Color.BLACK);
+    textView.setTextSize(17);
+    textView.setTypeface(textView.getTypeface(), Typeface.BOLD);
+
     mDevOptionsDialog =
         new AlertDialog.Builder(context)
+            .setCustomTitle(textView)
             .setItems(
                 options.keySet().toArray(new String[0]),
                 new DialogInterface.OnClickListener() {
@@ -642,52 +601,6 @@ public abstract class DevSupportManagerBase
     }
   }
 
-  /** Starts of stops the sampling profiler */
-  private void toggleJSSamplingProfiler() {
-    JavaScriptExecutorFactory javaScriptExecutorFactory =
-        mReactInstanceManagerHelper.getJavaScriptExecutorFactory();
-    if (!mIsSamplingProfilerEnabled) {
-      try {
-        javaScriptExecutorFactory.startSamplingProfiler();
-        Toast.makeText(mApplicationContext, "Starting Sampling Profiler", Toast.LENGTH_SHORT)
-            .show();
-      } catch (UnsupportedOperationException e) {
-        Toast.makeText(
-                mApplicationContext,
-                javaScriptExecutorFactory.toString() + " does not support Sampling Profiler",
-                Toast.LENGTH_LONG)
-            .show();
-      } finally {
-        mIsSamplingProfilerEnabled = true;
-      }
-    } else {
-      try {
-        final String outputPath =
-            File.createTempFile(
-                    "sampling-profiler-trace", ".cpuprofile", mApplicationContext.getCacheDir())
-                .getPath();
-        javaScriptExecutorFactory.stopSamplingProfiler(outputPath);
-        Toast.makeText(
-                mApplicationContext,
-                "Saved results from Profiler to " + outputPath,
-                Toast.LENGTH_LONG)
-            .show();
-      } catch (IOException e) {
-        FLog.e(
-            ReactConstants.TAG,
-            "Could not create temporary file for saving results from Sampling Profiler");
-      } catch (UnsupportedOperationException e) {
-        Toast.makeText(
-                mApplicationContext,
-                javaScriptExecutorFactory.toString() + "does not support Sampling Profiler",
-                Toast.LENGTH_LONG)
-            .show();
-      } finally {
-        mIsSamplingProfilerEnabled = false;
-      }
-    }
-  }
-
   /**
    * {@link ReactInstanceDevCommandsHandler} is responsible for enabling/disabling dev support when
    * a React view is attached/detached or when application state changes (e.g. the application is
@@ -705,7 +618,7 @@ public abstract class DevSupportManagerBase
   }
 
   @Override
-  public DeveloperSettings getDevSettings() {
+  public DevInternalSettings getDevSettings() {
     return mDevSettings;
   }
 
@@ -749,7 +662,7 @@ public abstract class DevSupportManagerBase
 
   @Override
   public String getDownloadedJSBundleFile() {
-    return mJSBundleTempFile.getAbsolutePath();
+    return mJSBundleDownloadedFile.getAbsolutePath();
   }
 
   /**
@@ -759,19 +672,19 @@ public abstract class DevSupportManagerBase
    */
   @Override
   public boolean hasUpToDateJSBundleInCache() {
-    if (mIsDevSupportEnabled && mJSBundleTempFile.exists()) {
+    if (mIsDevSupportEnabled && mJSBundleDownloadedFile.exists()) {
       try {
         String packageName = mApplicationContext.getPackageName();
         PackageInfo thisPackage =
             mApplicationContext.getPackageManager().getPackageInfo(packageName, 0);
-        if (mJSBundleTempFile.lastModified() > thisPackage.lastUpdateTime) {
+        if (mJSBundleDownloadedFile.lastModified() > thisPackage.lastUpdateTime) {
           // Base APK has not been updated since we downloaded JS, but if app is using exopackage
           // it may only be a single dex that has been updated. We check for exopackage dir update
           // time in that case.
           File exopackageDir =
               new File(String.format(Locale.US, EXOPACKAGE_LOCATION_FORMAT, packageName));
           if (exopackageDir.exists()) {
-            return mJSBundleTempFile.lastModified() > exopackageDir.lastModified();
+            return mJSBundleDownloadedFile.lastModified() > exopackageDir.lastModified();
           }
           return true;
         }
@@ -831,39 +744,46 @@ public abstract class DevSupportManagerBase
     }
   }
 
-  public void onInternalSettingsChanged() {
-    reloadSettings();
+  protected @Nullable ReactContext getCurrentContext() {
+    return mCurrentContext;
   }
 
-  @Override
-  public void handleReloadJS() {
+  protected @Nullable String getJSAppBundleName() {
+    return mJSAppBundleName;
+  }
 
-    UiThreadUtil.assertOnUiThread();
+  protected Context getApplicationContext() {
+    return mApplicationContext;
+  }
 
-    ReactMarker.logMarker(
-        ReactMarkerConstants.RELOAD,
-        mDevSettings.getPackagerConnectionSettings().getDebugServerHost());
+  protected DevServerHelper getDevServerHelper() {
+    return mDevServerHelper;
+  }
 
-    // dismiss redbox if exists
-    hideRedboxDialog();
-
-    if (mDevSettings.isRemoteJSDebugEnabled()) {
-      PrinterHolder.getPrinter()
-          .logMessage(ReactDebugOverlayTags.RN_CORE, "RNCore: load from Proxy");
-      mDevLoadingViewController.showForRemoteJSEnabled();
-      mDevLoadingViewVisible = true;
-      reloadJSInProxyMode();
-    } else {
-      PrinterHolder.getPrinter()
-          .logMessage(ReactDebugOverlayTags.RN_CORE, "RNCore: load from Server");
-      String bundleURL =
-          mDevServerHelper.getDevServerBundleURL(Assertions.assertNotNull(mJSAppBundleName));
-      reloadJSFromServer(bundleURL);
-    }
+  protected ReactInstanceDevHelper getReactInstanceDevHelper() {
+    return mReactInstanceDevHelper;
   }
 
-  @Override
-  public void loadSplitBundleFromServer(String bundlePath, final DevSplitBundleCallback callback) {
+  @UiThread
+  private void showDevLoadingViewForUrl(String bundleUrl) {
+    mDevLoadingViewController.showForUrl(bundleUrl);
+    mDevLoadingViewVisible = true;
+  }
+
+  @UiThread
+  protected void showDevLoadingViewForRemoteJSEnabled() {
+    mDevLoadingViewController.showForRemoteJSEnabled();
+    mDevLoadingViewVisible = true;
+  }
+
+  @UiThread
+  protected void hideDevLoadingView() {
+    mDevLoadingViewController.hide();
+    mDevLoadingViewVisible = false;
+  }
+
+  public void fetchSplitBundleAndCreateBundleLoader(
+      String bundlePath, final CallbackWithBundleLoader callback) {
     final String bundleUrl = mDevServerHelper.getDevServerSplitBundleURL(bundlePath);
     // The bundle path may contain the '/' character, which is not allowed in file names.
     final File bundleFile =
@@ -886,16 +806,15 @@ public abstract class DevSupportManagerBase
                         });
 
                     @Nullable ReactContext context = mCurrentContext;
-                    if (context == null || !context.hasActiveCatalystInstance()) {
+                    if (context == null || !context.hasActiveReactInstance()) {
                       return;
                     }
 
-                    JSBundleLoader.createCachedSplitBundleFromNetworkLoader(
-                            bundleUrl, bundleFile.getAbsolutePath())
-                        .loadScript(context.getCatalystInstance());
-                    context.getJSModule(HMRClient.class).registerBundle(bundleUrl);
+                    JSBundleLoader bundleLoader =
+                        JSBundleLoader.createCachedSplitBundleFromNetworkLoader(
+                            bundleUrl, bundleFile.getAbsolutePath());
 
-                    callback.onSuccess();
+                    callback.onSuccess(bundleLoader);
                   }
 
                   @Override
@@ -925,16 +844,14 @@ public abstract class DevSupportManagerBase
 
   @UiThread
   private void showSplitBundleDevLoadingView(String bundleUrl) {
-    mDevLoadingViewController.showForUrl(bundleUrl);
-    mDevLoadingViewVisible = true;
+    showDevLoadingViewForUrl(bundleUrl);
     mPendingJSSplitBundleRequests++;
   }
 
   @UiThread
   private void hideSplitBundleDevLoadingView() {
     if (--mPendingJSSplitBundleRequests == 0) {
-      mDevLoadingViewController.hide();
-      mDevLoadingViewVisible = false;
+      hideDevLoadingView();
     }
   }
 
@@ -971,53 +888,8 @@ public abstract class DevSupportManagerBase
   }
 
   @Override
-  public void onPackagerConnected() {
-    // No-op
-  }
-
-  @Override
-  public void onPackagerDisconnected() {
-    // No-op
-  }
-
-  @Override
-  public void onPackagerReloadCommand() {
-    // Disable debugger to resume the JsVM & avoid thread locks while reloading
-    mDevServerHelper.disableDebugger();
-    UiThreadUtil.runOnUiThread(
-        new Runnable() {
-          @Override
-          public void run() {
-            handleReloadJS();
-          }
-        });
-  }
-
-  @Override
-  public void onPackagerDevMenuCommand() {
-    UiThreadUtil.runOnUiThread(
-        new Runnable() {
-          @Override
-          public void run() {
-            showDevOptionsDialog();
-          }
-        });
-  }
-
-  @Override
-  public void onCaptureHeapCommand(final Responder responder) {
-    UiThreadUtil.runOnUiThread(
-        new Runnable() {
-          @Override
-          public void run() {
-            handleCaptureHeap(responder);
-          }
-        });
-  }
-
-  @Override
-  public @Nullable Map<String, RequestHandler> customCommandHandlers() {
-    return mCustomPackagerCommandHandlers;
+  public @Nullable ErrorType getLastErrorType() {
+    return mLastErrorType;
   }
 
   private void handleCaptureHeap(final Responder responder) {
@@ -1051,54 +923,7 @@ public abstract class DevSupportManagerBase
     mLastErrorTitle = message;
     mLastErrorStack = stack;
     mLastErrorCookie = errorCookie;
-  }
-
-  private void reloadJSInProxyMode() {
-    // When using js proxy, there is no need to fetch JS bundle as proxy executor will do that
-    // anyway
-    mDevServerHelper.launchJSDevtools();
-
-    JavaJSExecutor.Factory factory =
-        new JavaJSExecutor.Factory() {
-          @Override
-          public JavaJSExecutor create() throws Exception {
-            WebsocketJavaScriptExecutor executor = new WebsocketJavaScriptExecutor();
-            SimpleSettableFuture<Boolean> future = new SimpleSettableFuture<>();
-            executor.connect(
-                mDevServerHelper.getWebsocketProxyURL(), getExecutorConnectCallback(future));
-            // TODO(t9349129) Don't use timeout
-            try {
-              future.get(90, TimeUnit.SECONDS);
-              return executor;
-            } catch (ExecutionException e) {
-              throw (Exception) e.getCause();
-            } catch (InterruptedException | TimeoutException e) {
-              throw new RuntimeException(e);
-            }
-          }
-        };
-    mReactInstanceManagerHelper.onReloadWithJSDebugger(factory);
-  }
-
-  private WebsocketJavaScriptExecutor.JSExecutorConnectCallback getExecutorConnectCallback(
-      final SimpleSettableFuture<Boolean> future) {
-    return new WebsocketJavaScriptExecutor.JSExecutorConnectCallback() {
-      @Override
-      public void onSuccess() {
-        future.set(true);
-        mDevLoadingViewController.hide();
-        mDevLoadingViewVisible = false;
-      }
-
-      @Override
-      public void onFailure(final Throwable cause) {
-        mDevLoadingViewController.hide();
-        mDevLoadingViewVisible = false;
-        FLog.e(ReactConstants.TAG, "Failed to connect to debugger!", cause);
-        future.setException(
-            new IOException(mApplicationContext.getString(R.string.catalyst_debug_error), cause));
-      }
-    };
+    mLastErrorType = errorType;
   }
 
   public void reloadJSFromServer(final String bundleURL) {
@@ -1111,22 +936,17 @@ public abstract class DevSupportManagerBase
                 new Runnable() {
                   @Override
                   public void run() {
-                    mReactInstanceManagerHelper.onJSBundleLoadedFromServer();
+                    mReactInstanceDevHelper.onJSBundleLoadedFromServer();
                   }
                 });
           }
         });
   }
 
-  protected interface BundleLoadCallback {
-    void onSuccess();
-  }
-
-  protected void reloadJSFromServer(final String bundleURL, final BundleLoadCallback callback) {
+  public void reloadJSFromServer(final String bundleURL, final BundleLoadCallback callback) {
     ReactMarker.logMarker(ReactMarkerConstants.DOWNLOAD_START);
 
-    mDevLoadingViewController.showForUrl(bundleURL);
-    mDevLoadingViewVisible = true;
+    showDevLoadingViewForUrl(bundleURL);
 
     final BundleDownloader.BundleInfo bundleInfo = new BundleDownloader.BundleInfo();
 
@@ -1134,8 +954,7 @@ public abstract class DevSupportManagerBase
         new DevBundleDownloadListener() {
           @Override
           public void onSuccess() {
-            mDevLoadingViewController.hide();
-            mDevLoadingViewVisible = false;
+            hideDevLoadingView();
             synchronized (DevSupportManagerBase.this) {
               mBundleStatus.isLastDownloadSucess = true;
               mBundleStatus.updateTimestamp = System.currentTimeMillis();
@@ -1160,8 +979,7 @@ public abstract class DevSupportManagerBase
 
           @Override
           public void onFailure(final Exception cause) {
-            mDevLoadingViewController.hide();
-            mDevLoadingViewVisible = false;
+            hideDevLoadingView();
             synchronized (DevSupportManagerBase.this) {
               mBundleStatus.isLastDownloadSucess = false;
             }
@@ -1172,7 +990,7 @@ public abstract class DevSupportManagerBase
             reportBundleLoadingFailure(cause);
           }
         },
-        mJSBundleTempFile,
+        mJSBundleDownloadedFile,
         bundleURL,
         bundleInfo);
   }
@@ -1263,7 +1081,7 @@ public abstract class DevSupportManagerBase
           @Override
           public void run() {
             mDevSettings.setElementInspectorEnabled(!mDevSettings.isElementInspectorEnabled());
-            mReactInstanceManagerHelper.toggleElementInspector();
+            mReactInstanceDevHelper.toggleElementInspector();
           }
         });
   }
@@ -1298,7 +1116,59 @@ public abstract class DevSupportManagerBase
         mDevLoadingViewController.showMessage("Reloading...");
       }
 
-      mDevServerHelper.openPackagerConnection(this.getClass().getSimpleName(), this);
+      mDevServerHelper.openPackagerConnection(
+          this.getClass().getSimpleName(),
+          new PackagerCommandListener() {
+            @Override
+            public void onPackagerConnected() {
+              // No-op
+            }
+
+            @Override
+            public void onPackagerDisconnected() {
+              // No-op
+            }
+
+            @Override
+            public void onPackagerReloadCommand() {
+              // Disable debugger to resume the JsVM & avoid thread locks while reloading
+              mDevServerHelper.disableDebugger();
+              UiThreadUtil.runOnUiThread(
+                  new Runnable() {
+                    @Override
+                    public void run() {
+                      handleReloadJS();
+                    }
+                  });
+            }
+
+            @Override
+            public void onPackagerDevMenuCommand() {
+              UiThreadUtil.runOnUiThread(
+                  new Runnable() {
+                    @Override
+                    public void run() {
+                      showDevOptionsDialog();
+                    }
+                  });
+            }
+
+            @Override
+            public void onCaptureHeapCommand(final Responder responder) {
+              UiThreadUtil.runOnUiThread(
+                  new Runnable() {
+                    @Override
+                    public void run() {
+                      handleCaptureHeap(responder);
+                    }
+                  });
+            }
+
+            @Override
+            public @Nullable Map<String, RequestHandler> customCommandHandlers() {
+              return mCustomPackagerCommandHandlers;
+            }
+          });
     } else {
       // hide FPS debug overlay
       if (mDebugOverlayController != null) {
@@ -1339,4 +1209,18 @@ public abstract class DevSupportManagerBase
       DevSupportManager.PackagerLocationCustomizer packagerLocationCustomizer) {
     mPackagerLocationCustomizer = packagerLocationCustomizer;
   }
+
+  @Override
+  public @Nullable Activity getCurrentActivity() {
+    return mReactInstanceDevHelper.getCurrentActivity();
+  }
+
+  @Override
+  public @Nullable SurfaceDelegate createSurfaceDelegate(String moduleName) {
+    if (mSurfaceDelegateFactory == null) {
+      return null;
+    }
+
+    return mSurfaceDelegateFactory.createSurfaceDelegate(moduleName);
+  }
 }