Skip empty text decoration draws

Summary:
`drawSpannedDecoration` now skips zero-line layouts and empty or fully hidden spans before measuring or drawing. Add native regression coverage for the clamped ranges.

Changelog:
[Android][Fixed] - Skip empty and fully hidden text decoration ranges

Differential Revision: D125038370

Author: Abbondanzo

packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/text/TextDecorationStyle.kt

@@ -148,6 +148,12 @@ internal fun drawSpannedDecoration(
     style: TextDecorationStyle,
     yOffsetForLine: (paint: Paint, baseline: Float, thickness: Float) -> Float,
 ) {
+  if (layout.lineCount == 0) return
+  val visibleEnd = visibleTextEnd(layout)
+  val clampedStart = min(start, visibleEnd)
+  val clampedEnd = min(end, visibleEnd)
+  if (clampedStart >= clampedEnd) return
+
   val textPaint = layout.paint
   val effectiveColor =
       if (color != Color.TRANSPARENT) {
@@ -194,10 +200,6 @@ internal fun drawSpannedDecoration(
         }
   }
 
-  val visibleEnd = visibleTextEnd(layout)
-  val clampedStart = min(start, visibleEnd)
-  val clampedEnd = min(end, visibleEnd)
-
   val startLine = layout.getLineForOffset(clampedStart)
   val endLine = layout.getLineForOffset(clampedEnd)
   for (line in startLine..endLine) {

packages/react-native/ReactAndroid/src/test/java/com/facebook/react/views/text/TextDecorationStyleTest.kt

@@ -7,24 +7,34 @@
 
 package com.facebook.react.views.text
 
+import android.graphics.Bitmap
 import android.graphics.Canvas
 import android.graphics.Color
 import android.os.Build
+import android.text.Layout
 import android.text.StaticLayout
 import android.text.TextPaint
 import android.text.TextUtils
 import androidx.annotation.RequiresApi
+import androidx.core.graphics.createBitmap
 import org.assertj.core.api.Assertions.assertThat
 import org.junit.Test
 import org.junit.runner.RunWith
 import org.mockito.kotlin.any
 import org.mockito.kotlin.eq
 import org.mockito.kotlin.mock
 import org.mockito.kotlin.verify
+import org.mockito.kotlin.verifyNoInteractions
 import org.robolectric.RobolectricTestRunner
+import org.robolectric.annotation.Config
+import org.robolectric.annotation.GraphicsMode
+import org.robolectric.annotation.TextLayoutMode
 
-@RequiresApi(Build.VERSION_CODES.M)
+@RequiresApi(Build.VERSION_CODES.Q)
 @RunWith(RobolectricTestRunner::class)
+@Config(sdk = [Build.VERSION_CODES.UPSIDE_DOWN_CAKE, Build.VERSION_CODES.VANILLA_ICE_CREAM])
+@GraphicsMode(GraphicsMode.Mode.NATIVE)
+@TextLayoutMode(TextLayoutMode.Mode.REALISTIC)
 class TextDecorationStyleTest {
   @Test
   fun fromStringSolid() {
@@ -73,11 +83,9 @@ class TextDecorationStyleTest {
     val baseline = layout.getLineBaseline(0).toFloat()
     val x1 = layout.getPrimaryHorizontal(0)
     val x2 = layout.getPrimaryHorizontal(visibleEnd)
+    val y = baseline + layout.paint.underlineThickness + 1f
     val canvas = mock<Canvas>()
 
-    // The span covers the whole string, well past what survived the ellipsis; pre-fix this
-    // called layout.getPrimaryHorizontal(TAIL_TEXT.length) and crashed with
-    // IndexOutOfBoundsException, since the ellipsized layout only resolves up to visibleEnd.
     drawSpannedDecoration(
         0,
         TAIL_TEXT.length,
@@ -89,31 +97,99 @@ class TextDecorationStyleTest {
       lineBaseline + thickness + 1f
     }
 
-    verify(canvas).drawLine(eq(x1), eq(baseline + 1f), eq(x2), eq(baseline + 1f), any())
+    verify(canvas).drawLine(eq(x1), eq(y), eq(x2), eq(y), any())
   }
 
   @Test
   fun drawSpannedDecorationSkipsSpanEntirelyPastTailEllipsis() {
     val layout = buildTailEllipsizedLayout()
     val visibleEnd = layout.getLineStart(0) + layout.getEllipsisStart(0)
-    val baseline = layout.getLineBaseline(0).toFloat()
-    val x = layout.getPrimaryHorizontal(visibleEnd)
-    val canvas = mock<Canvas>()
 
-    // The whole span (e.g. a nested Text) starts after the ellipsis, fully hidden: it must
-    // collapse to a zero-length line at the visible boundary, not draw anything past it.
-    drawSpannedDecoration(
-        visibleEnd,
-        TAIL_TEXT.length,
-        canvas,
-        layout,
-        Color.BLACK,
-        TextDecorationStyle.SOLID,
-    ) { _, lineBaseline, thickness ->
-      lineBaseline + thickness + 1f
+    for (style in TextDecorationStyle.entries) {
+      val canvas = mock<Canvas>()
+      drawSpannedDecoration(visibleEnd, TAIL_TEXT.length, canvas, layout, Color.BLACK, style) {
+          _,
+          lineBaseline,
+          thickness ->
+        lineBaseline + thickness + 1f
+      }
+      verifyNoInteractions(canvas)
     }
+  }
+
+  @Test
+  fun skipsDecorationsOutsideTruncatedLayout() {
+    val text =
+        "Visible first line\n\nThird paragraph\n\nHidden decorated text: decorated text outside the one-line layout"
+    val layout = buildLayout(text, text.indexOf('\n'))
+    val start = text.indexOf("decorated text outside")
+    assertThat(layout.lineCount).isEqualTo(1)
+    assertThat(layout.text.length).isEqualTo(text.length)
+    assertThat(layout.getLineEnd(0)).isLessThan(start)
+
+    for (style in TextDecorationStyle.entries) {
+      assertThat(drawDecoration(start, text.length, layout, style)).isZero()
+    }
+  }
 
-    verify(canvas).drawLine(eq(x), eq(baseline + 1f), eq(x), eq(baseline + 1f), any())
+  @Test
+  fun clipsDecorationsCrossingTruncatedLayout() {
+    val text = "Visible first line\nHidden decorated text"
+    val layout = buildLayout(text, text.indexOf('\n'))
+    assertThat(layout.getLineEnd(0)).isLessThan(text.length)
+
+    for (style in TextDecorationStyle.entries) {
+      assertThat(drawDecoration(8, text.length, layout, style)).isEqualTo(1)
+    }
+  }
+
+  @Test
+  fun keepsVisibleDecorations() {
+    val layout = buildLayout("Visible first line")
+
+    for (style in TextDecorationStyle.entries) {
+      assertThat(drawDecoration(0, 7, layout, style)).isEqualTo(1)
+    }
+  }
+
+  @Test
+  fun skipsEmptyDecorations() {
+    val layout = buildLayout("Visible first line")
+    assertThat(drawDecoration(0, 0, layout, TextDecorationStyle.SOLID)).isZero()
+  }
+
+  @Test
+  fun skipsZeroLineLayout() {
+    val layout = mock<Layout>()
+    assertThat(drawDecoration(0, 1, layout, TextDecorationStyle.SOLID)).isZero()
+  }
+
+  @Test
+  fun keepsUntruncatedDecorations() {
+    val text = "Visible first line\nHidden decorated text"
+    val layout = buildLayout(text)
+
+    for (style in TextDecorationStyle.entries) {
+      assertThat(drawDecoration(8, text.length, layout, style)).isEqualTo(2)
+    }
+  }
+
+  private fun buildLayout(text: String, end: Int = text.length): StaticLayout =
+      StaticLayout.Builder.obtain(text, 0, end, TextPaint().apply { textSize = 20f }, 400).build()
+
+  private fun drawDecoration(
+      start: Int,
+      end: Int,
+      layout: Layout,
+      style: TextDecorationStyle,
+  ): Int {
+    val canvas = Canvas(createBitmap(400, 200, Bitmap.Config.ARGB_8888))
+    var drawnLines = 0
+    drawSpannedDecoration(start, end, canvas, layout, Color.BLACK, style) { _, baseline, _ ->
+      drawnLines++
+      baseline
+    }
+    return drawnLines
   }
 
   /**