使用 Selenium 在封闭的 Shadow DOM 中选择按钮

Question

我正在尝试使用 python 使用 Selenium 解决谷歌验证码

我正在使用this简单示例站点进行测试，但我很难理解如何选择影子根中的按钮。

该图片显示了我需要获取的按钮元素。

我知道我需要先获取外部 div 元素，然后搜索内部元素，但我没有这样做，因为我不是 100% 清楚执行类似操作后如何导航到内部元素

driver.execute_script("return document.querySelector('div[class=\"button-holder help-button-holder\"]')

这个问题是关于类似（相同？）的问题，但没有可行的解决方案。

Answer 1

您的元素处于

shadow-root

且具有

closed

状态。

当影子根的模式为“关闭”时，影子根的实现内部是不可访问且不可更改的，因此您无法访问

shadowRoot

属性。

由于 Selenium 实现了 CDP 协议 API，具有

shadow-root

状态的

closed

可以在页面加载时用

open

状态覆盖。

您只需要重写

Element

类原型方法

attachShadow

并在页面加载之前评估新文档上的脚本。

如何覆盖元素属性

如何通过 CDP 协议在加载时执行脚本

代码示例：

url = "yourUrl"
driver.execute_cdp_cmd('Page.addScriptToEvaluateOnNewDocument', {'source': """
Element.prototype._attachShadow = Element.prototype.attachShadow;
Element.prototype.attachShadow = function () {
    return this._attachShadow( { mode: "open" } );
};
"""})
driver.get(url)
closed_shadow_host = driver.find_element(By.CSS_SELECTOR, 'div[class=\"button-holder help-button-holder\"]')
shadow_root = driver.execute_script('return arguments[0].shadowRoot', closed_shadow_host)