testing Picker with Detox in React Native

Question

I just started using Detox to test my react native app and I'm having some trouble to test Pickers. I basically need to be able to choose a value from a Picker! But it seems impossible!!

Here is my Picker:

<Picker
        style={styles.picker}
        itemStyle={styles.pickerItem}
        testID="picker"
        selectedValue={selectedValue}
        onValueChange={this.updateValue}
      >
        <Picker.Item key={0} label="Choose one" value={null} />

        {values.map(value => {
          return (
            <Picker.Item
              key={value}
              label={value}
              value={value}
              testID={value}
            />
          );
        })}
 </Picker>

And here is my test:

await element(by.type("UIPickerView")).setColumnToValue(0, "Apple");

But all I get is an error message saying it was not possible to set the value because it doesn't exist, but it does! Cause I'm looking at it right now!

Does anyone knows the right way to set a value in a Picker?

Any help would be great!

Did you find out how to do this? – Brian Mitchell Mar 06 '20 at 14:51 — Brian Mitchell, Mar 06 '20 at 14:51

score 0 · Answer 1 · answered Jul 11 '23 at 08:39

Please try below function which worked with react-native-picker-select

const selectPicker = async (text, index = 0, column = 0) => {
  if (device.getPlatform() === 'ios') {
    await element(by.id('ios_touchable_wrapper')).atIndex(index).tap();
    await element(by.id('ios_picker')).setColumnToValue(column, text);
    await element(by.id('done_button')).tap();
  } else {
    await element(by.id('android_picker_headless')).atIndex(index).tap();
    await element(by.text(text)).tap();
  }
};

note: it will work even if multiple pickers are there in same screen by just passing the order of picker as index value

testing Picker with Detox in React Native

1 Answers1