将 thunk 传递给 puppeteer 的 $.eval

Question

函数 setValue 接收一个值，returns 接收一个函数。在第二个函数中，我试图通过控制台记录 value 的值，但我得到

Error: Evaluation failed: ReferenceError: value is not defined

我的代码如下。它可以在 try-puppeteer 上进行测试，只需复制并粘贴我的代码并删除 require 语句即可。

const puppeteer = require('puppeteer');

(async () => {
  const USERNAME = 'helloworld';
  const setValue = (value) => (input) => { console.log(value) };

  const browser = await puppeteer.launch();
  const page = await browser.newPage();

  await page.goto('http://example.com');
  await page.$eval('.selector', setValue(USERNAME));

  await browser.close();
})();

Answer 1

这是在 Node.js 中执行并在浏览器中评估代码（Protractor、TestCafe、Nightmare 等）的任何库的常见问题。函数被字符串化并作为字符串传递给浏览器。 (input) => { console.log(value) } 的原始作用域丢失，value 应该是全局的，这是未定义的。

如 the documentation 所述，应该将额外的参数传递给 $eval。

应该是：

await page.$eval('.selector', (el, value) => { console.log(value) }, USERNAME);

console.log 会工作，但显然不会在 Node 控制台中显示任何内容，因为它指的是浏览器控制台。

将 thunk 传递给 puppeteer 的 $.eval

Passing a thunk to puppeteer's $.eval

javascript

node.js

google-chrome-headless

puppeteer