执行 JavaScript

Playwright 脚本在您的 Playwright 环境中运行。您的页面脚本在浏览器页面环境中运行。这些环境不相交，它们在不同进程中的不同虚拟机中运行，甚至可能在不同的计算机上运行。

page.evaluate(pageFunction[, arg]) API 可以在网页的上下文中运行 JavaScript 函数，并将结果带回 Playwright 环境。像 window 和 document 这样的浏览器全局变量可以在 evaluate 中使用。

const href = await page.evaluate(() => document.location.href);

如果结果是 Promise 或函数是异步的，evaluate 将自动等待直到它解析：

const status = await page.evaluate(async () => {
  const response = await fetch(location.href);
  return response.status;
});

执行参数

Playwright 执行方法，如 page.evaluate(pageFunction[, arg])，接受单个可选参数。此参数可以是 Serializable 值与 JSHandle 或 ElementHandle 实例的混合。句柄会自动转换为它们表示的值。

// 原始值。
await page.evaluate(num => num, 42);

// 数组。
await page.evaluate(array => array.length, [1, 2, 3]);

// 对象。
await page.evaluate(object => object.foo, { foo: 'bar' });

// 单个句柄。
const button = await page.evaluate('window.button');
await page.evaluate(button => button.textContent, button);

// 使用 elementHandle.evaluate 的替代符号。
await button.evaluate((button, from) => button.textContent.substring(from), 5);

// 具有多个句柄的对象。
const button1 = await page.evaluate('window.button1');
const button2 = await page.evaluate('window.button2');
await page.evaluate(
    o => o.button1.textContent + o.button2.textContent,
    { button1, button2 });

// 对象解构有效。请注意，解构对象和参数之间的属性名称必须匹配。
// 另请注意所需的括号。
await page.evaluate(
    ({ button1, button2 }) => button1.textContent + button2.textContent,
    { button1, button2 });

// 数组也有效。任意名称可用于解构。
// 请注意所需的括号。
await page.evaluate(
    ([b1, b2]) => b1.textContent + b2.textContent,
    [button1, button2]);

// 任何非循环的可序列化和句柄混合都有效。
await page.evaluate(
    x => x.button1.textContent + x.list[0].textContent + String(x.foo),
    { button1, list: [button2], foo: null });

正确：

const data = { text: 'some data', value: 1 };
// 将 |data| 作为参数传递。
const result = await page.evaluate(data => {
  window.myApp.use(data);
}, data);

错误：

const data = { text: 'some data', value: 1 };
const result = await page.evaluate(() => {
  // 网页中没有 |data|。
  window.myApp.use(data);
});