如何使用 Selenium 存取 Chrome 的「清除瀏覽資料」對話方塊中的 Shadow DOM 元素並與之互動？

在透過CSS 選擇器清除Chrome 瀏覽器資料時與#shadow-root (open) 內的Shadow DOM 元素互動

自動化Chrome 瀏覽器的透過Selenium彈出“清除瀏覽資料”，存取#shadow-root（開啟）中的元素，例如“清除資料”按鈕，可能具有挑戰性。這是因為 Shadow DOM 元素無法透過常規 DOM 樹直接存取。

定位 Shadow Host 和 Root

與 Shadow DOM 元素交互，我們首先需要識別影子宿主，它是主 DOM 中包含影子 DOM 的元素。一旦找到影子主機，我們就可以使用 Selenium JavaScript Executor 中的 getShadowRoot() 方法來擷取主機的影子根。

遍歷 Shadow Levels

如果存在多個層級的 Shadow DOM，我們需要遍歷這些層級才能到達所需的元素。為此，我們可以透過在目前影子根中定位影子主機，然後使用 getShadowRoot() 檢索其影子根來遞歸地重複上述過程。

範例程式碼

下面的範例示範如何使用 getShadowRoot() 方法並遞歸遍歷來存取“清除資料” 「清除瀏覽資料」彈出視窗中的按鈕：

JavascriptExecutor js = (JavascriptExecutor) driver;
WebElement shadowHost = driver.findElement(By.cssSelector("settings-ui"));
WebElement shadowRoot = (WebElement) js.executeScript("return arguments[0].shadowRoot", shadowHost);
WebElement clearData = (WebElement) js.executeScript("return document.querySelector('settings-ui').shadowRoot.querySelector('settings-main').shadowRoot.querySelector('settings-basic-page').shadowRoot.querySelector('settings-section > settings-privacy-page').shadowRoot.querySelector('settings-clear-browsing-data-dialog').shadowRoot.querySelector('#clearBrowsingDataDialog').querySelector('#clearBrowsingDataConfirm')");
clearData.click();

透過利用此方法，您可以有效地與#shadow-root（開啟）中的元素進行互動並執行所需的操作。

以上是如何使用 Selenium 存取 Chrome 的「清除瀏覽資料」對話方塊中的 Shadow DOM 元素並與之互動？的詳細內容。更多資訊請關注PHP中文網其他相關文章！