I get an error when an image is missing during my Puppeteer scraping runs. How can I safely handle null image results?
for (let i = 0; i < 3; i++) {
let data = await page.evaluate(() => {
let header = document.querySelector('h2').textContent
let content = document.querySelector('.entry-body').innerText
let imgElem = document.querySelector('.photo-container img')
let imgUrl = imgElem ? imgElem.getAttribute('src') : 'No Image'
return { header, content, imgUrl }
})
console.log(data)
}
In my experience, I found that handling missing elements can be significantly improved by moving the error handling into a separate function outside of the page.evaluate context. I created a helper method that checks for null results when querying elements and returns a default image URL before continuing with further processing. This not only cleans the main evaluation logic but also centralizes error handling, making it easier to debug inconsistencies when scraping. Adopting this layered approach has improved the reliability of my scrapers without overly complicating the code.
hey, try wrapping the image access in a try/catch inside the evaluate so it never errors out. if no img, return a default value. it’s a safe fallback that checks element existence properly, stopping your scraper from crashing sometimes.
Another method that worked well for me involves using optional chaining directly within the page.evaluate call. I modified my script to check if the element exists before accessing its src property. This prevents any runtime errors when an image is missing. I also found it helpful to return a descriptive message for missing images, as it aids in debugging possible layout changes on the target page. This method has made my puppeteer scraping more robust without significantly increasing the code complexity.