fix(android): crash when setting a percentage borderRadius on Image (#57795)

Summary:
Fixes #53977

Setting a percentage border radius on `<Image>` (e.g. `borderRadius: '50%'`) crashes Android with `java.lang.String cannot be cast to java.lang.Double`. Percentage radii arrive from JS as strings, but `ReactImageManager`'s `borderRadius` `ReactPropGroup` setter was still typed as `Float`, so the reflection-based property updater (`ViewManagersPropertyCache`) failed on the cast. (The crash reproduces on any API level, not just API 35 as reported.)

This applies the same migration `ReactViewManager` received in 0.75: the setter now accepts a `Dynamic` and parses it with `LengthPercentage.setFromDynamic`, which handles both numbers and `'NN%'` strings (invalid values degrade to a warning + null instead of a crash). The old `Float` overload is kept as a deprecated pass-through so existing subclasses stay source/binary compatible, mirroring the `ReactViewManager` precedent, and the public API dump is updated accordingly.

No rendering changes are needed: the manager already delegates to `BackgroundStyleApplicator`, which resolves `PERCENT` length values against the view bounds.

Note: the same `Float`-typed setter still exists in `ReactTextViewManager`, `PreparedLayoutTextViewManager`, `ReactTextInputManager`, `ReactScrollViewManager`, and `ReactHorizontalScrollViewManager`, so `<Text>`, `<TextInput>`, and `<ScrollView>` crash the same way. I kept this PR scoped to the reported Image crash and I'm happy to follow up with the same fix for the others.

## Changelog:

[ANDROID] [FIXED] - Fix crash when setting a percentage borderRadius on Image

Pull Request resolved: #57795

Test Plan:
- Added `testBorderRadius` to `ReactImagePropertyTest`, driving the real crash path (`ViewManager.updateProperties` → reflection prop updater) with `'50%'`, a plain number, a per-corner percentage, and null, asserting the resolved `LengthPercentage` on the view. Without the fix it fails with the exact exception from the issue; with the fix the suite passes (9/9):
  `./gradlew :packages:react-native:ReactAndroid:testDebugUnitTest --tests "com.facebook.react.views.image.ReactImagePropertyTest"`
- Added a `borderRadius: '50%'` image to rn-tester's Image → Border Radius example. Verified on a Pixel 9 Pro emulator (API 36) with rn-tester built from source: the screen that previously redboxed on mount now renders, with the percentage image drawn as a circle and the existing numeric-radius images unchanged (screenshot below).
- Re-recorded the `Image-border-radius-e2e` screenshot baselines. The new image goes inside the shared `border-radius-example` container, which is `flexDirection: 'row'` with `flexWrap: 'wrap'`, so it wraps onto a third row and the container grows taller. That is why the old baselines failed on a dimension mismatch rather than a pixel diff. Regenerated per variant with:
  `jest-e2e /Image-border-radius-e2e.js -u -t '<variant>'`
  for `rntester_android`, `rntester_android_rtl`, `rntester_android_nougat` and `rntester_ios`.
  Each comparison was checked by hand before accepting, to confirm the new image renders as a green-bordered circle rather than a square, that the existing five images keep their positions and that under RTL the new image wraps to the right edge instead of the left. The dimensions back this up: 288 → 432 on `rntester_android` and `rntester_android_rtl`, 216 → 324 on `rntester_android_nougat`, which is exactly one extra row in each case with widths unchanged.
  All deltas: https://www.internalfb.com/compare-screenshots-from-diff/D114576433

## Screenshot

<img width="372" height="786" alt="image" src="https://github.com/user-attachments/assets/fa240927-3850-4036-9f73-f9ad9f825b18" />

Reviewed By: javache

Differential Revision: D114576433

Pulled By: fabriziocucci

fbshipit-source-id: 1ed7fcd14df65d870d28b149c40d40872c597605

Author: sbaiahmed1

packages/react-native/ReactAndroid/api/ReactAndroid.api

@@ -5312,6 +5312,7 @@ public final class com/facebook/react/views/image/ReactImageManager : com/facebo
 	public final fun setBlurRadius (Lcom/facebook/react/views/image/ReactImageView;F)V
 	public final fun setBorderColor (Lcom/facebook/react/views/image/ReactImageView;Ljava/lang/Integer;)V
 	public final fun setBorderRadius (Lcom/facebook/react/views/image/ReactImageView;IF)V
+	public final fun setBorderRadius (Lcom/facebook/react/views/image/ReactImageView;ILcom/facebook/react/bridge/Dynamic;)V
 	public final fun setBorderWidth (Lcom/facebook/react/views/image/ReactImageView;F)V
 	public final fun setDefaultSource (Lcom/facebook/react/views/image/ReactImageView;Lcom/facebook/react/bridge/Dynamic;)V
 	public final fun setDefaultSource (Lcom/facebook/react/views/image/ReactImageView;Ljava/lang/String;)V

packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/image/ReactImageManager.kt

@@ -201,9 +201,20 @@ public constructor(
               ViewProps.BORDER_BOTTOM_RIGHT_RADIUS,
               ViewProps.BORDER_BOTTOM_LEFT_RADIUS,
           ],
-      defaultFloat = Float.NaN,
+  )
+  public fun setBorderRadius(view: ReactImageView, index: Int, rawBorderRadius: Dynamic) {
+    val borderRadius = LengthPercentage.setFromDynamic(rawBorderRadius)
+    BackgroundStyleApplicator.setBorderRadius(view, BorderRadiusProp.values()[index], borderRadius)
+  }
+
+  @Deprecated(
+      "Don't use setBorderRadius(view, index, Float) as it was deprecated in React Native 0.88.0.",
   )
   public fun setBorderRadius(view: ReactImageView, index: Int, borderRadius: Float) {
+    // Keep a direct body rather than routing a Float through DynamicFromObject:
+    // DynamicFromObject(Float).asDouble() throws (boxed Float cannot cast to
+    // Double), and setFromDynamic would not map NaN back to null the way the
+    // original Float path did.
     val radius =
         if (borderRadius.isNaN()) null
         else LengthPercentage(borderRadius, LengthPercentageType.POINT)

packages/react-native/ReactAndroid/src/test/java/com/facebook/react/views/image/ReactImagePropertyTest.kt

@@ -23,9 +23,13 @@ import com.facebook.react.bridge.JavaOnlyMap
 import com.facebook.react.bridge.ReactTestHelper.createMockCatalystInstance
 import com.facebook.react.common.ReactConstants
 import com.facebook.react.internal.featureflags.ReactNativeFeatureFlagsForTests
+import com.facebook.react.uimanager.BackgroundStyleApplicator
 import com.facebook.react.uimanager.DisplayMetricsHolder
+import com.facebook.react.uimanager.LengthPercentage
+import com.facebook.react.uimanager.LengthPercentageType
 import com.facebook.react.uimanager.ReactStylesDiffMap
 import com.facebook.react.uimanager.ThemedReactContext
+import com.facebook.react.uimanager.style.BorderRadiusProp
 import com.facebook.react.util.RNLog
 import com.facebook.react.views.imagehelper.ImageSource
 import com.facebook.soloader.SoLoader
@@ -142,6 +146,48 @@ class ReactImagePropertyTest {
         .isEqualTo(view.imageSource)
   }
 
+  @Test
+  fun testBorderRadius() {
+    val viewManager = ReactImageManager()
+    val view = viewManager.createViewInstance(themeContext)
+
+    // Percentage border radii arrive as strings and must not crash the property updater
+    viewManager.updateProperties(view, buildStyles("borderRadius", "50%"))
+    assertThat(BackgroundStyleApplicator.getBorderRadius(view, BorderRadiusProp.BORDER_RADIUS))
+        .isEqualTo(LengthPercentage(50f, LengthPercentageType.PERCENT))
+
+    viewManager.updateProperties(view, buildStyles("borderRadius", 10.0))
+    assertThat(BackgroundStyleApplicator.getBorderRadius(view, BorderRadiusProp.BORDER_RADIUS))
+        .isEqualTo(LengthPercentage(10f, LengthPercentageType.POINT))
+
+    viewManager.updateProperties(view, buildStyles("borderTopLeftRadius", "25%"))
+    assertThat(
+        BackgroundStyleApplicator.getBorderRadius(view, BorderRadiusProp.BORDER_TOP_LEFT_RADIUS),
+    )
+        .isEqualTo(LengthPercentage(25f, LengthPercentageType.PERCENT))
+
+    viewManager.updateProperties(view, buildStyles("borderRadius", null))
+    assertThat(BackgroundStyleApplicator.getBorderRadius(view, BorderRadiusProp.BORDER_RADIUS))
+        .isNull()
+  }
+
+  @Suppress("DEPRECATION")
+  @Test
+  fun testDeprecatedFloatBorderRadius() {
+    val viewManager = ReactImageManager()
+    val view = viewManager.createViewInstance(themeContext)
+
+    // The deprecated Float overload must not crash and applies the radius as points.
+    viewManager.setBorderRadius(view, 0, 8f)
+    assertThat(BackgroundStyleApplicator.getBorderRadius(view, BorderRadiusProp.BORDER_RADIUS))
+        .isEqualTo(LengthPercentage(8f, LengthPercentageType.POINT))
+
+    // NaN clears the radius, matching the pre-Dynamic Float behavior.
+    viewManager.setBorderRadius(view, 0, Float.NaN)
+    assertThat(BackgroundStyleApplicator.getBorderRadius(view, BorderRadiusProp.BORDER_RADIUS))
+        .isNull()
+  }
+
   @Test
   fun testResizeMode() {
     val viewManager = ReactImageManager()

packages/rn-tester/js/examples/Image/ImageExample.js

@@ -1186,6 +1186,11 @@ const styles = StyleSheet.create({
     borderColor: 'red',
     backgroundColor: 'yellow',
   },
+  borderRadiusPercentage: {
+    borderWidth: 4,
+    borderRadius: '50%',
+    borderColor: 'green',
+  },
   boxShadow: {
     margin: 10,
   },
@@ -1448,6 +1453,10 @@ exports.examples = [
             style={[styles.base, styles.borderRadius5]}
             source={fullImage}
           />
+          <Image
+            style={[styles.base, styles.borderRadiusPercentage]}
+            source={fullImage}
+          />
         </View>
       );
     },