Selenium을 사용하여 Chrome의 '검색 데이터 지우기' 대화 상자에서 Shadow DOM 요소에 액세스하고 상호 작용하는 방법은 무엇입니까?

CSS 선택기를 통해 Chrome 브라우저 데이터를 지우는 동안 #shadow-root(열기) 내에서 Shadow DOM 요소와 인터페이스

Chrome 브라우저의 #shadow-root(열기) 내의 요소에 액세스하는 Selenium을 통한 "Clear Browsing Data" 팝업(예: "Clear Browsing Data") 데이터' 버튼을 누르는 것이 어려울 수 있습니다. 이는 Shadow DOM 요소가 일반 DOM 트리를 통해 직접 액세스할 수 없기 때문입니다.

섀도우 호스트 및 루트 찾기

Shadow DOM 요소와 상호작용하려면 , 먼저 Shadow DOM을 포함하는 기본 DOM의 요소인 Shadow 호스트를 식별해야 합니다. 섀도우 호스트를 찾으면 Selenium JavaScript Executor의 getShadowRoot() 메서드를 사용하여 호스트의 섀도우 루트를 검색할 수 있습니다.

섀도우 레벨 탐색

여러 수준의 Shadow DOM이 있는 경우 원하는 요소에 도달하려면 이러한 수준을 통과해야 합니다. 이를 위해 현재 섀도우 루트 내에서 섀도우 호스트를 찾은 다음 getShadowRoot()를 사용하여 해당 섀도우 루트를 검색하여 위 프로세스를 재귀적으로 반복할 수 있습니다.

예제 코드

다음 예에서는 getShadowRoot() 메서드와 재귀 순회를 사용하여 "Clear"에 액세스하는 방법을 보여줍니다. "인터넷 사용 기록 삭제" 팝업 내의 "data" 버튼:

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 중국어 웹사이트의 기타 관련 기사를 참조하세요!