如何使用Playwright获取仅含文本的Shadow Root内容？

针对你遇到的问题，这里提供两种直接获取开放Shadow Root纯文本的方法：

方法1：通过ElementHandle操作Shadow Root #

先将定位到的元素转为ElementHandle，再获取其Shadow Root，最后读取文本内容：

from playwright.sync_api import sync_playwright

with sync_playwright() as p:
    browser = p.firefox.launch(args=["--disable-gpu"], headless=False)
    page = browser.new_page()
    page.goto("https://www.sample.com")
    
    # 将Locator转为ElementHandle
    some_element_handle = page.locator('some-element').first.element_handle()
    # 获取Shadow Root实例
    shadow_root = some_element_handle.shadow_root
    # 读取Shadow Root的文本内容
    shadow_text = shadow_root.text_content().strip()
    print(shadow_text)  # 输出ABC
    
    browser.close()

方法2：通过page.evaluate直接执行浏览器端JS #

直接在浏览器上下文里编写JS逻辑，跳过中间步骤：

from playwright.sync_api import sync_playwright

with sync_playwright() as p:
    browser = p.firefox.launch(args=["--disable-gpu"], headless=False)
    page = browser.new_page()
    page.goto("https://www.sample.com")
    
    # 直接在浏览器端获取Shadow Root文本
    shadow_text = page.evaluate('''() => {
        const elem = document.querySelector('some-element');
        return elem.shadowRoot.textContent.trim();
    }''')
    print(shadow_text)  # 输出ABC
    
    browser.close()

注意事项 #

• 确保目标元素的Shadow Root是开放模式（open），如果是关闭模式（closed），Playwright无法访问其内容。
• 两种方法都无需依赖Shadow Root内的子标签，直接读取根节点的文本内容即可。

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