diff options
Diffstat (limited to 'src/view/com/modals/AltImage.tsx')
-rw-r--r-- | src/view/com/modals/AltImage.tsx | 19 |
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 |