Merge pull request #37 from discord/dhleong/ellipsized-a11y-nodes-local-fork

Fix: a11y crash when an accessible link is ellipsized away

Author: Flewp

ReactAndroid/src/main/java/com/facebook/react/uimanager/ReactAccessibilityDelegate.java

@@ -571,9 +571,18 @@ protected void onPopulateNodeForVirtualView(
       return;
     }
 
+    // NOTE: The span may not actually have visible bounds within its parent,
+    // due to line limits, etc.
+    final Rect bounds = getBoundsInParent(accessibleTextSpan);
+    if (bounds == null) {
+      node.setContentDescription("");
+      node.setBoundsInParent(new Rect(0, 0, 1, 1));
+      return;
+    }
+
     node.setContentDescription(accessibleTextSpan.description);
     node.addAction(AccessibilityNodeInfoCompat.ACTION_CLICK);
-    node.setBoundsInParent(getBoundsInParent(accessibleTextSpan));
+    node.setBoundsInParent(bounds);
     node.setRoleDescription(mView.getResources().getString(R.string.link_description));
     node.setClassName(AccessibilityRole.getValue(AccessibilityRole.BUTTON));
   }
@@ -590,10 +599,19 @@ private Rect getBoundsInParent(AccessibilityLinks.AccessibleLink accessibleLink)
       return new Rect(0, 0, textView.getWidth(), textView.getHeight());
     }
 
-    Rect rootRect = new Rect();
-
     double startOffset = accessibleLink.start;
     double endOffset = accessibleLink.end;
+
+    // Ensure the link hasn't been ellipsized away; in such cases,
+    // getPrimaryHorizontal will crash (and the link isn't rendered anyway).
+    int startOffsetLineNumber = textViewLayout.getLineForOffset((int) startOffset);
+    int lineEndOffset = textViewLayout.getLineEnd(startOffsetLineNumber);
+    if (startOffset > lineEndOffset) {
+      return null;
+    }
+
+    Rect rootRect = new Rect();
+
     double startXCoordinates = textViewLayout.getPrimaryHorizontal((int) startOffset);
 
     final Paint paint = new Paint();
@@ -603,7 +621,6 @@ private Rect getBoundsInParent(AccessibilityLinks.AccessibleLink accessibleLink)
     paint.setTextSize(textSize);
     int textWidth = (int) Math.ceil(paint.measureText(accessibleLink.description));
 
-    int startOffsetLineNumber = textViewLayout.getLineForOffset((int) startOffset);
     int endOffsetLineNumber = textViewLayout.getLineForOffset((int) endOffset);
     boolean isMultiline = startOffsetLineNumber != endOffsetLineNumber;
     textViewLayout.getLineBounds(startOffsetLineNumber, rootRect);

packages/rn-tester/js/examples/Accessibility/AccessibilityAndroidExample.android.js

@@ -65,6 +65,20 @@ class AccessibilityAndroidExample extends React.Component<
   render(): React.Node {
     return (
       <RNTesterPage title={'Accessibility Android APIs'}>
+        <RNTesterBlock title="Ellipsized Accessible Links">
+          <Text numberOfLines={3}>
+            <Text>
+              Bacon {this.state.count} Ipsum{'\n'}
+            </Text>
+            <Text>Dolor sit amet{'\n'}</Text>
+            <Text>Eggsecetur{'\n'}</Text>
+            <Text>{'\n'}</Text>
+            <Text accessibilityRole="link" onPress={this._addOne}>
+              http://github.com
+            </Text>
+          </Text>
+        </RNTesterBlock>
+
         <RNTesterBlock title="LiveRegion">
           <TouchableWithoutFeedback onPress={this._addOne}>
             <View style={styles.embedded}>