[fix] alt text on Image; role on label

Close #2666 Fix #2665
necolas · May 22, 2024 · 2106944 · 2106944
1 parent 12db5a2
commit 2106944
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 2 deletions.
diff --git a/packages/react-native-web/src/exports/Image/index.js b/packages/react-native-web/src/exports/Image/index.js
@@ -175,7 +175,8 @@ const Image: React.AbstractComponent<
   React.ElementRef<typeof View>
 > = React.forwardRef((props, ref) => {
   const {
-    'aria-label': ariaLabel,
+    'aria-label': _ariaLabel,
+    accessibilityLabel,
     blurRadius,
     defaultSource,
     draggable,
@@ -189,6 +190,7 @@ const Image: React.AbstractComponent<
     style,
     ...rest
   } = props;
+  const ariaLabel = _ariaLabel || accessibilityLabel;
 
   if (process.env.NODE_ENV !== 'production') {
     if (props.children) {

diff --git a/packages/react-native-web/src/modules/AccessibilityUtil/propsToAccessibilityComponent.js b/packages/react-native-web/src/modules/AccessibilityUtil/propsToAccessibilityComponent.js
@@ -36,8 +36,9 @@ const emptyObject = {};
 const propsToAccessibilityComponent = (
   props: Object = emptyObject
 ): void | string => {
+  const roleProp = props.role || props.accessibilityRole;
   // special-case for "label" role which doesn't map to an ARIA role
-  if (props.accessibilityRole === 'label') {
+  if (roleProp === 'label') {
     return 'label';
   }