Memperbaiki 'Tidak Dapat Membaca Properti Null (Membaca'shadowRoot')' Kesalahan Pengikisan Web Selenium

Memahami dan Memperbaiki Kesalahan Umum JavaScript di Selenium

Saat web menggores dengan Selenium WebDriver, menemui kesalahan terkait JavaScript bukanlah hal yang jarang terjadi, terutama ketika berhadapan dengan elemen web dinamis seperti DOM bayangan. Salah satu kesalahan yang sering dihadapi pengembang adalah JavascriptException: Tidak dapat membaca properti null (membaca 'shadowRoot'), yang sering terjadi saat berinteraksi dengan elemen halaman yang kompleks.

Kesalahan ini biasanya muncul ketika Selenium tidak dapat mengakses atau berinteraksi dengan elemen di dalam a bayangan DOM, jenis struktur DOM terenkapsulasi unik yang digunakan oleh banyak situs web modern untuk modularitas yang lebih baik. Di Python, menggunakan Selenium untuk mengontrol browser bisa jadi rumit dengan elemen seperti itu.

Dalam konteks web scraping dari platform seperti Shopee, popup atau spanduk sering kali menggunakan shadow DOM, yang mungkin sulit ditutup secara terprogram. Masalah ini dapat menghambat kelancaran tugas otomatis dan mengganggu pengumpulan data.

Panduan ini akan memandu Anda menemukan solusi yang jelas untuk mengatasi masalah tersebut 'Tidak Dapat Membaca Properti Null' kesalahan dan memberikan pendekatan praktis untuk menutup popup yang tertanam dalam shadow DOM di Shopee menggunakan Python Selenium.

Cara Menangani Shadow DOM dan Popup di Selenium Web Scraping

Skrip yang disediakan di atas bertujuan untuk mengatasi masalah umum yang dihadapi dalam web scraping Selenium WebDriver saat berinteraksi dengan elemen shadow DOM. Shadow DOM adalah bagian halaman web yang beroperasi secara terpisah dari DOM utama, sering kali digunakan dalam komponen web yang kompleks. Dalam konteks situs scraping seperti Shopee, popup sering muncul di dalam shadow DOM, yang dapat menyebabkan kesalahan jika diakses dengan metode Selenium tradisional. Skrip pertama dirancang untuk menutup popup menggunakan eksekusi JavaScript eksekusi_skrip(), alat canggih yang memungkinkan Selenium menjalankan JavaScript mentah dalam konteks browser.

Tantangan utamanya adalah elemen di dalam shadow DOM tidak dapat diakses dengan perintah umum Selenium seperti temukan_elemen_oleh_xpath(). Sebagai gantinya, kami menggunakan JavaScript untuk melintasi shadow DOM menggunakan shadowRoot milik. Skrip ini menargetkan tombol tutup popup Shopee dengan terlebih dahulu mengakses elemen host bayangannya, lalu menanyakan struktur internalnya. Dengan memanfaatkan driver.execute_script(), skrip dapat memanipulasi dan menutup elemen di dalam DOM yang terisolasi ini. Solusi ini berfungsi dengan baik bila dikombinasikan dengan menunggu eksplisit untuk menangani elemen halaman dinamis yang dimuat secara asinkron.

Skrip kedua memperkenalkan WebDriverTunggu, alat penting untuk mengelola pengaturan waktu elemen halaman dinamis. Karena pop-up Shopee dimuat secara tidak sinkron, interaksi langsung dengan elemen-elemen ini dapat menyebabkan kesalahan. Untuk menghindari hal ini, WebDriverTunggu() memastikan bahwa elemen yang ingin kita berinteraksi sudah terisi penuh dan siap. Script ini menunggu kehadiran elemen DOM utama dan elemen DOM bayangan. Metodenya EC.presence_of_element_location() memastikan bahwa Selenium berinteraksi dengan elemen hanya setelah elemen tersebut terlihat dan ada, yang sangat penting untuk menghindari kesalahan referensi nol.

Di kedua skrip, kami menangani situasi kesalahan dengan a coba-kecuali blok untuk memastikan program tidak crash karena kesalahan yang tidak terduga, seperti elemen tidak ditemukan. Penanganan kesalahan sangat penting ketika menghapus situs web yang sering memperbarui strukturnya atau mengubah perilaku popup. Selain itu, skrip ini mengikuti praktik terbaik dengan menghentikan penggunaan sesi browser pengemudi.berhenti() setelah eksekusi untuk menghindari kebocoran memori atau masalah kinerja.

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()

Menangani Konten Dinamis dengan Selenium WebDriver

Aspek penting lainnya yang perlu dipertimbangkan ketika bekerja dengan Selenium WebDriver untuk web scraping adalah cara menanganinya konten dinamis yang terus diperbarui atau diubah setelah pemuatan halaman. Banyak situs web modern, seperti Shopee, menggunakan JavaScript untuk memuat dan memperbarui konten secara dinamis. Artinya, elemen pada halaman mungkin tidak langsung tersedia setelah halaman dimuat. Dalam kasus seperti itu, perilaku default Selenium dalam menunggu peristiwa pemuatan halaman mungkin tidak cukup. Menggunakan menunggu eksplisit seperti WebDriverTunggu dapat mengatasi masalah ini dengan menunggu elemen tertentu muncul atau dapat diklik.

Untuk menghapus situs dengan popup, spanduk, atau komponen UI kompleks yang diandalkan DOM bayangan, penting untuk mengetahui cara berinteraksi dengan mereka. Komponen ini menyembunyikan elemen dalam struktur DOM terisolasi yang tidak dapat diakses dengan metode tradisional seperti pemilih XPath atau CSS. Menggunakan eksekusi_skrip() perintah membantu menjembatani kesenjangan ini dengan memungkinkan Anda menjalankan JavaScript langsung di dalam browser, memberi Anda akses ke shadow DOM dan memungkinkan interaksi dengan elemen seperti tombol tutup atau kolom formulir di bagian halaman yang tersembunyi tersebut.

Selain itu, penanganan kesalahan menjadi penting dalam kasus seperti ini. Situs web sering kali dapat mengubah strukturnya, sehingga menyebabkan kerusakan. Penggunaan yang tepat coba-kecuali blok dengan Python memungkinkan Anda menangkap kesalahan seperti Pengecualian Javascript dan tangani dengan baik, pastikan scraper tidak mogok secara tidak terduga. Memasukkan logging untuk menangkap detail kesalahan dapat membantu mengidentifikasi akar permasalahan dan mengatasinya di masa mendatang.