Selenium を使用して Chrome の「閲覧データのクリア」ダイアログで Shadow DOM 要素にアクセスして操作する方法

CSS セレクター経由で Chrome ブラウザ データをクリアしながら、#shadow-root (オープン) 内の Shadow DOM 要素とインターフェイスします

Chrome ブラウザの自動化中Selenium を介して「閲覧データのクリア」ポップアップが表示され、#shadow-root (open) 内の要素にアクセスします。 「データを消去」ボタンを押すのは難しい場合があります。これは、シャドウ DOM 要素に通常の DOM ツリーから直接アクセスできないことが原因です。

シャドウ ホストとルートの検索

シャドウ DOM 要素と対話するには、まずシャドウ ホストを特定する必要があります。これは、シャドウ DOM を含むメイン DOM 内の要素です。シャドウ ホストが見つかったら、Selenium JavaScript Executor の getShadowRoot() メソッドを使用して、ホストのシャドウ ルートを取得できます。

シャドウ レベルのトラバース

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 中国語 Web サイトの他の関連記事を参照してください。