react-native-windows 0.76.3 → 0.77.0-preview.2

package/Libraries/Components/View/ViewNativeComponent.js

@@ -10,113 +10,21 @@
 
 import type {
   HostComponent,
-  PartialViewConfig,
+  HostInstance,
 } from '../../Renderer/shims/ReactNativeTypes';
 
 import * as NativeComponentRegistry from '../../NativeComponent/NativeComponentRegistry';
 import codegenNativeCommands from '../../Utilities/codegenNativeCommands';
-import Platform from '../../Utilities/Platform';
 import {type ViewProps as Props} from './ViewPropTypes';
-import * as React from 'react';
-
-export const __INTERNAL_VIEW_CONFIG: PartialViewConfig =
-  Platform.OS === 'android'
-    ? {
-        uiViewClassName: 'RCTView',
-        validAttributes: {
-          // ReactClippingViewManager @ReactProps
-          removeClippedSubviews: true,
-
-          // ReactViewManager @ReactProps
-          accessible: true,
-          hasTVPreferredFocus: true,
-          nextFocusDown: true,
-          nextFocusForward: true,
-          nextFocusLeft: true,
-          nextFocusRight: true,
-          nextFocusUp: true,
-
-          borderRadius: true,
-          borderTopLeftRadius: true,
-          borderTopRightRadius: true,
-          borderBottomRightRadius: true,
-          borderBottomLeftRadius: true,
-          borderTopStartRadius: true,
-          borderTopEndRadius: true,
-          borderBottomStartRadius: true,
-          borderBottomEndRadius: true,
-          borderEndEndRadius: true,
-          borderEndStartRadius: true,
-          borderStartEndRadius: true,
-          borderStartStartRadius: true,
-          borderStyle: true,
-          hitSlop: true,
-          pointerEvents: true,
-          nativeBackgroundAndroid: true,
-          nativeForegroundAndroid: true,
-          needsOffscreenAlphaCompositing: true,
-
-          borderWidth: true,
-          borderLeftWidth: true,
-          borderRightWidth: true,
-          borderTopWidth: true,
-          borderBottomWidth: true,
-          borderStartWidth: true,
-          borderEndWidth: true,
-
-          borderColor: {
-            process: require('../../StyleSheet/processColor').default,
-          },
-          borderLeftColor: {
-            process: require('../../StyleSheet/processColor').default,
-          },
-          borderRightColor: {
-            process: require('../../StyleSheet/processColor').default,
-          },
-          borderTopColor: {
-            process: require('../../StyleSheet/processColor').default,
-          },
-          borderBottomColor: {
-            process: require('../../StyleSheet/processColor').default,
-          },
-          borderStartColor: {
-            process: require('../../StyleSheet/processColor').default,
-          },
-          borderEndColor: {
-            process: require('../../StyleSheet/processColor').default,
-          },
-          borderBlockColor: {
-            process: require('../../StyleSheet/processColor').default,
-          },
-          borderBlockEndColor: {
-            process: require('../../StyleSheet/processColor').default,
-          },
-          borderBlockStartColor: {
-            process: require('../../StyleSheet/processColor').default,
-          },
-          focusable: true,
-          overflow: true,
-          backfaceVisibility: true,
-          experimental_layoutConformance: true,
-        },
-      }
-    : {
-        uiViewClassName: 'RCTView',
-      };
 
 const ViewNativeComponent: HostComponent<Props> =
