Reputation: 61
I'am using react-native-element-dropdown this library for Dropdown in React Native like below.
<Dropdown
style={[contactStyle.dropdown, isFocus && { borderColor: '#06AFE4' }]}
{...getAppiumId(DeviceInfo.getBundleId() + `:id/AddVendorDropDown`)}
containerStyle={{ backgroundColor: 'white' }}
placeholderStyle={contactStyle.placeholderStyle}
selectedTextStyle={contactStyle.selectedTextStyle}
itemTextStyle={contactStyle.selectedTextStyle}
data={props.companyTypeMobileAppList || []}
maxHeight={300}
labelField="CompanyType"
valueField="CompanyTypeId"
placeholder={!isFocus ? 'Supplier Type' : '...'}
value={vendorType}
onFocus={() => setIsFocus(true)}
onBlur={() => setIsFocus(false)}
onChange={(item) => {
setVendorType(item.CompanyTypeId);
setVendorTypeName(item.CompanyType)
setIsFocus(false);
}}
renderItem={renderItem}
dropdownTextStyle={{ color: 'red' }}
/>
const renderItem = (item) => (
<View style={contactStyle.item} {...getAppiumId(DeviceInfo.getBundleId() + ':id/DDLableView' + item.CompanyType?.replace(/\s/g, ''))}>
<Text style={contactStyle.itemText} {...getAppiumId(DeviceInfo.getBundleId() + ':id/DDLable' + item.CompanyType?.replace(/\s/g, ''))}>{item.CompanyType}</Text>
</View>
);`enter code here`
Below code is for getAppiumID():
export const getAppiumId = (id) => {
const modifiedId = id.replace(/^.*(?=:id\/)/, "com.example.student");
if (shouldPassAppiumId()) {
if (Platform.OS === 'ios') {
return {
testID: modifiedId, // Use modified ID for testing
accessible: false,
};
} else {
return {
accessible: true, // Set accessible to true in development
testID: modifiedId, // Use modified ID for testing
accessibilityLabel: modifiedId,
};
}
}
return {}; // In production, return an empty object
};
We are unable to get element id or xpath for dropdown items in iOS build in ReactNative project. But the same code worked for Android build. While inspecting in Appium Inspector it gives element id of another view behind the dropdown component instead of dropdown item.
We are trying to get element id for Proprietorship as shown in above image.
Upvotes: 0
Views: 26