page.evaluate()返回空对象

Question

我正在尝试刮这个网页https://poe.ninja/challenge/builds?time-machine=day-6使用木偶。我试过Puppeteer page.evaluate querySelectorAll return empty objects，在这里看到了很多类似的问题。但他们都解决不了我的问题。

这是我的代码：

const scrapeNinja = async () => {
    const browser = await puppeteer.launch({headless: false})

    const page = await browser.newPage()

    await page.goto(`https://poe.ninja/challenge/builds?time-machine=day-6`, {
        waitUntil: 'domcontentloaded',
    })

    const getArray = await page.evaluate(() => {
        return Array.from(document.querySelectorAll(
                '#openSidebar > div > section:nth-child(3) > div > div > div > ul li .css-1h2ruwl'
            )).map(e => e.textContent)
    })

    console.log(getArray)
}

我知道从page.evaluate返回的值应该是可序列化的。这个Array.from(document.querySelectorAll('#openSidebar > div > section:nth-child(3) > div > div > div > ul li .css-1h2ruwl')).map(e => e.textContent)不是一个可序列化的值吗？我试着在dev工具部分使用它返回我想要的内容，但是返回到node.js，它只返回空数组.

我做错什么了吗？

Answer 1

看起来问题在于等待，即使完整的dom内容没有完全加载，您也在寻找元素。

  const scrapeNinja = async () => {
  const browser = await puppeteer.launch({headless: false})

  const page = await browser.newPage()

  await page.goto(`https://poe.ninja/challenge/builds?time-machine=day-6`, {
    waitUntil: 'networkidle2',
  })
  

  const getArray = await page.$$eval('#openSidebar > div > section:nth-child(3) > div > div > div > ul li .css-1h2ruwl',
    el => el.map(item => item.textContent))

  console.log(getArray)
}

scrapeNinja()

这段代码非常适合我，甚至不需要初始化数组。将来使用networkidle2中的waitUntil选项