Selenium技术问题：无法点击Shadow Root内的按钮

问题场景 #

在目标网站上尝试通过Selenium点击Cookie授权弹窗的「全部接受」按钮时，弹窗无法被正常定位和操作。检查页面结构发现，该弹窗元素位于Shadow Root内部，直接通过常规元素定位方式无法访问，甚至打印网页内容都看不到弹窗相关代码。

原尝试代码（存在问题） #

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

driver = webdriver.Firefox()
driver.maximize_window()
url = 'https://www.guest.wemolo.at/?access_token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpZCI6IjQ4NWIyZWEyLTY2MTItNDU3ZS05YTA4LTRhODBjMTgxNzM4MiJ9.dyAdGEDJ87U-i_lBytN3Y-_kIuJnRKvJKJgVOQ0MlfE'
driver.get(url)

wait = WebDriverWait(driver, 10)
shadow_host = wait.until(EC.presence_of_element_located((By.XPATH, "//button[contains(text(), 'Alles Akzeptieren')]")))
shadow_root = shadow_host.shadow_root
load = shadow_root.find_element(By.XPATH, "//button[contains(text(), 'Alles Akzeptieren')]")
load.click()

原代码问题分析 #

• 错误将Shadow Root内部的按钮当作Shadow Host定位，实际Shadow Host是usercentrics-root元素
• 直接通过元素的shadow_root属性获取Shadow Root，在部分浏览器（如Firefox）中兼容性不佳
• 未确保元素处于可点击状态就尝试定位，容易出现元素未加载完成的问题

修复方案 #

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

driver = webdriver.Chrome()
url = 'https://www.guest.wemolo.at/?access_token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpZCI6IjQ4NWIyZWEyLTY2MTItNDU3ZS05YTA4LTRhODBjMTgxNzM4MiJ9.dyAdGEDJ87U-i_lBytN3Y-_kIuJnRKvJKJgVOQ0MlfE'
driver.get(url)

wait = WebDriverWait(driver, 10)
# 定位Shadow Root的宿主元素
root_element = wait.until(EC.presence_of_element_located((By.ID, "usercentrics-root")))
# 通过JS脚本获取Shadow Root（跨浏览器可靠方式）
shadow_root = driver.execute_script("return arguments[0].shadowRoot", root_element)
# 在Shadow Root内等待「全部接受」按钮可点击
button = WebDriverWait(shadow_root, 10).until(
    EC.element_to_be_clickable((By.CSS_SELECTOR, "button[data-testid=uc-accept-all-button]"))
)
# 滚动到按钮可见区域
driver.execute_script("arguments[0].scrollIntoView();", button)
button.click()

修复要点说明 #

1. 正确定位Shadow Host：找到承载Shadow Root的usercentrics-root元素，这是访问内部元素的入口
2. 可靠获取Shadow Root：使用execute_script执行JS脚本获取Shadow Root，比直接访问元素属性兼容性更好
3. 等待元素可点击：在Shadow Root内部使用显式等待，确保按钮完全加载并处于可点击状态
4. 滚动到可见区域：避免按钮因页面布局问题处于不可见状态，导致点击失败

内容的提问来源于stack exchange，提问作者Gibby