悬停元素列表-Selenium Java WebDriver

Question

以下是我尝试使用Selenium WebDriver（2.53.1）和Java进行测试的方案。

在网页上，我有一个星星列表。 我想将鼠标悬停在它们上面，当我们进行鼠标悬停时，星星会突出显示。 然后单击星星之一。 当每个星星都悬停时，css会发生变化。

悬停前

  <div class="wh-rating-choices" style="display: none;">
        <div class="wh-rating-choices-holder">
                                <a href="#">1</a>
                                <a href="#">2</a>
                                <a href="#">3</a>
                                <a href="#">4</a>
                                <a href="#">5</a>
                            <em>Your Rating: <span></span></em>
        </div>
    </div>

悬停后

   <div class="wh-rating-choices" style="display: none;">
        <div class="wh-rating-choices-holder">
                                <a href="#" class="hover">1</a>
                                <a href="#" class="hover">2</a>
                                <a href="#" class="hover">3</a>
                                <a href="#" class="hover">4</a>
                                <a href="#" class="hover">5</a>
                            <em>Your Rating: <span>Excellent</span></em>
        </div>
    </div>

因此，基本上，在成功悬停时，会在html / css中添加“悬停”类。

我尝试过的代码如下。

List<WebElement> allStars = driver.findElements(By.xpath("//a[@class='hover']"));
System.out.println("<<<<<<<<<<<<------List of all stars, size------------>>>>>>>>>>"+allStars.size());
for (WebElement e : allStars) {
    Actions act = new Actions(driver);
    act.moveToElement(e).build().perform();
    Thread.sleep(5000);
}

与悬停之前一样，未添加类“悬停”，WebElement的列表始终为零。 尝试了一些硒站点上建议的某些选项，但是没有用。 请帮助，如何进行这一步骤。

Answer 1

我刚刚测试了一个解决方案，但是它很粗糙。 但是，它可以工作。

注意：直接导航至第五颗星（文字为“ 5”的元素）对我不起作用。 似乎您需要将鼠标悬停以打开“评级持有人”框，然后将鼠标悬停在第五颗星上，以便将它们全部都作为class =“ hover”。

这是我所做的：

-使用操作导航到上方的元素（“撰写评论”）

-以1像素为增量向下移动（正“ y”）

-每次增加之后，测试“ wh-rating-choices”类的元素是否包含字符串“ block”

-如果是的话，请移至元素为“ wh-rating-choices-holder”的元素下包含文本为“ 5”的元素

我在python中进行了测试，但这是在Java中应该起作用的内容：

Actions action = new Actions(driver);
int inc = 0;
while (inc < 100) {
    WebElement top = driver.findElement(By.xpath("//*[contains(text(), 'Write a Review')]"));
    action.moveToElement(top, 0, inc).contextClick().perform();
    Thread.sleep(200);
    a = driver.findElement(By.xpath("//*[contains(@class, 'wh-rating-choices')]"));
    if (a.getAttribute("style").contains("block") {
        aa = driver.findElement(By.xpath("//*[contains(@class, 'wh-rating-choices-holder')]"));
        bb = aa.findElement(By.xpath(".//*[contains(text(), '5')]"));
        action.moveToElement(bb).perform();
        break;
    }
    inc++;
}
System.out.println(bb.getAttribute("outerHTML"));

Thread.sleep(200)可能会过大，请尝试较低的值，例如50或20。

PS。 您可能需要先关闭弹出窗口，该弹出窗口具有class="af-icon-cross"

Answer 2

看来您很亲密。 您需要使class="hover"的<a>元素的WebDriverWait成为可单击的，并且可以使用以下解决方案：

WebElement rating_holder = driver.findElement(By.xpath("//div[@class='wh-rating-choices']"));
((JavascriptExecutor)driver).executeScript("arguments[0].removeAttribute('style')", rating_holder)
List<WebElement> allStars = new WebDriverWait(driver, 20).until(ExpectedConditions.visibilityOfAllElementsLocatedBy(By.xpath("//div[@class='wh-rating-choices']/div[@class='wh-rating-choices-holder']//a")));
System.out.println("<<<<<<<<<<<<------List of all stars, size------------>>>>>>>>>>"+allStars.size());
for (WebElement e : allStars) {
    if(e.getAttribute("innerHTML").contains("5"))
    {
        new Actions(driver).moveToElement(e).build().perform();
        new WebDriverWait(driver, 20).until(ExpectedConditions.elementToBeClickable(By.xpath("//div[@class='wh-rating-choices-holder']//a[@class='hover']"))).click();
    }
}

Answer 3

代码的问题在于，您甚至在悬停之前正在寻找已经具有'hover'类的A标签。 如您所述，只有在发生悬停之后才添加“悬停”类。 因此，您需要更改您的初始定位器以不包括“ hover”类。

除非需要XPath（通过包含的文本或DOM遍历查找元素），否则我更喜欢在XPath上使用CSS选择器。 您可以进行谷歌搜索以获取更多信息。 这是经过测试的代码。

// find all A tags inside the containing DIV
List<WebElement> stars = driver.findElements(By.cssSelector("div.wh-rating-choices-holder > a"));

// loop through each element and hover
Actions action = new Actions(driver);
for (WebElement e : stars)
{
    action.moveToElement(e).perform();
}

// after all the hovering is done, fetch the same elements but expect that they will now contain the 'hover' class
stars = driver.findElements(By.cssSelector("div.wh-rating-choices-holder > a.hover"));

// Assert (TestNG) that there are 5 stars that were hovered
Assert.assertEquals(stars.size(), 5, "Verify 5 elements were hovered");

// click the 5th star
stars.get(4).click();