CODEWITHSUNDEEP
rubywatirwatir-classic
Gopal
Gopal

Reputation: 306

New kind of Select_list found and don't know how to write the code for that

I have written code for select list this way b.select_list(:id,'something').select 'something' but I don't how know how to write a code for given below select list, Can anyone help me to write the code to select from this select_list

<md-select tabindex="0" class="ng-pristine ng-untouched ng-empty ng-invalid ng-invalid-required" role="listbox" aria-disabled="false" aria-expanded="false" aria-invalid="true" aria-multiselectable="false" aria-required="true" aria-owns="select_container_5" aria-label="Gender" ng-model="user.gender" name="gender" required=""><md-select-value class="_md-select-value _md-select-placeholder" id="select_value_label_0"><span>Gender</span><span class="_md-select-icon" aria-hidden="true"></span></md-select-value><div class="_md-select-menu-container" id="select_container_5" aria-hidden="true"><md-select-menu class="ng-scope"><md-content>
                            <md-option tabindex="0" class="md-ink-ripple" id="select_option_3" role="option" aria-selected="false" value="Male"><div class="_md-text">Male</div></md-option>
                            <md-option tabindex="0" class="md-ink-ripple" id="select_option_4" role="option" aria-selected="false" value="Female"><div class="_md-text">Female</div></md-option>
                            </md-content></md-select-menu></div></md-select>

Upvotes: 1

Views: 219

Answers (1)

Justin Ko
Justin Ko

Reputation: 46836

Based on the element tag, md-select, it looks like this select list is created by Angular Material. It is not a select element, which means you cannot use the usual select_list method. Instead, you need to manually interact with it. This involves:

  1. Clicking the select list to open the list of options
  2. Clicking one of the options

The following code will select an option by value. You could use a different locator as needed:

# Open the dropdown
browser.element(tag_name: 'md-select', name: 'gender').click

# Select an option (by value)
browser.element(tag_name: 'md-option', value: 'Female').when_present.click

A couple of notes:

  • As md-select is not a standard element, you need to locate it using the generic element method.
  • Make sure to use when_present (or another wait method) to ensure the options are displayed before selecting.

Upvotes: 3

Related Questions