发送消息给 console.log（开玩笑的人偶）

Question

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

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 浏览器而不是节点输出。要在节点的控制台中查看来自浏览器的控制台消息，需要在创建 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 视为通往另一个世界的门户：存在的对象仅存在于 javascript 运行时内部，在 puppeteer 驱动的网络浏览器中打开的页面上。 node 有自己的运行时和自己的对象集。

您可以将数据从 node:

传递到 page.evaluate

let variable = 420;

page.evaluate(variable => {

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

}, variable);

发送消息给 console.log（开玩笑的人偶）

Send message to console.log (jest puppeteer)

javascript

node.js

jestjs

puppeteer