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

Question

Selenium WebDriver在尝试使用CSS选择器单击下一个同级元素时引发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，您可以使用xpath中的text直接获取该元素。找到该元素后，可以在xpath中使用following-sibling转到可单击的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();
}

Answer 2

在其他人指出可以使用xpath轻松解决此问题之前，让我告诉您我已经有了该解决方案。但是，这个问题的目的是找出为什么即使我的CSS选择器正确，硒也无法正常工作。

Xpath解决方案：

public void selectCheckbox(String value){
    for(WebElement checkbox : checkboxes){
        String text = checkbox.getText();
        if(text.equalsIgnoreCase(value)){
            WebElement control = checkbox.findElement(By.xpath(".//parent::div/span[@class='checkbox']"));
            control.click();
        }
    }
}