在 xpath 中为 selenium webdriver 中的“ul”html 代码制造麻烦

Question

HTML 代码：

<div id="routingPanel" class="">
<div id="routingPanelRight">
<ul id="routingList" class="ui-sortable">
<li class="ui-menu-item ui-draggable" style="display: list-item;" role="presentation" data-type="srl" data-id="15">
<a class="ui-corner-all" tabindex="-1">AS-HTTS-US-LAN-SW</a>
<span class="fa fa-trash"/>
<span class="type">[srl]</span>
</li>
<li class="ui-menu-item ui-draggable" style="display: list-item;" role="presentation" data-type="queue" data-id="119">
<a class="ui-corner-all" tabindex="-1">AS-EMEA-NORTH</a>
<span class="fa fa-trash"/>
<span class="type">[queue]</span>
</li></ul></div></div>

我需要单击一个具有跨度类“fa fa-trash”但它位于 li 类中的按钮。我在页面上的按钮列表中列出了 li 类的变化。

我正在从 excel 文件中提供测试数据，所以我不能使用直接值。

我尝试使用这个 xpath

.//*[@id='routingList']/li[5]/span[1] //testdata1
.//*[@id='routingList']/li[2]/span[1] //testdata2

其中 li 值每次从 excel 文件中更改。

WebDriverWait wait = new WebDriverWait(driver, 15);
        wait.until(ExpectedConditions.visibilityOfElementLocated((By.xpath("//ul[@id='routingList']/li/span[1]")))).click();

        List<WebElement> options = driver.findElements(By.xpath("//ul[@id='routingList']/li/span[1]"));
        for (WebElement option : options) {
              if(testData.equals(option.getText()))
                option.click();

尝试了上面的代码，但它只从列表中删除了一个，我已经通过了另外两个需要删除的测试数据。

需要建议

Answer 1

根据您在 cmets 中给我的信息，我认为问题在于您试图从不包含文本的元素中获取文本。

假设您的 testData 是 AS-HTTS-US-LAN-SW。在您提供的 HTML 和您提到的 xpath 中，您选择了一个自动关闭标签 <span class="fa fa-trash"/>。选择此标签后，您将尝试获取其中的文本，但没有。

<ul id="routingList" class="ui-sortable">
    <li class="ui-menu-item ui-draggable" style="display: list-item;" role="presentation" data-type="srl" data-id="15">
        ===========================
        <a class="ui-corner-all" tabindex="-1">AS-HTTS-US-LAN-SW</a>  ----> The text is contained here
        <span class="fa fa-trash"/> ---> No text in that tag
        ===========================
        <span class="type">[srl]</span>
    </li>
</ul>

因此，基本上，您必须将 xpath 从：//ul[@id='routingList']/li/span[1] 修改为：//ul[@id='routingList']/li/a 以获取文本，然后返回父节点以找到您的按钮：../span[contains(@class, 'fa fa-trash')]

WebDriverWait wait = new WebDriverWait(driver, 15);
wait.until(ExpectedConditions.visibilityOfElementLocated((By.xpath("//ul[@id='routingList']/li/span[1]")))) // removed the click here because you were clicking on the first element of the list

List<WebElement> options = driver.findElements(By.xpath("//ul[@id='routingList']/li/a"));
for (WebElement option : options) {
    if(testData.equals(option.getText()))
        option.findElement(By.xpath("../span[contains(@class, 'fa fa-trash')]")).click();

如果有帮助请告诉我

Answer 2

我知道您已经接受了答案，但有一种更有效的方法可以做到这一点。您可以将要查找的文本指定为 XPath 的一部分。因此，您只需进行一次搜索，而不是遍历所有选项，如果有很多选项，这可能会影响性能。此外，对于这样的事情，您可能会多次使用它，因此请将其放入一个函数中。

在这种情况下，该函数将接收您要查找的字符串，然后单击相应的元素。

public void selectRegion(String regionName)
{
    driver.findElement(By.xpath("//a[.='" + regionName + "']/following-sibling::span[@class='fa fa-trash']")).click();
}

你会这样称呼它

selectRegion(testData);

该函数查找包含所需文本的A 标签，然后单击类fa fa-trash 的兄弟SPAN。