-  NativeComponentRegistry.get<Props>('RCTView', () => __INTERNAL_VIEW_CONFIG);
+  NativeComponentRegistry.get<Props>('RCTView', () => ({
+    uiViewClassName: 'RCTView',
+  }));
 
 interface NativeCommands {
-  +hotspotUpdate: (
-    viewRef: React.ElementRef<HostComponent<mixed>>,
-    x: number,
-    y: number,
-  ) => void;
-  +setPressed: (
-    viewRef: React.ElementRef<HostComponent<mixed>>,
-    pressed: boolean,
-  ) => void;
+  +hotspotUpdate: (viewRef: HostInstance, x: number, y: number) => void;
+  +setPressed: (viewRef: HostInstance, pressed: boolean) => void;
 }
 
 export const Commands: NativeCommands = codegenNativeCommands<NativeCommands>({

package/Libraries/Components/View/ViewPropTypes.d.ts

@@ -318,4 +318,11 @@ export interface ViewProps
    * Used to reference react managed views from native code.
    */
   nativeID?: string | undefined;
+
+  /**
+   * Contols whether this view, and its transitive children, are laid in a way
+   * consistent with web browsers ('strict'), or consistent with existing
+   * React Native code which may rely on incorrect behavior ('classic').
+   */
+  experimental_layoutConformance?: 'strict' | 'classic' | undefined;
 }

package/Libraries/Components/View/ViewPropTypes.js

@@ -567,9 +567,6 @@ export type ViewProps = $ReadOnly<{|
    * optimization. Set this property to `false` to disable this optimization and
    * ensure that this `View` exists in the native view hierarchy.
    *
-   * @platform android
-   * In Fabric, this prop is used in ios as well.
-   *
    * See https://reactnative.dev/docs/view#collapsable
    */
   collapsable?: ?boolean,

package/Libraries/Components/View/ViewPropTypes.windows.js

@@ -626,6 +626,8 @@ export type ViewProps = $ReadOnly<{|
    * See https://reactnative.dev/docs/view#aria-hidden
    */
   'aria-hidden'?: ?boolean,
+  'aria-multiselectable'?: ?boolean, // Windows
+  'aria-required'?: ?boolean, // Windows
 
   /**
    * Views that are only used to layout their children or otherwise don't draw
@@ -633,9 +635,6 @@ export type ViewProps = $ReadOnly<{|
    * optimization. Set this property to `false` to disable this optimization and
    * ensure that this `View` exists in the native view hierarchy.
    *
-   * @platform android
-   * In Fabric, this prop is used in ios as well.
-   *
    * See https://reactnative.dev/docs/view#collapsable
    */
   collapsable?: ?boolean,

package/Libraries/Core/ExceptionsManager.js

@@ -22,10 +22,11 @@ type ExceptionDecorator = ExceptionData => ExceptionData;
 let userExceptionDecorator: ?ExceptionDecorator;
 let inUserExceptionDecorator = false;
 
-// This Symbol is used to decorate an ExtendedError with extra data in select usecases.
+// This string is used to decorate an ExtendedError with extra data in select usecases.
 // Note that data passed using this method should be strictly contained,
 // as data that's not serializable/too large may cause issues with passing the error to the native code.
-const decoratedExtraDataKey: symbol = Symbol('decoratedExtraDataKey');
+// TODO(T204185517): We should use a Symbol for this, but jsi through jsc doesn't support it yet.
+const decoratedExtraDataKey = 'RN$ErrorExtraDataKey';
 
 /**
  * Allows the app to add information to the exception report before it is sent
@@ -120,6 +121,12 @@ function reportException(
     const NativeExceptionsManager =
       require('./NativeExceptionsManager').default;
     if (NativeExceptionsManager) {
+      if (isFatal) {
+        if (global.RN$hasHandledFatalException?.()) {
+          return;
+        }
+        global.RN$notifyOfFatalException?.();
+      }
       NativeExceptionsManager.reportException(data);
     }
   }
@@ -140,24 +147,31 @@ let inExceptionHandler = false;
  * Logs exceptions to the (native) console and displays them
  */
 function handleException(e: mixed, isFatal: boolean) {
-  let error: Error;
-  if (e instanceof Error) {
-    error = e;
-  } else {
-    // Workaround for reporting errors caused by `throw 'some string'`
-    // Unfortunately there is no way to figure out the stacktrace in this
-    // case, so if you ended up here trying to trace an error, look for
-    // `throw '<error message>'` somewhere in your codebase.
-    error = new SyntheticError(e);
-  }
-  try {
-    inExceptionHandler = true;
-    /* $FlowFixMe[class-object-subtyping] added when improving typing for this
-     * parameters */
-    // $FlowFixMe[incompatible-call]
-    reportException(error, isFatal, /*reportToConsole*/ true);
-  } finally {
-    inExceptionHandler = false;
+  // TODO(T196834299): We should really use a c++ turbomodule for this
+  const reportToConsole = true;
+  if (
+    !global.RN$handleException ||
+    !global.RN$handleException(e, isFatal, reportToConsole)
+  ) {
+    let error: Error;
+    if (e instanceof Error) {
+      error = e;
+    } else {
+      // Workaround for reporting errors caused by `throw 'some string'`
+      // Unfortunately there is no way to figure out the stacktrace in this
+      // case, so if you ended up here trying to trace an error, look for
+      // `throw '<error message>'` somewhere in your codebase.
+      error = new SyntheticError(e);
+    }
+    try {
+      inExceptionHandler = true;
+      /* $FlowFixMe[class-object-subtyping] added when improving typing for this
+       * parameters */
+      // $FlowFixMe[incompatible-call]
+      reportException(error, isFatal, reportToConsole);
+    } finally {
+      inExceptionHandler = false;
+    }
   }
 }
 
@@ -169,7 +183,7 @@ function reactConsoleErrorHandler(...args) {
   if (!console.reportErrorsAsExceptions) {
     return;
   }
-  if (inExceptionHandler) {
+  if (inExceptionHandler || global.RN$inExceptionHandler?.()) {
     // The fundamental trick here is that are multiple entry point to logging errors:
     // (see D19743075 for more background)
     //
@@ -223,14 +237,21 @@ function reactConsoleErrorHandler(...args) {
     error.name = 'console.error';
   }
 
-  reportException(
-    /* $FlowFixMe[class-object-subtyping] added when improving typing for this
-     * parameters */
-    // $FlowFixMe[incompatible-call]
-    error,
-    false, // isFatal
-    false, // reportToConsole
-  );
+  const isFatal = false;
+  const reportToConsole = false;
+  if (
+    !global.RN$handleException ||
+    !global.RN$handleException(error, isFatal, reportToConsole)
+  ) {
+    reportException(
+      /* $FlowFixMe[class-object-subtyping] added when improving typing for this
+       * parameters */
+      // $FlowFixMe[incompatible-call]
+      error,
+      isFatal,
+      reportToConsole,
+    );
+  }
 }
 
 /**

package/Libraries/Core/ReactNativeVersion.js

@@ -15,9 +15,9 @@ const version: $ReadOnly<{
   prerelease: string | null,
 }> = {
   major: 0,
-  minor: 76,
-  patch: 2,
-  prerelease: null,
+  minor: 77,
+  patch: 0,
+  prerelease: 'rc.4',
 };
 
 module.exports = {version};

package/Libraries/Core/__mocks__/NativeExceptionsManager.js

@@ -14,7 +14,6 @@ import typeof NativeExceptionsManager from '../NativeExceptionsManager';
 export default ({
   reportFatalException: jest.fn(),
   reportSoftException: jest.fn(),
-  updateExceptionMessage: jest.fn(),
   dismissRedbox: jest.fn(),
   reportException: jest.fn(),
 }: NativeExceptionsManager);

package/Libraries/Core/setUpBatchedBridge.js

@@ -16,16 +16,7 @@ if (global.RN$Bridgeless === true && global.RN$registerCallableModule) {
 } else {
   const BatchedBridge = require('../BatchedBridge/BatchedBridge');
   registerModule = (
-    moduleName:
-      | $TEMPORARY$string<'GlobalPerformanceLogger'>
-      | $TEMPORARY$string<'HMRClient'>
-      | $TEMPORARY$string<'HeapCapture'>
-      | $TEMPORARY$string<'JSTimers'>
-      | $TEMPORARY$string<'RCTDeviceEventEmitter'>
-      | $TEMPORARY$string<'RCTLog'>
-      | $TEMPORARY$string<'RCTNativeAppEventEmitter'>
-      | $TEMPORARY$string<'SamplingProfiler'>
-      | $TEMPORARY$string<'Systrace'>,
+    moduleName: string,
     /* $FlowFixMe[missing-local-annot] The type annotation(s) required by
      * Flow's LTI update could not be added via codemod */
     factory,

package/Libraries/Core/setUpDeveloperTools.js

@@ -42,13 +42,9 @@ if (__DEV__) {
   if (!Platform.isTesting) {
     const HMRClient = require('../Utilities/HMRClient');
 
-    // [0.76 only] When under React Native DevTools, log "JavaScript logs will
-    // be removed from Metro..." warning, and continue to forward logs.
     if (global.__FUSEBOX_HAS_FULL_CONSOLE_SUPPORT__) {
       HMRClient.unstable_notifyFuseboxConsoleEnabled();
-    }
-
-    if (console._isPolyfilled) {
+    } else if (console._isPolyfilled) {
       // We assume full control over the console and send JavaScript logs to Metro.
       [
         'trace',

package/Libraries/Core/setUpErrorHandling.js

@@ -10,24 +10,26 @@
 
 'use strict';
 
-/**
- * Sets up the console and exception handling (redbox) for React Native.
- * You can use this module directly, or just require InitializeCore.
- */
-const ExceptionsManager = require('./ExceptionsManager');
-ExceptionsManager.installConsoleErrorReporter();
+if (global.RN$useAlwaysAvailableJSErrorHandling !== true) {
+  /**
+   * Sets up the console and exception handling (redbox) for React Native.
+   * You can use this module directly, or just require InitializeCore.
+   */
+  const ExceptionsManager = require('./ExceptionsManager');
+  ExceptionsManager.installConsoleErrorReporter();
 
-// Set up error handler
-if (!global.__fbDisableExceptionsManager) {
-  const handleError = (e: mixed, isFatal: boolean) => {
-    try {
-      ExceptionsManager.handleException(e, isFatal);
-    } catch (ee) {
-      console.log('Failed to print error: ', ee.message);
-      throw e;
-    }
-  };
+  // Set up error handler
+  if (!global.__fbDisableExceptionsManager) {
+    const handleError = (e: mixed, isFatal: boolean) => {
+      try {
+        ExceptionsManager.handleException(e, isFatal);
+      } catch (ee) {
+        console.log('Failed to print error: ', ee.message);
+        throw e;
+      }
+    };
 
-  const ErrorUtils = require('../vendor/core/ErrorUtils');
-  ErrorUtils.setGlobalHandler(handleError);
+    const ErrorUtils = require('../vendor/core/ErrorUtils');
+    ErrorUtils.setGlobalHandler(handleError);
+  }
 }

package/Libraries/Core/setUpReactDevTools.js

@@ -10,14 +10,44 @@
 
 'use strict';
 
-import type {Domain} from '../../src/private/fusebox/setUpFuseboxReactDevToolsDispatcher';
+import type {Domain} from '../../src/private/debugging/setUpFuseboxReactDevToolsDispatcher';
+import type {Spec as NativeReactDevToolsRuntimeSettingsModuleSpec} from '../../src/private/fusebox/specs/NativeReactDevToolsRuntimeSettingsModule';
 
 if (__DEV__) {
   // Register dispatcher on global, which can be used later by Chrome DevTools frontend
-  require('../../src/private/fusebox/setUpFuseboxReactDevToolsDispatcher');
+  require('../../src/private/debugging/setUpFuseboxReactDevToolsDispatcher');
+  const {
+    initialize,
+    connectToDevTools,
+    connectWithCustomMessagingProtocol,
+  } = require('react-devtools-core');
+
+  const reactDevToolsSettingsManager = require('../../src/private/debugging/ReactDevToolsSettingsManager');
+  const serializedHookSettings =
+    reactDevToolsSettingsManager.getGlobalHookSettings();
+  const maybeReactDevToolsRuntimeSettingsModuleModule =
+    require('../../src/private/fusebox/specs/NativeReactDevToolsRuntimeSettingsModule').default;
+
+  let hookSettings = null;
+  if (serializedHookSettings != null) {
+    try {
+      const parsedSettings = JSON.parse(serializedHookSettings);
+      hookSettings = parsedSettings;
+    } catch {
+      console.error(
+        'Failed to parse persisted React DevTools hook settings. React DevTools will be initialized with default settings.',
+      );
+    }
+  }
+
+  const {
+    isProfiling: shouldStartProfilingNow,
+    profilingSettings: initialProfilingSettings,
+  } = readReloadAndProfileConfig(maybeReactDevToolsRuntimeSettingsModuleModule);
 
   // Install hook before React is loaded.
-  const reactDevTools = require('react-devtools-core');
+  initialize(hookSettings, shouldStartProfilingNow, initialProfilingSettings);
+
   // This should be defined in DEV, otherwise error is expected.
   const fuseboxReactDevToolsDispatcher =
     global.__FUSEBOX_REACT_DEVTOOLS_DISPATCHER__;
@@ -25,9 +55,14 @@ if (__DEV__) {
     fuseboxReactDevToolsDispatcher.BINDING_NAME;
 
   const ReactNativeStyleAttributes = require('../Components/View/ReactNativeStyleAttributes');
-  const devToolsSettingsManager = require('../DevToolsSettings/DevToolsSettingsManager');
   const resolveRNStyle = require('../StyleSheet/flattenStyle');
 
+  function handleReactDevToolsSettingsUpdate(settings: Object) {
+    reactDevToolsSettingsManager.setGlobalHookSettings(
+      JSON.stringify(settings),
+    );
+  }
+
   let disconnect = null;
   function disconnectBackendFromReactDevToolsInFuseboxIfNeeded() {
     if (disconnect != null) {
@@ -37,7 +72,15 @@ if (__DEV__) {
   }
 
   function connectToReactDevToolsInFusebox(domain: Domain) {
-    disconnect = reactDevTools.connectWithCustomMessagingProtocol({
+    const {
+      isReloadAndProfileSupported,
+      isProfiling,
+      onReloadAndProfile,
+      onReloadAndProfileFlagsReset,
+    } = readReloadAndProfileConfig(
+      maybeReactDevToolsRuntimeSettingsModuleModule,
+    );
+    disconnect = connectWithCustomMessagingProtocol({
       onSubscribe: listener => {
         domain.onMessage.addEventListener(listener);
       },
@@ -47,9 +90,13 @@ if (__DEV__) {
       onMessage: (event, payload) => {
         domain.sendMessage({event, payload});
       },
-      settingsManager: devToolsSettingsManager,
       nativeStyleEditorValidAttributes: Object.keys(ReactNativeStyleAttributes),
       resolveRNStyle,
+      onSettingsUpdated: handleReactDevToolsSettingsUpdate,
+      isReloadAndProfileSupported,
+      isProfiling,
+      onReloadAndProfile,
+      onReloadAndProfileFlagsReset,
     });
   }
 
@@ -101,14 +148,26 @@ if (__DEV__) {
         isWebSocketOpen = true;
       });
 
-      reactDevTools.connectToDevTools({
+      const {
+        isReloadAndProfileSupported,
+        isProfiling,
+        onReloadAndProfile,
+        onReloadAndProfileFlagsReset,
+      } = readReloadAndProfileConfig(
+        maybeReactDevToolsRuntimeSettingsModuleModule,
+      );
+      connectToDevTools({
         isAppActive,
         resolveRNStyle,
         nativeStyleEditorValidAttributes: Object.keys(
           ReactNativeStyleAttributes,
         ),
         websocket: ws,
-        devToolsSettingsManager,
+        onSettingsUpdated: handleReactDevToolsSettingsUpdate,
+        isReloadAndProfileSupported,
+        isProfiling,
+        onReloadAndProfile,
+        onReloadAndProfileFlagsReset,
       });
     }
   }
@@ -140,3 +199,43 @@ if (__DEV__) {
   );
   connectToWSBasedReactDevToolsFrontend(); // Try connecting once on load
 }
+
+function readReloadAndProfileConfig(
+  maybeModule: ?NativeReactDevToolsRuntimeSettingsModuleSpec,
+) {
+  const isReloadAndProfileSupported = maybeModule != null;
+  const config = maybeModule?.getReloadAndProfileConfig();
+  const isProfiling = config?.shouldReloadAndProfile === true;
+  const profilingSettings = {
+    recordChangeDescriptions: config?.recordChangeDescriptions === true,
+    recordTimeline: false,
+  };
+  const onReloadAndProfile = (recordChangeDescriptions: boolean) => {
+    if (maybeModule == null) {
+      return;
+    }
+
+    maybeModule.setReloadAndProfileConfig({
+      shouldReloadAndProfile: true,
+      recordChangeDescriptions,
+    });
+  };
+  const onReloadAndProfileFlagsReset = () => {
+    if (maybeModule == null) {
+      return;
+    }
+
+    maybeModule.setReloadAndProfileConfig({
+      shouldReloadAndProfile: false,
+      recordChangeDescriptions: false,
+    });
+  };
+
+  return {
+    isReloadAndProfileSupported,
+    isProfiling,
+    profilingSettings,
+    onReloadAndProfile,
+    onReloadAndProfileFlagsReset,
+  };
+}

package/Libraries/Core/setUpSegmentFetcher.js

@@ -42,6 +42,7 @@ function __fetchSegment(
         const error = new Error(errorObject.message);
         (error: any).code = errorObject.code; // flowlint-line unclear-type: off
         callback(error);
+        return;
       }
 
       callback(null);

package/Libraries/Core/setUpTimers.js

@@ -21,6 +21,17 @@ if (__DEV__) {
   }
 }
 
+const isEventLoopEnabled = (() => {
+  if (NativeReactNativeFeatureFlags == null) {
+    return false;
+  }
+
+  return (
+    ReactNativeFeatureFlags.enableBridgelessArchitecture() &&
+    !ReactNativeFeatureFlags.disableEventLoopOnBridgeless()
+  );
+})();
+
 // In bridgeless mode, timers are host functions installed from cpp.
 if (global.RN$Bridgeless !== true) {
   /**
@@ -29,14 +40,14 @@ if (global.RN$Bridgeless !== true) {
    */
   const defineLazyTimer = (
     name:
-      | $TEMPORARY$string<'cancelAnimationFrame'>
-      | $TEMPORARY$string<'cancelIdleCallback'>
-      | $TEMPORARY$string<'clearInterval'>
-      | $TEMPORARY$string<'clearTimeout'>
-      | $TEMPORARY$string<'requestAnimationFrame'>
-      | $TEMPORARY$string<'requestIdleCallback'>
-      | $TEMPORARY$string<'setInterval'>
-      | $TEMPORARY$string<'setTimeout'>,
+      | 'cancelAnimationFrame'
+      | 'cancelIdleCallback'
+      | 'clearInterval'
+      | 'clearTimeout'
+      | 'requestAnimationFrame'
+      | 'requestIdleCallback'
+      | 'setInterval'
+      | 'setTimeout',
   ) => {
     polyfillGlobal(name, () => require('./Timers/JSTimers')[name]);
   };
@@ -48,12 +59,7 @@ if (global.RN$Bridgeless !== true) {
   defineLazyTimer('cancelAnimationFrame');
   defineLazyTimer('requestIdleCallback');
   defineLazyTimer('cancelIdleCallback');
-} else if (
-  // TODO remove this condition when bridgeless == modern scheduler everywhere.
-  NativeReactNativeFeatureFlags != null &&
-  // eslint-disable-next-line react-hooks/rules-of-hooks -- false positive due to `use` prefix
-  ReactNativeFeatureFlags.useModernRuntimeScheduler()
-) {
+} else if (isEventLoopEnabled) {
   polyfillGlobal(
     'requestIdleCallback',
     () =>
@@ -72,10 +78,7 @@ if (global.RN$Bridgeless !== true) {
 // We need to check if the native module is available before accessing the
 // feature flag, because otherwise the API would throw an error in the legacy
 // architecture in OSS, where the native module isn't available.
-if (
-  NativeReactNativeFeatureFlags != null &&
-  ReactNativeFeatureFlags.enableMicrotasks()
-) {
+if (isEventLoopEnabled) {
   // This is the flag that tells React to use `queueMicrotask` to batch state
   // updates, instead of using the scheduler to schedule a regular task.
   // We use a global variable because we don't currently have any other

package/Libraries/Debugging/DebuggingOverlay.js

@@ -102,10 +102,9 @@ const styles = StyleSheet.create({
   },
 });
 
-const DebuggingOverlayWithForwardedRef: React.AbstractComponent<
-  {},
-  DebuggingOverlayHandle,
-  React.Node,
-> = React.forwardRef(DebuggingOverlay);
+const DebuggingOverlayWithForwardedRef: component(
+  ref: React.RefSetter<DebuggingOverlayHandle>,
+  ...props: {}
+) = React.forwardRef(DebuggingOverlay);
 
 export default DebuggingOverlayWithForwardedRef;

package/Libraries/Image/AssetSourceResolver.js

@@ -53,6 +53,13 @@ function getAssetPathInDrawableFolder(asset: PackagerAsset): string {
   return drawableFolder + '/' + fileName + '.' + asset.type;
 }
 
+/**
+ * Returns true if the asset can be loaded over the network.
+ */
+function assetSupportsNetworkLoads(asset: PackagerAsset): boolean {
+  return !(asset.type === 'xml' && Platform.OS === 'android');
+}
+
 class AssetSourceResolver {
   serverUrl: ?string;
   // where the jsbundle is being run from
@@ -67,7 +74,11 @@ class AssetSourceResolver {
   }
 
   isLoadedFromServer(): boolean {
-    return !!this.serverUrl;
+    return (
+      this.serverUrl != null &&
+      this.serverUrl !== '' &&
+      assetSupportsNetworkLoads(this.asset)
+    );
   }
 
   isLoadedFromFileSystem(): boolean {