如何在多个影子根中定位元素

Question

我需要帮助找到此页面上下载 JSON 按钮的 Xpath 或 CSS 选择器。

https://data.ntsb.gov/carol-main-public/query-builder?month=12&year=1962

我通过 Chrome 浏览器复制了选择器，但当我控制查找时它没有找到按钮。

Xpath ->

//*[@id="exportResultsButton"]

CSS ->

#exportResultsButton

Answer 1

你的按钮被放置在几个

shadow-root

内部，要获取内部影子根结构，你应该先获取它的主机，然后获取

shadowRoot

属性。

在您的情况下，您可以编写在多个影子根内部钻取的函数。

1. 第一级有标签

   app-container

2. 第 2 级有 id

   query_builder

3. 第 3 级有 id

   results

get_shadow_root

函数使用JS执行器从主机获取shadow root。

drill_into_shadow_roots

进入数组中每个提供的选择器，使其成为主机并获取

shadowRoot

属性，因此下一次迭代将从新主机开始。

from selenium.webdriver.support.wait import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
from selenium.webdriver.common.by import By
from selenium import webdriver

timeout = 10

def get_shadow_root(element):
    return driver.execute_script('return arguments[0].shadowRoot', element)

def drill_into_shadow_roots(selectors):
    host = None
    _wait = WebDriverWait(driver, timeout)
    for by, selector in selectors:
        host = _wait.until(EC.presence_of_element_located((by, selector)))
        host = get_shadow_root(host)
        _wait = WebDriverWait(host, timeout)
    return host


driver.get("https://data.ntsb.gov/carol-main-public/query-builder?month=12&year=1962")

selectors = [(By.TAG_NAME, 'app-container'), (By.ID, 'query_builder'), (By.ID, 'results')]
results = drill_into_shadow_roots(selectors)
WebDriverWait(results, timeout).until(EC.visibility_of_element_located((By.ID, 'exportResultsButton'))).click()

Answer 2

如果使用 VBA，此代码会有所帮助：

"设置元素 = .ExecuteScript("返回 document.querySelector('app-container').shadowRoot.querySelector('#query_builder').shadowRoot.querySelector('#results').shadowRoot.querySelector('#exportResultsButton') ”）

元素.click”