Fix accessibility when entire text node is a link

Summary:
Changelog: [internal]

Fix accessibility when entire text node is a link

Reviewed By: JoshuaGross

Differential Revision: D28325749

fbshipit-source-id: 9ac68b802f13d028b5cdb6cae7bdae5f4924fc07

React/Fabric/Mounting/ComponentViews/Text/RCTParagraphComponentAccessibilityProvider.mm

@@ -57,15 +57,15 @@ using namespace facebook::react;
   // build an array of the accessibleElements
   NSMutableArray<UIAccessibilityElement *> *elements = [NSMutableArray new];
 
-  NSString *accessibilityLabel = [_view valueForKey:@"accessibilityLabel"];
-  if (!accessibilityLabel.length) {
+  NSString *accessibilityLabel = _view.accessibilityLabel;
+  if (accessibilityLabel.length == 0) {
     accessibilityLabel = RCTNSStringFromString(_attributedString.getString());
   }
   // add first element has the text for the whole textview in order to read out the whole text
   RCTAccessibilityElement *firstElement =
       [[RCTAccessibilityElement alloc] initWithAccessibilityContainer:_view.superview];
   firstElement.isAccessibilityElement = YES;
-  firstElement.accessibilityTraits = UIAccessibilityTraitStaticText;
+  firstElement.accessibilityTraits = _view.accessibilityTraits;
   firstElement.accessibilityLabel = accessibilityLabel;
   firstElement.accessibilityFrame = UIAccessibilityConvertFrameToScreenCoordinates(_view.bounds, _view);
   [firstElement setAccessibilityActivationPoint:CGPointMake(
@@ -80,7 +80,11 @@ using namespace facebook::react;
                            enumerateAttribute:RCTTextAttributesAccessibilityRoleAttributeName
                                         frame:_frame
                                    usingBlock:^(CGRect fragmentRect, NSString *_Nonnull fragmentText, NSString *value) {
-                                     if (![value isEqualToString:@"button"] && ![value isEqualToString:@"link"]) {
+                                     if ([fragmentText isEqualToString:firstElement.accessibilityLabel]) {
+                                       // The fragment is the entire paragraph. This is handled as `firstElement`.
+                                       return;
+                                     }
+                                     if ((![value isEqualToString:@"button"] && ![value isEqualToString:@"link"])) {
                                        return;
                                      }
                                      if ([value isEqualToString:@"button"] &&

React/Tests/Text/RCTParagraphComponentViewTests.mm

@@ -404,4 +404,67 @@ static ParagraphShadowNode::ConcreteState::Shared stateWithShadowNode(
       @"Expected the second accessibilityElement has link trait");
 }
 
+- (void)testEntireParagraphLink
+{
+  std::shared_ptr<RootShadowNode> rootShadowNode;
+  std::shared_ptr<ParagraphShadowNode> paragrahShadowNode;
+
+  auto element = Element<RootShadowNode>()
+                     .reference(rootShadowNode)
+                     .tag(1)
+                     .props([] {
+                       auto sharedProps = std::make_shared<RootProps>();
+                       auto &props = *sharedProps;
+                       props.layoutConstraints = LayoutConstraints{{0, 0}, {500, 500}};
+                       auto &yogaStyle = props.yogaStyle;
+                       yogaStyle.dimensions()[YGDimensionWidth] = YGValue{200, YGUnitPoint};
+                       yogaStyle.dimensions()[YGDimensionHeight] = YGValue{200, YGUnitPoint};
+                       return sharedProps;
+                     })
+                     .children({
+                         Element<ParagraphShadowNode>()
+                             .reference(paragrahShadowNode)
+                             .props([] {
+                               auto sharedProps = std::make_shared<ParagraphProps>();
+                               auto &props = *sharedProps;
+                               props.accessible = true;
+                               props.accessibilityTraits = AccessibilityTraits::Link;
+                               auto &yogaStyle = props.yogaStyle;
+                               yogaStyle.positionType() = YGPositionTypeAbsolute;
+                               yogaStyle.position()[YGEdgeLeft] = YGValue{0, YGUnitPoint};
+                               yogaStyle.position()[YGEdgeTop] = YGValue{0, YGUnitPoint};
+                               yogaStyle.dimensions()[YGDimensionWidth] = YGValue{200, YGUnitPoint};
+                               yogaStyle.dimensions()[YGDimensionHeight] = YGValue{20, YGUnitPoint};
+                               return sharedProps;
+                             })
+                             .children({
+                                 Element<TextShadowNode>()
+                                     .props([] {
+                                       auto sharedProps = std::make_shared<TextProps>();
+                                       auto &props = *sharedProps;
+                                       props.textAttributes.accessibilityRole = AccessibilityRole::Link;
+                                       return sharedProps;
+                                     })
+                                     .children({Element<RawTextShadowNode>().reference(RawTextShadowNodeABA_).props([] {
+                                       auto sharedProps = std::make_shared<RawTextProps>();
+                                       auto &props = *sharedProps;
+                                       props.text = "A long text that happens to be a link";
+                                       return sharedProps;
+                                     })}),
+                             }),
+                     });
+
+  builder_->build(element);
+  rootShadowNode->layoutIfNeeded();
+
+  ParagraphShadowNode::ConcreteState::Shared _state = stateWithShadowNode(paragrahShadowNode);
+  RCTParagraphComponentView *paragraphComponentView = [[RCTParagraphComponentView alloc] init];
+  [paragraphComponentView updateProps:paragrahShadowNode->getProps() oldProps:nullptr];
+  [paragraphComponentView updateState:_state oldState:nil];
+
+  NSArray<UIAccessibilityElement *> *elements = paragraphComponentView.accessibilityElements;
+  XCTAssertEqual(elements.count, 1);
+  XCTAssertTrue(elements[0].accessibilityTraits & UIAccessibilityTraitLink);
+}
+
 @end