如何使用 Selenium 和 Java 識別是否選擇了帶有偽元素::after 樣式的單選按鈕選項

Question

我很難確定是否使用 Selenium Java 選擇了無線電選項 No。 下面是 web 頁面上的無線電選項的屏幕截圖。

這是原始的 HTML 代碼。 由於它缺少偽元素，我還附上了它的屏幕截圖。

<div id="ButtonOptions" class="sample prop_group">
    <label class="vdl-radio">
       <input id="radio_K371FCY2UbrpgcP3RE6VC" type="radio" class="vdl-radio__input" tabindex="0" aria-disabled="false" value="true">
    <label for="radio_K371FCY2UbrpgcP3RE6VC">Yes</label>
    </label>
    <label class="vdl-radio">
       <input id="radio_4XLAugQMgEwzm3e2quk5y" type="radio" class="vdl-radio__input" tabindex="0" aria-disabled="false" value="false" checked="">
    <label for="radio_4XLAugQMgEwzm3e2quk5y">No</label>
    </label>
</div>

下面是 HTML 代碼的屏幕截圖，該代碼具有偽 element::after（在下面突出顯示）在未選擇選項時動態加載。

我在 Java 方法下創建了執行 JavaScript 的方法，我希望返回整個label for標簽。 它目前正在打印null 。 但是，當我在 Chrome 瀏覽器控制台中執行下面使用的腳本時，它會識別整個 label 標記，包括::before和::after偽元素。

        public String whichRadioOptionIsSelected(){
        String tag = "";      
        List<WebElement> radioOptions = findElementsByXpath(".//div[@id='ButtonOptions']/label");

        //Iterate thru both radio options and execute the JavaScript.

        for(int i = 1; i <= radioOptions.size(); i++) {
                String script = "return document.querySelector('div#ButtonOptions > label:nth-of-type("+i+") label', null);";
                JavascriptExecutor js = (JavascriptExecutor) driver;
                tag = (String) js.executeScript(script);
                System.out.println(tag);
            }        
        return tag;
    }
}

Answer 1

要驗證是否選擇了文本為No的單選按鈕，您可以使用以下基於 xpath 的定位器策略：

• 使用前面的：

   try { driver.findElement(By.xpath("//div[@id='ButtonOptions']//label[@class='vdl-radio']//label[text()='No']//preceding::input[@checked]")); System.out.println("No option is selected"); } catch(NoSuchElementException e) { System.out.println("No option isn't selected"); }

• 使用前兄弟：

   try { driver.findElement(By.xpath("//div[@id='ButtonOptions']//label[@class='vdl-radio']//label[text()='No']//preceding-sibling::input[@checked]")); System.out.println("No option is selected"); } catch(NoSuchElementException e) { System.out.println("No option isn't selected"); }

---

參考

您可以在以下位置找到關於偽元素的詳細討論：

• 如何在使用 Selenium Python 之前定位偽元素::before