Åtgärda "Kan inte läsa egenskaper för Null (Reading'shadowRoot")' Selen Web Scraping Error

Förstå och åtgärda vanliga JavaScript-fel i Selenium

Vid webbskrapa med Selenium WebDriver, att stöta på JavaScript-relaterade fel är inte ovanligt, särskilt när man hanterar dynamiska webbelement som skugg-DOM. Ett vanligt fel som utvecklare möter är JavascriptException: Kan inte läsa egenskaper för null (läser 'shadowRoot'), vilket ofta inträffar när man interagerar med komplexa sidelement.

Detta fel uppstår vanligtvis när Selenium inte kan komma åt eller interagera med element inuti en skugga DOM, en unik typ av inkapslad DOM-struktur som används av många moderna webbplatser för bättre modularitet. I Python kan det vara svårt att använda Selenium för att styra webbläsaren med sådana element.

I samband med webbskrapning från plattformar som Shopee använder popup-fönster eller banners ofta skugg-DOM, vilket kan vara svårt att stänga programmatiskt. Detta problem kan hindra det smidiga flödet av automatiserade uppgifter och störa datainsamlingen.

Den här guiden leder dig genom en tydlig lösning för att ta itu med problemet "Kan inte läsa egenskaper för Null" fel och ge ett praktiskt tillvägagångssätt för att stänga popup-fönster inbäddade i skugg-DOM:er i Shopee med hjälp av Python Selen.

Hur man hanterar Shadow DOM och popups i Selenium Web Scraping

Skripten som tillhandahålls ovan syftar till att lösa ett vanligt problem som uppstår vid webbskrapning med Selenium WebDriver när du interagerar med shadow DOM-element. En skugg-DOM är en del av en webbsida som fungerar separat från huvud-DOM, som ofta används i komplexa webbkomponenter. I samband med att skrapa webbplatser som Shopee, dyker popup-fönster ofta upp i skugg-DOM:er, vilket kan leda till fel om de nås med traditionella selenmetoder. Det första skriptet är utformat för att stänga popup-fönstret med JavaScript-körning execute_script(), ett kraftfullt verktyg som gör att Selenium kan köra rå JavaScript i webbläsarsammanhang.

Den viktigaste utmaningen är att element inuti en skugg-DOM inte är tillgängliga med vanliga Selenium-kommandon som find_element_by_xpath(). Istället använder vi JavaScript för att gå in i skuggan DOM med hjälp av shadowRoot egendom. Skriptet riktar sig till Shopee-popupens stängningsknapp genom att först komma åt dess skuggvärdelement och sedan fråga dess interna struktur. Genom att använda driver.execute_script(), skriptet kan manipulera och stänga element inuti denna isolerade DOM. Denna lösning fungerar bra i kombination med explicita väntetider för att hantera dynamiska sidelement som laddas asynkront.

Det andra manuset introducerar WebDriverWait, ett viktigt verktyg för att hantera tidpunkten för dynamiska sidelement. Eftersom Shopees popup-fönster laddas asynkront kan direkt interaktion med dessa element orsaka fel. För att undvika detta, WebDriverWait() säkerställer att elementen vi vill interagera med är fulladda och klara. Det här skriptet väntar på närvaron av både huvud-DOM-elementet och shadow-DOM-elementen. Metoden EC.presence_of_element_located() säkerställer att Selen interagerar med element först efter att de är synliga och närvarande, vilket är avgörande för att undvika nollreferensfel.

I båda skripten hanterar vi felsituationer med en försök-utom blockera för att säkerställa att programmet inte kraschar på grund av oväntade fel, som att element inte hittas. Felhantering är särskilt viktig när du skrapar webbplatser som ofta uppdaterar sin struktur eller ändrar popup-beteende. Dessutom följer dessa skript bästa praxis genom att avsluta webbläsarsessionen med driver.quit() efter körning för att undvika minnesläckor eller prestandaproblem.

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.chrome.service import Service
from selenium.webdriver.chrome.options import Options
from selenium.common.exceptions import JavascriptException
import time
# Initialize WebDriver with Chrome
options = Options()
driver = webdriver.Chrome(service=Service(), options=options)
# Open Shopee website
driver.get('https://www.shopee.co.th/')
# Click the Thai language button
th_button = driver.find_element(By.XPATH, '/html/body/div[2]/div[1]/div[1]/div/div[3]/div[1]/button')
th_button.click()
# Pause to allow popups to load
time.sleep(3)
# Try to close the shadow DOM popup
try:
    close_button = driver.execute_script('return document.querySelector("shopee-banner-popup-stateful")'
                                      '.shadowRoot.querySelector("div.shopee-popup__close-btn")')
    close_button.click()
except JavascriptException as e:
    print("Error: ", e)
# Close the browser
driver.quit()

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.chrome.service import Service
from selenium.webdriver.chrome.options import Options
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
import time
# Initialize WebDriver with Chrome
options = Options()
driver = webdriver.Chrome(service=Service(), options=options)
# Open Shopee website
driver.get('https://www.shopee.co.th/')
# Click the Thai language button
th_button = WebDriverWait(driver, 10).until(
    EC.element_to_be_clickable((By.XPATH, '/html/body/div[2]/div[1]/div[1]/div/div[3]/div[1]/button'))
)
th_button.click()
# Wait for the shadow DOM popup to be present
try:
    shadow_host = WebDriverWait(driver, 10).until(
        EC.presence_of_element_located((By.CSS_SELECTOR, 'shopee-banner-popup-stateful'))
    )
    shadow_root = driver.execute_script('return arguments[0].shadowRoot', shadow_host)
    close_button = shadow_root.find_element(By.CSS_SELECTOR, 'div.shopee-popup__close-btn')
    close_button.click()
except Exception as e:
    print("Error closing the popup: ", e)
# Close the browser
driver.quit()

Hantera dynamiskt innehåll med Selenium WebDriver

En annan nyckelaspekt att tänka på när man arbetar med Selenium WebDriver för webbskrapning är hur man hanterar dynamiskt innehåll som kontinuerligt uppdateras eller ändras efter sidladdning. Många moderna webbplatser, som Shopee, använder JavaScript för att ladda och uppdatera innehåll dynamiskt. Det betyder att element på sidan kanske inte är tillgängliga direkt efter att sidan har laddats. I sådana fall kan Seleniums standardbeteende att vänta på sidladdningshändelsen inte vara tillräckligt. Att använda explicita väntar som WebDriverWait kan lösa det här problemet genom att vänta på att specifika element visas eller blir klickbara.

För att skrapa webbplatser med popup-fönster, banners eller komplexa UI-komponenter som förlitar sig på skugg-DOM, det är viktigt att veta hur man interagerar med dem. Dessa komponenter döljer element i en isolerad DOM-struktur som inte kan nås med traditionella metoder som XPath eller CSS-väljare. Med hjälp av execute_script() kommandot hjälper dig att överbrygga detta gap genom att låta dig köra JavaScript direkt i webbläsaren, vilket ger dig tillgång till shadow DOM och möjliggör interaktioner med element som stängningsknappar eller formulärfält inom de dolda delarna av sidan.

Dessutom blir felhanteringen avgörande i sådana fall. Webbplatser kan ofta ändra sin struktur, vilket leder till trasiga skrapor. Korrekt användning av försök-utom block i Python låter dig fånga fel som t.ex JavascriptException och hantera dem graciöst, se till att skrapan inte kraschar oväntat. Att inkludera loggning för att fånga feldetaljerna kan hjälpa till att identifiera grundorsaken och lösa den i framtida skrapningar.