From 7e38cf32eb76d91e056a56faa57b511dcdbe8129 Mon Sep 17 00:00:00 2001
From: Joe Vilches <joevilches@meta.com>
Date: Wed, 18 Sep 2024 16:44:45 -0700
Subject: [PATCH] Fix crash that happens with shadow color with 0 alpha
 (#46551)

Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46551

We crash if we pass a shadow color with 0 alpha due to some divide by 0 logic. This fixes that for inset and outset shadows and adds a test for that case.

Changelog: [Internal]

Reviewed By: NickGerleman

Differential Revision: D62899047

fbshipit-source-id: 2aff1d016dd97bed024df1c3f89bcc62e49f0306
---
 .../react/uimanager/drawable/InsetBoxShadowDrawable.kt    | 8 ++++++--
 .../react/uimanager/drawable/OutsetBoxShadowDrawable.kt   | 8 ++++++--
 packages/rn-tester/js/examples/View/ViewExample.js        | 7 +++++++
 3 files changed, 19 insertions(+), 4 deletions(-)

diff --git a/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/uimanager/drawable/InsetBoxShadowDrawable.kt b/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/uimanager/drawable/InsetBoxShadowDrawable.kt
index 44d0cbe4000d56..f29f148efdb2c0 100644
--- a/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/uimanager/drawable/InsetBoxShadowDrawable.kt
+++ b/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/uimanager/drawable/InsetBoxShadowDrawable.kt
@@ -14,6 +14,7 @@ import android.graphics.Color
 import android.graphics.ColorFilter
 import android.graphics.Paint
 import android.graphics.Path
+import android.graphics.PixelFormat
 import android.graphics.RectF
 import android.graphics.drawable.Drawable
 import androidx.annotation.RequiresApi
@@ -84,8 +85,11 @@ internal class InsetBoxShadowDrawable(
     invalidateSelf()
   }
 
-  override fun getOpacity(): Int =
-      ((shadowPaint.alpha / 255f) / (Color.alpha(shadowColor) / 255f) * 255f).roundToInt()
+  override fun getOpacity(): Int {
+    val alpha = Color.alpha(shadowColor)
+    return if (alpha == 0) PixelFormat.TRANSPARENT
+    else ((shadowPaint.alpha / 255f) / (alpha / 255f) * 255f).roundToInt()
+  }
 
   override fun draw(canvas: Canvas) {
     val computedBorderRadii = computeBorderRadii()
diff --git a/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/uimanager/drawable/OutsetBoxShadowDrawable.kt b/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/uimanager/drawable/OutsetBoxShadowDrawable.kt
index 2bbb82f2b2fd6e..9df839902af88e 100644
--- a/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/uimanager/drawable/OutsetBoxShadowDrawable.kt
+++ b/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/uimanager/drawable/OutsetBoxShadowDrawable.kt
@@ -14,6 +14,7 @@ import android.graphics.Color
 import android.graphics.ColorFilter
 import android.graphics.Paint
 import android.graphics.Path
+import android.graphics.PixelFormat
 import android.graphics.RectF
 import android.graphics.drawable.Drawable
 import androidx.annotation.RequiresApi
@@ -72,8 +73,11 @@ internal class OutsetBoxShadowDrawable(
     invalidateSelf()
   }
 
-  override fun getOpacity(): Int =
-      ((shadowPaint.alpha / 255f) / (Color.alpha(shadowColor) / 255f) * 255f).roundToInt()
+  override fun getOpacity(): Int {
+    val alpha = Color.alpha(shadowColor)
+    return if (alpha == 0) PixelFormat.TRANSPARENT
+    else ((shadowPaint.alpha / 255f) / (alpha / 255f) * 255f).roundToInt()
+  }
 
   override fun draw(canvas: Canvas) {
     val resolutionWidth = bounds.width().toFloat().pxToDp()
diff --git a/packages/rn-tester/js/examples/View/ViewExample.js b/packages/rn-tester/js/examples/View/ViewExample.js
index e93732f21629e2..d63c74ccc0cbb8 100644
--- a/packages/rn-tester/js/examples/View/ViewExample.js
+++ b/packages/rn-tester/js/examples/View/ViewExample.js
@@ -528,6 +528,13 @@ function BoxShadowExample(): React.Node {
             boxShadow: '0px 10px',
           }}
         />
+        <View
+          style={{
+            ...defaultStyleSize,
+            backgroundColor: 'orange',
+            boxShadow: '5px 5px 5px 0px rgba(0, 0, 0, 0)',
+          }}
+        />
       </View>
     </View>
   );