如何点击使用selenium在鼠标悬停时填充的windows菜单

Question

一个JavaScript函数，它在运行时加载菜单。鼠标悬停在上方时，LoadMenu函数会加载菜单项，我需要在MouseClick（）事件中使用与其相关的位置。

我怎么能用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 Management","location='/dash-1.0/partnerconfiguration/partnerAdministration.action'");
        menu_12345678_0.addMenuItem("User Management","location='/dash-1.0/systemadminconfiguration/userSysAdmin.action'");
        menu_1234567.addMenuItem("Audit Report","location='/dash-1.0/configuration/auditReport.action'");
        menu_1234567.addMenuItem("Change Password","location='/dash-1.0/changecurrentpassword.action'");
        menu_1234567.addMenuItem("Sign Out","location='/dash-1.0/logout.action'");
        menu_1234567.hideOnMouseOut=true;
        menu_1234567.writeMenus();
     };
    LoadMenus();                

这是HTML代码：

    <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>

我通过selenium webdriver获得了元素“menuItemText2”，但是在element.click（）方法中没有任何反应。我已尝试过下面提到的所有场景，但无法通过selenium web驱动程序正确点击菜单项。

// 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();

请解释如何单击这些填充鼠标悬停的菜单项，并且单击事件与web元素无关。

Answer 1

你有没有尝试过Action界面？

特别是“生成行动链”这一点应该对你有帮助

我这样做：

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();
}

如果你只需要一个元素悬停，删除数组和迭代或复制它：

private void hoverAndClick(WebElement hover, WebElement element){

    Actions actions = new Actions(this.driver);

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

}

Answer 2

我会修改你描述的案例5：

// 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();

以下列方式;

    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);

希望这能以某种方式帮助你）