javascript - 发送消息到 console.log (jest puppeteer)

Question

为什么我在 console.log 中看不到我的消息 page.evaluate、page.$、page.$$、 page.$eval，page.$$eval 并且无法访问变量吗？

let variable = 0;
const divColors = await page.evaluate(() => {
      const divs = Array.from(document.querySelectorAll('.map-filters div'));
      let text = divs.map((element, index) => {
        console.log(element.textContent)
        variable =1;
        return element.style.color;
      })
      return text;
    })

为什么在此示例中我无法执行 variable=1 和 console.log(element.textContent) 操作？

Answer 1

您在 page.evaluate 内部使用 console.log，因此它将其输出记录到 Chromium 浏览器而不是 Node 输出。要在 Node 控制台中查看来自浏览器的控制台消息，需要在创建 page 对象之后且在脚本中使用 console.log 之前订阅它们:

const page = await browser.newPage();

page.on('console', consoleObj => console.log(consoleObj.text()));

page.evaluate(...);

至于variable变量，实际上你的脚本中有两个。

第一个存在于 node.js 上下文中:

let variable = 0;

另一个 - 在网页上下文中:

page.evaluate( () => {
    variable = 1;
})

他们是完全不同的。将 page.evaluate 视为通往另一个世界的门户:那里存在的对象仅存在于 puppeteer 所在的 Web 浏览器中打开的页面上的 JavaScript 运行时内部驾驶。 node 有自己的运行时和自己的一组对象。

您可以将数据从 node 传递到 page.evaluate:

let variable = 420;

page.evaluate(variable => {

    // it is now passed here from outside
    console.log(variable) 

}, variable);