使用 Puppeteer 覆盖 showOpenFilePicker

问题描述

如此处 here 所示，Puppeteer 允许覆盖 Javascript 函数。我想覆盖 showOpenFilePicker 函数。即当网页调用 showOpenFilePicker 时。我想在 showOpenFilePicker 之前运行另一个函数。

const puppeteer = require("puppeteer");

(async () => {
  const browser = await puppeteer.launch({ headless: false });
  const page = await browser.newPage();

  await page.evaluateOnNewDocument(() => {
    Object.defineProperty(HTMLCanvasElement.prototype,"toBlob",{
      value: () => {
        console.log("hey there");
      },});
  });

  await page.goto("https://example.com");

  await page.evaluate(() => {
    console.log(HTMLCanvasElement.prototype.toBlob.toString());
  });

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

解决方法

您可以像下面的代码示例一样覆盖 Puppeteer 中的内置函数。这将原始函数替换为将参数记录到控制台的覆盖。

const puppeteer = require("puppeteer");

(async () => {
  const browser = await puppeteer.launch({ headless: false });
  const page = await browser.newPage();

  await page.evaluateOnNewDocument(() => {
    const originalShowOpenFilePicker = window.showOpenFilePicker;
    window.showOpenFilePicker = (...args) => {
      console.log('Modified `showOpenFilePicker` called with these arguments:',args);
      return originalShowOpenFilePicker(...args);
    };
  });

  await page.goto("https://example.com");

  await page.evaluate(() => {
    console.log(showOpenFilePicker());
  });

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