david yeritsyan
david yeritsyan

Reputation: 452

How do I select items from a drop down box in selenium using python

I'm attempting to iterate through a dropdown list for webscraping and I've noticed that my code isn't working out

dropdown = browser.find_element_by_XPATH('//*[@id="department-dropdown"]')
select = Select(dropdown)

select.select_by_value("Accounting")

ERROR MESSAGE I RECIEVE

Traceback (most recent call last):
  File "C:\Users\David\eclipse-workspace\Web_Scrap\setup.py", line 31, in <module>
    dropdown = browser.find_element_by_XPATH('//*[@id="mainContent"]/div[1]/div/div[3]/div/div/span')
AttributeError: 'WebDriver' object has no attribute 'find_element_by_XPATH'

For now I was attempting to select atleast the first value, but it just isn't working out

The picture provided has the "inspect element" of the dropdown box i'm attempting to cycle through

This seems a bit confusing that the dropdown box element isn't a part of the actual list, can someone give me an idea of what is actually going on here? and if I'm looking at this incorrectly.

And if anyone has any recommendations on what I can do to achieve my goal

Upvotes: 0

Views: 3573

Answers (1)

yong
yong

Reputation: 13712

Your drop down box is a css drop down, not a native drop down which implement purely by <select> and <option> tag.

the options of the drop down comes from li inside the <ul class="typeahead typeahead-long dropdown-menu", and they are attached to the page only after you click the down arrow at right side.

enter image description here

The reason there is a <select> with many <option> is the above li's attribute: data-value created upon these <option>. You can think of these <option> are the data source for li. So the <select> not visible on page, act like a data base behind frontend to supply data, thus the <select> style set to display: none which means not visible on page.

To act as a user behavior, you should find and select option from li inside ul after click it to expand all li. Rather than select option from invisible <select> or change select display css value to make it visible then select option from it.

// click down arrow to expand all options
driver.find_element_by_css_selector(
    ".department-combobox .input-group > span").click();

// search all options
options = driver.find_elements_by_css_selector(
    ".department-combobox .input-group > ul > li")

// print all option text
for(opt in options):
    println opt.text

// select specific option by text
target = 'Anthropology'
driver.find_element_by_css_selector(
    ".department-combobox .input-group > ul")
    .find_element_by_xpath("./li[.="+target+"]")
    .click();

Upvotes: 5

Related Questions