How to Extract Data from a Shadow Root Using Selenium Python?

Extracting Information from a Shadow Root Using Selenium Python

In the context of the provided URL https://www.tiendasjumbo.co/buscar?q=mani, extracting information from elements within a #shadow-root (open) presents a challenge. The following code snippet illustrates the issue:

<code class="python">from selenium import webdriver
import time
from random import randint

driver = webdriver.Firefox(executable_path="C:\Program Files (x86)\geckodriver.exe")
driver.implicitly_wait(10)
time.sleep(4)

url = "https://www.tiendasjumbo.co/buscar?q=mani"
driver.maximize_window()
driver.get(url)
driver.find_element_by_xpath('//h1[@class="impulse-title"]')</code>

Solution:

The products within the webpage are encapsulated within a shadow root. To access these elements, the shadowRoot.querySelector() method must be employed. The following code demonstrates this strategy:

<code class="python">driver.get('https://www.tiendasjumbo.co/buscar?q=mani')
item = driver.execute_script("return document.querySelector('impulse-search').shadowRoot.querySelector('div.group-name-brand h1.impulse-title span.formatted-text')")
print(item.text)</code>

Output:

La especial mezcla de nueces, maní, almendras y marañones x 450 g

References:

• [Unable to locate the Sign In element within #shadow-root (open) using Selenium and Python](https://stackoverflow.com/questions/66779988/unable-to-locate-the-sign-in-element-within-shadow-root-open-using-selenium-a)
• [How to locate the First name field within shadow-root (open) within the website https://www.virustotal.com using Selenium and Python](https://stackoverflow.com/questions/66820107/how-to-locate-the-first-name-field-within-shadow-root-open-within-the-website)

Note:

Microsoft Edge and Google Chrome version 96 introduced changes in shadow root handling. For updated information, please refer to the following resources:

• Java: https://gist.github.com/chandrashekar4242/c2ef0878241f737cc89ec1878d60f974
• Python: https://gist.github.com/hongtaocao/6409059fd2bb8d250f925b6b68c3a660
• C#: https://gist.github.com/skcheidt/4a6a8bca561b403db94c7264a5a24738
• Ruby: https://gist.github.com/yuusuke-tanaka1/3493c57d228f759be374aeb0b64e51d9

The above is the detailed content of How to Extract Data from a Shadow Root Using Selenium Python?. For more information, please follow other related articles on the PHP Chinese website!