[RNMobile] Improve text read by screen readers for BottomSheetSelectC…

…ontrol (#41036) Improves the text that's read by screen readers by the BottomSheetSelectControl component, adding extra context and making its purpose clearer.
WordPress · May 13, 2022 · b83ce72 · b83ce72
1 parent 239a7ce
commit b83ce72
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 2 deletions.
diff --git a/packages/components/src/mobile/bottom-sheet-select-control/index.native.js b/packages/components/src/mobile/bottom-sheet-select-control/index.native.js
@@ -57,11 +57,16 @@ const BottomSheetSelectControl = ( {
 					value={ selectedOption.label }
 					onPress={ openSubSheet }
 					accessibilityRole={ 'button' }
-					accessibilityLabel={ selectedOption.label }
+					accessibilityLabel={ sprintf(
+						// translators:  %1$s: Select control button label e.g. "Button width". %2$s: Select control option value e.g: "Auto, 25%".
+						__( '%1$s. Currently selected: %2$s' ),
+						label,
+						selectedOption.label
+					) }
 					accessibilityHint={ sprintf(
 						// translators: %s: Select control button label e.g. "Button width"
 						__( 'Navigates to select %s' ),
-						selectedOption.label
+						label
 					) }
 				>
 					<Icon icon={ chevronRight }></Icon>

diff --git a/packages/react-native-editor/CHANGELOG.md b/packages/react-native-editor/CHANGELOG.md
@@ -11,6 +11,7 @@ For each user feature we should also add a importance categorization label  to i
 
 ## Unreleased
 
+-   [*] [a11y] Improve text read by screen readers for BottomSheetSelectControl [#41036]
 
 ## 1.76.0