From 132d1d00f885fe5a45d712fd7698db285c22bc4b Mon Sep 17 00:00:00 2001
From: fabriziobertoglio1987 <fabrizio.bertoglio@gmail.com>
Date: Tue, 28 Sep 2021 16:43:46 -0700
Subject: [PATCH] nested text onPress not working on last character (#30928)

Summary:
This issue fixes https://github.com/facebook/react-native/issues/22747 nested text does not allow you to press on the last character.

The method reactTagForTouch filters touches based on coordinates x and y. Nested Texts are converted into Spans on Android
https://github.com/facebook/react-native/blob/28fb41a0ab48cc01d606b64744c84e2ac3805f3f/ReactAndroid/src/main/java/com/facebook/react/views/text/ReactBaseTextShadowNode.java#L111-L112
https://developer.android.com/guide/topics/text/spans

reactTagForTouch iterates over the span and triggers the onPress handler if the x,y coordinates correspond to one of the span characters.

## Changelog

<!-- Help reviewers and the release process by writing your own changelog entry. For an example, see:
https://github.com/facebook/react-native/wiki/Changelog
-->

[Android] [Fixed] - Nested Text Android onPress does not work with last character

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

Test Plan:
This changes fix the Java API which can not be tested as explained in commit https://github.com/facebook/react-native/commit/709a441ecf54cd9465f5946af0454ee7d10d5cbe
The java TextTest was excluded from the test suite in commit https://github.com/facebook/react-native/commit/709a441ecf54cd9465f5946af0454ee7d10d5cbe as they need the Yoga libraries to run

**<details><summary>TEST - Clicking on the last letter triggers the callback</summary>**
<p>

Clicking on the last letter does not invoke the onPress callback (in this case a console.warn)

| **BEFORE** |
|:-------------------------:|
| <img src="https://user-images.githubusercontent.com/24992535/107537789-9060f480-6bc3-11eb-8ad1-1152e466f830.gif" width="700" height="" /> |

Clicking on the last letter does invoke the onPress callback (in this case a console.warn)

| **AFTER** |
|:-------------------------:|
| <img src="https://user-images.githubusercontent.com/24992535/107538263-11b88700-6bc4-11eb-9a48-139e053aa68b.gif" width="700" height="" /> |

</details>
</p>

**<details><summary>TEST - Adding and removing Text</summary>**
<p>

<video src="https://user-images.githubusercontent.com/24992535/107541305-48dc6780-6bc7-11eb-8d57-a8aeb57a6879.mp4" />

</details>
</p>

**<details><summary>TEST - Different type of languages</summary>**
<p>

<video src="https://user-images.githubusercontent.com/24992535/107541683-affa1c00-6bc7-11eb-8630-22c2ba4d0973.mp4" />

</details>
</p>

**<details><summary>TEST - Testing other Examples that use onPress handler</summary>**
<p>

<video src="https://user-images.githubusercontent.com/24992535/107541972-f9e30200-6bc7-11eb-9759-6ff9d52bba15.mp4" />

</details>
</p>

**<details><summary>TEST - Text with Inline Images</summary>**
<p>

| Inline View | Inline Image is clipped |
|:-------------------------:|:-------------------------:|
| <img src="https://user-images.githubusercontent.com/24992535/107542187-357dcc00-6bc8-11eb-9eed-eefbd8be339f.png" width="300" height="" /> | <img src="https://user-images.githubusercontent.com/24992535/107542193-37478f80-6bc8-11eb-8ab3-fa1282dc3fd3.png" width="300" height="" /> |

</details>
</p>

Reviewed By: yungsters

Differential Revision: D31061832

Pulled By: charlesbdudley

fbshipit-source-id: 3034b4f35d4042bfcf1e899a59d5b2f73a990f31
---
 .../main/java/com/facebook/react/views/text/ReactTextView.java  | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ReactAndroid/src/main/java/com/facebook/react/views/text/ReactTextView.java b/ReactAndroid/src/main/java/com/facebook/react/views/text/ReactTextView.java
index 64135eda4f5eca..a6d48f57d17aa2 100644
--- a/ReactAndroid/src/main/java/com/facebook/react/views/text/ReactTextView.java
+++ b/ReactAndroid/src/main/java/com/facebook/react/views/text/ReactTextView.java
@@ -371,7 +371,7 @@ public int reactTagForTouch(float touchX, float touchY) {
         for (int i = 0; i < spans.length; i++) {
           int spanStart = spannedText.getSpanStart(spans[i]);
           int spanEnd = spannedText.getSpanEnd(spans[i]);
-          if (spanEnd > index && (spanEnd - spanStart) <= targetSpanTextLength) {
+          if (spanEnd >= index && (spanEnd - spanStart) <= targetSpanTextLength) {
             target = spans[i].getReactTag();
             targetSpanTextLength = (spanEnd - spanStart);
           }