How to click on drop down menu in Python using Selenium and Chrome

Question

The drop down menu only appears when you hover the mouse over.

I tried a lot of solutions online with no luck:

Most of them assume that the tag name is "option", while for me the HTML is a little bit different. The HTML is below, and top level memu is m1. I'm looking to click on the dropdown menu m1_m7.

<li class="item first"></li>
<li class="item" style="z-index: 0;">
    <a id="m1" class="link " href="www.example.com"></a>
    <div class="slide" style="z-index: 11; display: none; overflow: hidden; height: 184px; width: 151px; top: 26px; left: 0px;">
    <ul class="vertical group level1" style="z-index: 11; display: block; top: -184px;">
    <li class="item first" style="z-index: 0;"></li>
    <li id="m1_m1" class="item separator " style="width: 151px;"></li>
    <li class="item" style="z-index: 0;"></li>
    <li id="m1_m3" class="item separator " style="width: 151px;"></li>
    <li class="item" style="z-index: 0;"></li>
    <li id="m1_m5" class="item separator " style="width: 151px;"></li>
    <li class="item" style="z-index: 0;"></li>
    <li id="m1_m7" class="item separator " style="width: 151px;"></li>
        <li style="z-index: 0;" class="item"><a style="width: 151px;" href="www.example.com/sub8" id="m1_m8" class="link "><span class="text expandLeft">Benefits</span></a><div style="z-index: 42; display: none; overflow: hidden; height: 105px; width: 206px; top: 0px; left: 151px;" class="slide">
                    <ul style="z-index: 42; display: block; left: -206px;" class="vertical group level2">
                        <li class="item first"><a style="width: 206px;" href="www.example.com/sub8_0" id="m1_m8_m0" class="link "><span class="text">Patient Safety - Joint Commission</span></a></li><li style="width: 206px;" id="m1_m8_m1" class="item separator "><span class="text"></span></li><li class="item"><a style="width: 206px;" href="www.example.com/sub8_1" id="dnn_INGENIMENU1__ctl0_m1_m8_m2" class="link "><span class="text">Perioperative Efficiency</span></a></li><li style="width: 206px;" id="dnn_INGENIMENU1__ctl0_m1_m8_m3" class="item separator "><span class="text"></span></li><li class="item"><a style="width: 206px;" href="www.example.com/sub8_3" id="m1_m8_m4" class="link "><span class="text">SCIP Compliance</span></a></li><li style="width: 206px;" id="m1_m8_m5" class="item separator "><span class="text"></span></li><li class="item last"><a style="width: 206px;" href="www.example.com/sub8_5/" id="m1_m8_m6" class="link "><span class="text">Time Out Electronic Checklists</span></a></li>
                    </ul>
                </div></li>
            <li id="m1_m9" class="item separator " style="width: 151px;"></li>
    <li class="item" style="z-index: 0;"></li>
    <li id="m1_m11" class="item separator " style="width: 151px;"></li>
    <li class="item last"></li>

Any suggestions are welcome are appreaciated.

alecxe · Accepted Answer · 2015-04-08 19:18:12Z

3

Looks like that the li with id="m1_m5" is a separator between list items and you probably need the next li element after it, you can get it using xpath and following-sibling:

# open up the dropdown
dropdown = driver.find_element_by_css_selector("ul.level1")
dropdown.click()

# select element
item = dropdown.find_element_by_xpath("//li[@id='m1_m5']/following-sibling::li")
item.click()

Update (hovering the menu, click on submenu at livedata):

from selenium import webdriver
from selenium.webdriver import ActionChains

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


driver = webdriver.Firefox()
driver.get("http://www.livedata.com/")

wait = WebDriverWait(driver, 10)

healthcare = wait.until(EC.visibility_of_element_located((By.XPATH, "//li[@class='item' and a/span='Healthcare']")))
ActionChains(driver).move_to_element(healthcare).perform()

benefits = wait.until(EC.visibility_of_element_located((By.XPATH, "//li[@class='item']/a[span='Benefits']")))
ActionChains(driver).move_to_element(benefits).click().perform()

edited Apr 8, 2015 at 19:18

answered Apr 8, 2015 at 18:42

alecxe

476k127 gold badges1.1k silver badges1.2k bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Kennard Over a year ago

Thanks a lot for prompt reply. Perhaps I didn't made myself very clear. I would like to hover mouse over to see the drop down menu and then click the one I wanted, not click on the top level menu.

alecxe Over a year ago

@Julia is it a public site and is there any chance I can see it and try reproducing?

Kennard Over a year ago

Thanks a lot. It's public site. www.livedata.com/. What I want to do is hover over the mouse on "Healthcare" and click "Benefits".

Kennard Over a year ago

You're fantastic! It works as charm with Firefox. However, I'm doing this with Chrome, it ends badly. Is there any difference in the functions of Firefox and Chrome? I tried the same code with chrome. It reports error: selenium.common.exceptions.TimeoutException: Message:

alecxe Over a year ago

@Julia thanks. Is the behavior consistent? Are you executing the same exact code? (I've tried with Chrome multiple times..no errors)

|

Collectives™ on Stack Overflow

How to click on drop down menu in Python using Selenium and Chrome

1 Answer 1

6 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related