how to Click on windows menu which populate on mouse hover using selenium

问题

A JavaScript function which load menu at run time. On mouse hover over, the LoadMenu function loads the menu item and I need the location assosciated with it on MouseClick() event.

How can I do this using Selenium webdriver?

function  LoadMenus(){

        window.menu_1234567 =  new Menu("root",150,20,"Arial, Helvetica, sans-serif",12,"#336699","#333333","#ffffff","#E2E6CD","left","middle",10,0,200,-5,7,true,false,true,0,true,true);
        menu_1234567.addMenuItem("Partner&nbsp;Management","location='/dash-1.0/partnerconfiguration/partnerAdministration.action'");
        menu_12345678_0.addMenuItem("User&nbsp;Management","location='/dash-1.0/systemadminconfiguration/userSysAdmin.action'");
        menu_1234567.addMenuItem("Audit&nbsp;Report","location='/dash-1.0/configuration/auditReport.action'");
        menu_1234567.addMenuItem("Change&nbsp;Password","location='/dash-1.0/changecurrentpassword.action'");
        menu_1234567.addMenuItem("Sign&nbsp;Out","location='/dash-1.0/logout.action'");
        menu_1234567.hideOnMouseOut=true;
        menu_1234567.writeMenus();
     };
    LoadMenus();

Here is the HTML code:

    <div id="menuItem0" class="menuItem" style="position: absolute; left: 0px; top: 0px; font-family: Arial,Helvetica,sans-serif; font-size: 12px; height: 20px; background-color: rgb(255, 255, 255); visibility: inherit;">
<div id="menuItemText0" class="menuItemText" style="position:absolute;left:11px;top:3px;color:#336699;">Partner Management </div>
<div id="menuItemHilite0" class="menuItemHilite" style="position: absolute; left: 11px; top: 3px; color: rgb(51, 51, 51); visibility: hidden;">Partner Management </div>
</div>

I got the element "menuItemText2" via selenium webdriver but on element.click() method nothing happens. I have tried all those scenarios mentioned below, but unable to click on menu item correctly via selenium web driver.

// case 1 tried using mouseMove
Point p=element.getLocation();
System.out.println("x="+p.getX());
System.out.println("y="+p.getY());
Robot robot = new Robot();
robot.mouseMove(p.getX(),p.getY());

// case 2 tried using moveByOffset
Actions builder = new Actions(driver); 
builder.moveToElement(element).build().perform();
builder.moveByOffset(p.x, p.y).perform();

// case 3  tried using Action builder
Actions hover = builder.moveToElement(element, p.x, p.y);
hoverOverRegistrar.perform();
hover.perform();
hover.build();
hover.click();

//case 4 tried by executing javascript and search element by name
element=    driver.findElement(By.name("Sign Out "));
JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript("$('div#menuItemText2').mouseover();");
js.executeScript("$('div#menuItem3.menuItem').click();");

// case 5 tried by executing javascript and search element by id
element = driver.findElement(By.id("menuItem4"));
JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript("$('div#menuItem4.menuItem').hover();");
element.click();

Please explain how to click on such menu items which populate the on mouse hover and on click event is not assosciated with web element.

回答1:

Have you ever tried the Action interface?

Especially the point "Generating Action chains" should help you

I do it like that:

private void hoverAndClick(WebElement[] hoverer, WebElement element){

    Actions actions = new Actions(this.driver);

    for (WebElement we : hoverer) {
        Action hovering = actions.moveToElement(we).build();
        hovering.perform();
    }

    element.click();
}

If you only need one element to hover for ever, remove the array and the ateration or copy this:

private void hoverAndClick(WebElement hover, WebElement element){

    Actions actions = new Actions(this.driver);

    Action hovering = actions.moveToElement(hover).build();
    hovering.perform();
    element.click();

}

回答2:

I would modify case 5 you described:

// case 5 tried by executing javascript and search element by id
element = driver.findElement(By.id("menuItem4"));
JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript("$('div#menuItem4.menuItem').hover();");
element.click();

in the following way;

    String cssSelector="[id='menuItem4']";

    public void jsClick(String css){

        JavascriptExecutor js = (JavascriptExecutor) driver;
            StringBuilder stringBuilder = new StringBuilder();
            stringBuilder.append("var x = $(\'"+css+"\');");
            stringBuilder.append("x.click();");
            js.executeScript(stringBuilder.toString());
    }
    jsClick(cssSelector);

hope this somehow helps you)

来源：https://stackoverflow.com/questions/12506375/how-to-click-on-windows-menu-which-populate-on-mouse-hover-using-selenium

标签

javascript

selenium

webdriver