diff --git a/ios/RNCSegmentedControl.h b/ios/RNCSegmentedControl.h index af81a54..5516e94 100644 --- a/ios/RNCSegmentedControl.h +++ b/ios/RNCSegmentedControl.h @@ -11,5 +11,6 @@ @interface RNCSegmentedControl : UISegmentedControl @property(nonatomic, assign) NSInteger selectedIndex; @property(nonatomic, copy) RCTBubblingEventBlock onChange; +@property(nonatomic, copy) NSArray *testIDS; @end diff --git a/ios/RNCSegmentedControl.m b/ios/RNCSegmentedControl.m index 11368cf..4a1bfea 100644 --- a/ios/RNCSegmentedControl.m +++ b/ios/RNCSegmentedControl.m @@ -88,4 +88,17 @@ - (void)setAppearance:(NSString *)appearanceString { #endif } +- (NSArray *)accessibilityElements { + NSArray *elements = [super accessibilityElements]; + [elements enumerateObjectsUsingBlock:^(UIView *obj, NSUInteger idx, BOOL *stop) { + @try { + obj.accessibilityIdentifier = self.testIDS[idx]; + } @catch (NSException *exception) { + NSLog(@"%@", exception); + } + }]; + + return elements; +} + @end diff --git a/ios/RNCSegmentedControlManager.m b/ios/RNCSegmentedControlManager.m index 6a27795..553bc1f 100644 --- a/ios/RNCSegmentedControlManager.m +++ b/ios/RNCSegmentedControlManager.m @@ -27,6 +27,7 @@ - (UIView *)view { RCT_EXPORT_VIEW_PROPERTY(enabled, BOOL) RCT_EXPORT_VIEW_PROPERTY(onChange, RCTBubblingEventBlock) RCT_EXPORT_VIEW_PROPERTY(appearance, NSString) +RCT_EXPORT_VIEW_PROPERTY(testIDS, NSArray) RCT_CUSTOM_VIEW_PROPERTY(fontStyle, NSObject, RNCSegmentedControl) { #if defined(__IPHONE_OS_VERSION_MAX_ALLOWED) && defined(__IPHONE_13_0) && \ diff --git a/js/SegmentedControl.js b/js/SegmentedControl.js index 99bdc2e..c9f3faf 100644 --- a/js/SegmentedControl.js +++ b/js/SegmentedControl.js @@ -37,6 +37,7 @@ const SegmentedControl = ({ activeFontStyle, appearance, accessibilityHintSeperator = 'out of', + testIDS, }: SegmentedControlProps): React.Node => { const colorSchemeHook = useColorScheme(); const colorScheme = appearance || colorSchemeHook; @@ -113,6 +114,7 @@ const SegmentedControl = ({ return ( index ? testIDS[index] : `${index}`} selected={selectedIndex === index} accessibilityHint={`${ index + 1 diff --git a/js/SegmentedControlTab.js b/js/SegmentedControlTab.js index fcf4971..db2ca25 100644 --- a/js/SegmentedControlTab.js +++ b/js/SegmentedControlTab.js @@ -94,8 +94,9 @@ export const SegmentedControlTab = ({ onPress={onSelect} accessibilityHint={accessibilityHint} accessibilityRole="button" - accessibilityState={{selected: selected, disabled: !enabled}}> - + accessibilityState={{selected: selected, disabled: !enabled}} + testID={testID}> + {typeof value === 'number' || typeof value === 'object' ? ( ) : isBase64(value) ? ( diff --git a/js/types.js b/js/types.js index 3eb54fc..34cecd6 100644 --- a/js/types.js +++ b/js/types.js @@ -107,4 +107,10 @@ export type SegmentedControlProps = $ReadOnly<{| * Touchable style properties for Segmented Control Tab */ tabStyle?: ViewStyle, + + + /** + * array testID to each segment button + */ + testIDS: $ReadOnlyArray, |}>;