关于shadow-root影子控件的selenium ui自动化 - 兴趣爱好交流

link管理

链接快照平台

输入网页链接，自动生成快照
标签化管理网页链接

相关文章推荐

坏坏的红金鱼 · TestNG Tutorials 50: ...· 2 周前 ·

发怒的小蝌蚪 · Removing big files ...· 1 周前 ·

寂寞的海豚 · K230 nncase开发指南 — ...· 2 月前 ·

深沉的山羊 · 学院简介-华中师范大学社会学院_华中师范大学 ...· 8 月前 ·

刚毅的棒棒糖 · 二十一、redux & mobx - 知乎· 10 月前 ·

温文尔雅的橡皮擦 · Instant Client for ...· 10 月前 ·

const shadowRoot = document.body.attachShadow({ mode: 'open' }); // 将template内容复制到shadow root中 const templateContent = template.content.cloneNode(true); shadowRoot.appendChild(templateContent);

这里偷个懒,使用python http服务启动一个临时的页面

python -m http.server
成功之后访问 http://localhost:8000/root.html
这样我们就具备了一个临时测试用的页面了
首先 selenium 给元素对象提供了一个shadow_root的方法
我们先来定位到shadow-root元素的父级节点
driver.find_element(By.TAG_NAME, 'body')
然后根据父级节点的元素对象找到该元素下面的shadow-root
root_ele = driver.find_element(By.TAG_NAME, 'body')
ele = root_ele.shadow_root
此时,我们就可以使用ele元素对象去定位ele元素对象下的元素
ele.find_element(By.CSS_SELECTOR, '.message').get_attribute('innerText')
这样就可以对元素进行操作了
from selenium import webdriver
from selenium.webdriver.common.by import By
driver = webdriver.Edge()
driver.get('http://localhost:8000/root.html')
driver.implicitly_wait(10)
# 定位shadow-root的父元素
root_ele = driver.find_element(By.TAG_NAME, 'body')
# 获取shadow-root对象
ele = root_ele.shadow_root
# 使用css 定位 shadow-root 下的元素
print(ele.find_element(By.CSS_SELECTOR, '.message').get_attribute('innerText'))
    def test_demo(self):
        self.driver = webdriver.Chrome()
        self.driver.get('chrome://settings/clearBrowserData')
        ele = self.driver.execute_script('return document.querySelector("settings-ui").shadowRoot.querySelector("#main").shadowRoot.querySelector(".cr-centered-card-container").shadowRoot.querySelector("settings-privacy-page").shadowRoot.querySelector("settings-clear-browsing-data-dialog").shadowRoot.querySelector("#clearBrowsingDataConfirm")')
        ele.click()