时间戳

首页 > 解决方案 > 使用 Selenium 和 CSS 查找阴影 DOM 文本

python - 使用 Selenium 和 CSS 查找阴影 DOM 文本

问题描述

我正在尝试从保存在 shadow DOM 中的输入字段中找到输入文本：

driver.find_element_by_css_selector("#my_id div:nth-of-type(2)").text

但这无济于事。HTML 部分

<input _ngcontent-c21="" class="clr-input ng-untouched ng-pristine ng-valid" id="my_id" name="my_id" placeholder="My placeholder namespace" size="40" type="text">
 #shadow-root {user-agent}
  <div pseudo="-webkit-input-placeholder" id="placeholder" style="display: none !important;">My placeholder namespace</div>
  <div>Text I need to find</div>

也没有运气尝试过：

shadow_section = driver.execute_script('''return 
document.querySelector("#my_id").shadowRoot''')
            print(shadow_section.find_element_by_css_selector("div:nth-of-type(2)").text)

在这种情况下，在 shadow DOM 中查找元素的最佳方法是什么？在我的情况下，定位器应该链接到元素。

更新：正如我所建议的那样：

  shadow_root = driver.execute_script('return arguments[0].shadowRoot', driver.find_element_by_css_selector("#my_id"))
  shadow_root_element = shadow_root(driver.find_element_by_css_selector('div:nth-child(2)'))

但收到：

TypeError: 'NoneType' object is not callable

在行上shadow_root_element。

标签： pythonhtmlseleniumselenium-webdrivershadow-dom

解决方案

element=driver.execute_script(
    "return document.querySelector('#my_id').shadowRoot.querySelector('div:nth-child(2)')")

您必须使用执行脚本来查找影子根，该元素将拥有您想要的项目。您现在可以使用 element.text 来获取文本

推荐阅读