about summary refs log tree commit diff
path: root/src/view/com/modals/AltImage.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/view/com/modals/AltImage.tsx')
-rw-r--r--src/view/com/modals/AltImage.tsx19
1 files changed, 16 insertions, 3 deletions
diff --git a/src/view/com/modals/AltImage.tsx b/src/view/com/modals/AltImage.tsx
index 639303c98..ba05a7d62 100644
--- a/src/view/com/modals/AltImage.tsx
+++ b/src/view/com/modals/AltImage.tsx
@@ -37,7 +37,8 @@ export function Component({prevAltText, onAltTextSet}: Props) {
   return (
     <View
       testID="altTextImageModal"
-      style={[pal.view, styles.container, s.flex1]}>
+      style={[pal.view, styles.container, s.flex1]}
+      nativeID="imageAltText">
       <Text style={[styles.title, pal.text]}>Add alt text</Text>
       <TextInput
         testID="altTextImageInput"
@@ -46,9 +47,17 @@ export function Component({prevAltText, onAltTextSet}: Props) {
         multiline
         value={altText}
         onChangeText={text => setAltText(enforceLen(text, MAX_ALT_TEXT))}
+        accessibilityLabel="Image alt text"
+        accessibilityHint="Sets image alt text for screenreaders"
+        accessibilityLabelledBy="imageAltText"
       />
       <View style={styles.buttonControls}>
-        <TouchableOpacity testID="altTextImageSaveBtn" onPress={onPressSave}>
+        <TouchableOpacity
+          testID="altTextImageSaveBtn"
+          onPress={onPressSave}
+          accessibilityLabel="Save alt text"
+          accessibilityHint={`Saves alt text, which reads: ${altText}`}
+          accessibilityRole="button">
           <LinearGradient
             colors={[gradients.blueLight.start, gradients.blueLight.end]}
             start={{x: 0, y: 0}}
@@ -61,7 +70,11 @@ export function Component({prevAltText, onAltTextSet}: Props) {
         </TouchableOpacity>
         <TouchableOpacity
           testID="altTextImageCancelBtn"
-          onPress={onPressCancel}>
+          onPress={onPressCancel}
+          accessibilityRole="button"
+          accessibilityLabel="Cancel add image alt text"
+          accessibilityHint="Exits adding alt text to image"
+          onAccessibilityEscape={onPressCancel}>
           <View style={[styles.button]}>
             <Text type="button-lg" style={[pal.textLight]}>
               Cancel