Selenium Python : pick element from drop down in a span

Question

i am relatively new to Selenium, I am working on a web browser automation project and one of the action is to pick a element from an drop down menu please find below the html code.

<span id="export_menu" class="ui-button drop-down export-menu" tabindex="0" role="application">
<span class="menu_text">Export</span>
<span class="drop-down-menu ui-icon ui-icon-triangle-1-s"></span>
<ul class="export-actions"><li><header>Export Report</header>
    <ul><li class="menu-action"><input type="button" value="CSV" class="button ui-button ui-widget ui-state-default ui-corner-all" id="export_csv" data-format="csv" role="button" aria-disabled="false"></li></ul>
    <ul><li class="menu-action"><input type="button" value="PDF" class="button ui-button ui-widget ui-state-default ui-corner-all" id="export_pdf" data-format="pdf" role="button" aria-disabled="false"></li></ul>
    <ul><li class="menu-action"><input type="button" value="Schedule Export" class="button ui-button ui-widget ui-state-default ui-corner-all" id="schedule" role="button" aria-disabled="false"></li></ul></li></ul>
</ul>
</span>

I tried following on Python, which give out error as below

driver.find_element_by_id("export_menu").click()
driver.find_element_by_id("export_csv").click()

selenium.common.exceptions.ElementNotInteractableException: Message: Element could not be scrolled into view

after some research I also tried following, which simply timeouts

WebDriverWait(driver,10).until(EC.element_to_be_clickable((By.XPATH, '//*[@id="export_csv"]'))).click()

requesting help!

Answer 1

To pick the element with value as CSV from an drop-down-menu you have to induce WebDriverWait for the element_to_be_clickable() and you can use either of the following solutions:

• Using CSS_SELECTOR :

   WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "span.ui-button.drop-down.export-menu#export_menu"))).click() WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "ul.export-actions li.menu-action > input.button.ui-button.ui-widget.ui-state-default.ui-corner-all#export_csv"))).click()

• Using XPATH :

   WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//span[@class='ui-button drop-down export-menu' and @id='export_menu']"))).click() WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//ul[@class='export-actions']//li[@class='menu-action']/input[@class='button ui-button ui-widget ui-state-default ui-corner-all' and @id='export_csv']"))).click()

• Note : You have to add the following imports:

   from selenium.webdriver.support.ui import WebDriverWait from selenium.webdriver.common.by import By from selenium.webdriver.support import expected_conditions as EC

You can find a relevant discussion in How to select an option from a dropdown of non select tag?

Answer 2

Try first clicking the <ul> :

WebDriverWait(driver,10).until(EC.element_to_be_clickable((By.XPATH, '//*[@class="export-actions"]'))).click()

WebDriverWait(driver,10).until(EC.element_to_be_clickable((By.XPATH, '//*[@id="export_csv"]'))).click()