Кукловод: использование page.querySelectorAll () не является функцией

Question

Я работаю над сценарием Puppeteer, который делает скриншот всех элементов на странице.Это работает, но я не понимаю, почему не работает следующее:

const elements = await page.querySelectorAll('*');

(узел: 31953) TypeError: page.querySelectorAll не является функцией

Только это работает:

const elements = await page.$$('*');

Я пытаюсь избежать синтаксиса jQuery.Как я могу заставить работать querySelectorAll ('*')?Вот полный сценарий:

const puppeteer = require('puppeteer');

( async() => {
const browser = await puppeteer.launch( {
        headless: true } );
const page = await browser.newPage();
await page.goto( 'https://www.google.com' );

// Get a list of all elements. Why can't I use page.querySelectorAll('*')?
const elements = await page.$$('*');

for (let i = 0; i < elements.length; i++) {
  try {
    // get screenshot of a particular element
    await elements[i].screenshot({path: `${i}.png`})
  } catch(e) {
    // if element is 'not visible', spit out error and continue
    console.log(`couldnt take screenshot of element with index: ${i}. Because: `,  e)
  }
}
await browser.close();
} )();

Answer 1

Если вы отметите page.$$ в документации , вы обнаружите, что на самом деле кукловод работает querySelectorAll() на document.
Но если вы хотите

, избегайте синтаксиса jQuery.Как я могу заставить работать querySelectorAll ('*')

Решением было бы получить доступ к документу страницы и выполнить его там querySelectorAll()

const allElems = await page.evaluate(() => {
   // Note 1: here you can use querySelectorAll()
   // Note 2: eval can't return non-serializable data, so, you need to JSON.stringify() it to receive what you need. 
   return JSON.stringify(document.querySelectorAll())
})

Подробнее о оценка

Подводя итог, можно использовать селектор $$, поскольку это не стиль jQuery, а селектор DOM один.