css - 无法在 Selenium 中使用 CSS 选择器选择同级

Question

当尝试使用 CSS 选择器单击下一个同级元素时，Selenium WebDriver 会抛出 InvalidSelectorException。

考虑我的 DOM 看起来像这样:

<div class="checkbox-group">
   <div>     
       <span class="checkbox">::after</span> <!--click on this span makes the checkbox checked-->
       <span class="checkbox-name">Male</span> <!--click on this span doesn't make the checkbox checked-->
   </div>
   <div>
      <span class="checkbox">::after</span>
      <span class="checkbox-name">Female</span>
   </div>
</div>

我的 Java 代码是:

@FindAll(@FindBy(css=".checkbox-name"))
List<WebElement> checkboxes;

public void selectCheckbox(String value){
    for(WebElement checkbox : checkboxes){
        String text = checkbox.getText();
        if(text.equalsIgnoreCase(value)){
            WebElement control = checkbox.findElement(By.cssSelector("+.checkbox"));//Exception thrown here     
            control.click();
        }
    }
}

抛出异常:

org.openqa.selenium.InvalidSelectorException: invalid selector: An invalid or illegal selector was specified. 
** Element info: {Using=css selector, value=+.checkbox} 

Answer 1

而不是按类获取元素checkbox-name并检查它是否包含 String value ，您可以使用 text 直接获取该元素在 xpath 中。
找到该元素后，您可以使用 following-sibling在 xpath 中访问 span这是可点击的。

您可以仅在一个 xpath 中完成所有这些操作，例如:

public void selectCheckbox(String value){
    WebElement checkBox = driver.findElement(By.xpath("//div[@class='checkbox-group']//span[text()="+value+"]//following-sibling::span"));
    checkBox.click();
}