fix: anchors are now not accessible when href is empty or absent

Author: jsamr

packages/render-html/package.json

@@ -89,7 +89,7 @@
   "dependencies": {
     "@jsamr/counter-style": "^2.0.1",
     "@jsamr/react-native-li": "^2.3.0",
-    "@native-html/transient-render-engine": "10.0.0",
+    "@native-html/transient-render-engine": "10.0.2",
     "@types/ramda": "^0.27.40",
     "@types/urijs": "^1.19.15",
     "prop-types": "^15.5.7",

packages/render-html/src/__tests__/component.render-html.test.tsx

@@ -141,6 +141,32 @@ describe('RenderHTML', () => {
       act(() => anchor.props.onPress?.({}));
       expect(onPress).toHaveBeenCalled();
     });
+    it('should add accessibility features to anchors when href is non-empty', () => {
+      const { getByTestId } = render(
+        <RenderHTML
+          source={{
+            html: `<a href="https://domain.com">test</a>`
+          }}
+          debug={false}
+          contentWidth={0}
+        />
+      );
+      expect(getByTestId('a').props.accessibilityRole).toBe('link');
+      expect(getByTestId('a').props.accessible).toBe(true);
+    });
+    it('should not add accessibility features to anchors when href is empty', () => {
+      const { getByTestId } = render(
+        <RenderHTML
+          source={{
+            html: `<a href="">test</a>`
+          }}
+          debug={false}
+          contentWidth={0}
+        />
+      );
+      expect(getByTestId('a').props.accessibilityRole).not.toBeDefined();
+      expect(getByTestId('a').props.accessible).not.toBeDefined();
+    });
     it("should add accessibility role 'header' to headings", () => {
       for (const header of ['h1', 'h2', 'h3', 'h4', 'h5', 'h6']) {
         const { getByTestId } = render(

packages/render-html/src/elements/AElement.tsx

@@ -2,8 +2,7 @@ import React from 'react';
 import { InternalMixedRenderer } from '../render/render-types';
 import { TNode, DocumentContext } from '@native-html/transient-render-engine';
 import { InternalRendererProps, RenderersProps } from '../shared-types';
-import { AccessibilityProps, GestureResponderEvent } from 'react-native';
-import AElement from '../elements/AElement';
+import { GestureResponderEvent } from 'react-native';
 import useNormalizedUrl from '../hooks/useNormalizedUrl';
 import { useDocumentMetadata } from '../context/DocumentMetadataProvider';
 import { useRendererProps } from '../context/RenderersPropsProvider';
@@ -40,20 +39,14 @@ export function useAElementProps<T extends TNode>(
   if (typeof syntheticAnchorOnLinkPress !== 'function') {
     return props;
   }
-  const accessibilityProps: AccessibilityProps = {
-    accessible: true,
-    accessibilityRole: 'link'
-  };
   return {
     ...props,
-    onPress: syntheticAnchorOnLinkPress,
-    textProps: accessibilityProps,
-    viewProps: accessibilityProps
+    onPress: syntheticAnchorOnLinkPress
   };
 }
 
 const ARenderer: InternalMixedRenderer = (props) => {
-  return React.createElement(AElement, useAElementProps(props));
+  return React.createElement(props.TDefaultRenderer, useAElementProps(props));
 };
 
 export default ARenderer;

packages/render-html/src/renderers/ARenderer.tsx

@@ -4380,9 +4380,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@native-html/transient-render-engine@npm:10.0.0":
-  version: 10.0.0
-  resolution: "@native-html/transient-render-engine@npm:10.0.0"
+"@native-html/transient-render-engine@npm:10.0.2":
+  version: 10.0.2
+  resolution: "@native-html/transient-render-engine@npm:10.0.2"
   dependencies:
     "@native-html/css-processor": 1.10.2
     "@types/ramda": ^0.27.44
@@ -4394,7 +4394,7 @@ __metadata:
   peerDependencies:
     "@types/react-native": "*"
     react-native: ^*
-  checksum: 5830444fd08f6db40226fddc583b743452e9386538059fda32e2e20f7bf76b2972c837a12bce82353622f41a2dfd5665ab61071abbf6260c499b4603e79d7777
+  checksum: 3d5854625d30ed5b1c451c093ea6130cfd925e8f12d77d5c896895c7d236a4c322a3e9080eb02e5bd104e7e03123837f20a76b7fbe1f309eb3b5d5947f8b5150
   languageName: node
   linkType: hard
 
@@ -19965,7 +19965,7 @@ fsevents@^1.2.7:
     "@jsamr/counter-style": ^2.0.1
     "@jsamr/react-native-li": ^2.3.0
     "@microsoft/api-extractor": ^7.14.0
-    "@native-html/transient-render-engine": 10.0.0
+    "@native-html/transient-render-engine": 10.0.2
     "@release-it/conventional-changelog": ^2.0.1
     "@testing-library/react-hooks": ^7.0.0
     "@testing-library/react-native": ^7.2.0