How do I click on a drop down menu that is hidden using Selenium?

Question

I'm trying to click on a drop down menu, but since it is hidden, I'm getting the error:

could not be scrolled into view

I've done some digging and I see that using some JavaScript could help, but I'm not sure how to implement that into my Python script.

<div class="MuiSelect-root MuiSelect-select MuiSelect-selectMenu MuiSelect-outlined MuiInputBase-input MuiOutlinedInput-input jss987" tabindex="0" role="button" aria-haspopup="listbox" aria-labelledby="input-label-idTeam1Desktop select-idTeam1Desktop" id="select-idTeam1Desktop"><span>​</span></div>
<input name="idTeam1Desktop" type="hidden" id="idTeam1Desktop" value="">

This is what I have so far:

driver = webdriver.Firefox(profile, options=options)
driver.get("https://tradenba.com/trade-machine")
element = driver.find_element_by_xpath("//*[@id='idTeam1Desktop']")
element.click()

Answer 1

To click on the drop down menu and select the menu item with text as MIL you need to induce WebDriverWait for the element_to_be_clickable() and you can use the following xpath based Locator Strategies:

• Using XPATH:

  driver.get('https://tradenba.com/trade-machine')
  WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//div[@id='select-idTeam1Desktop']"))).click()
  WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//div[@class='MuiListItemText-root MuiListItemText-inset']/span/div/p[text()='MIL']"))).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
  

• Browser Snapshot: