Return a list of divs with the same selector using puppeteer

user_15223520 0
Viewed 399

I am trying to get a list of divs using puppeteer but my code returns an empty array.

From this site, I am trying to retrieve the list of all cars.

https://master.d1v85iiwii35dx.amplifyapp.com/

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://master.d1v85iiwii35dx.amplifyapp.com/');
  console.log('.....going to url')
  const feedHandle = await page.$('.car-list-parent');

 const arr= await feedHandle.$$eval('.car-list-child',(nodes)=>nodes.map(n=>
            {
               
                return n
            }))

  await browser.close();
})();
puppeteer node.js javascript
1 Answers

Unfortunately, .evaluate() or .$$eval() and similar ones can only transfer serializable values (roughly, the values JSON can handle). As DOM elements are not serializable (they contain methods and circular references), each element in the collection is replaced with an empty object or undefined. You need to return either serializable value (for example, an array of texts) or use something like page.evaluateHandle() and JSHandle API.

The first option:

const arr= await feedHandle.$$eval(
  '.car-list-child',
  nodes => nodes.map(n => n.innerText)
);
console.log(arr);
user_26255600
Related