如何在Puppeteer循环中使用page.on("dialog")处理弹窗？

可以实现，核心解决思路是用page.once代替page.on绑定单次监听器，避免重复绑定导致的冲突。

正确实现方案 #

你更新2中的代码已经是可行的方案，核心逻辑为：每轮循环处理单个URL时，先确定当前页面对应的弹窗处理条件，再用page.once绑定dialog事件监听器，触发一次后监听器会自动销毁，不会残留到下一轮循环造成重复处理，最后再执行会触发弹窗的操作即可。
完整可运行示例如下：

const puppeteer = require("puppeteer");

let browser;
(async () => {
  const html = `<html><body><script>
    document.write(confirm("yes or no?") ? "confirmed" : "rejected");
  </script></body></html>`;
  browser = await puppeteer.launch({
    headless: true,
  });
  const [page] = await browser.pages();
  const urls = ["just", "a", "demo", "replace", "this"];

  for (const url of urls) {
    // 基于当前页面内容生成判断条件，可替换为实际业务逻辑
    const someCondition = Math.random() < 0.5;

    // 绑定单次dialog监听器，触发后自动销毁
    page.once("dialog", async (dialog) => {
      console.log(dialog.message());
      await (someCondition ? dialog.accept() : dialog.dismiss());
    });

    // 替换为实际的page.goto跳转逻辑
    await page.setContent(html);
    console.log(await page.$eval("body", (el) => el.innerText));
  }
})()
  .catch((err) => console.error(err))
  .finally(() => browser?.close());

关于是否需要将handler转为Promise的说明 #

如果你的后续逻辑不需要等待弹窗处理完成、不需要获取弹窗的返回内容，不需要转为Promise，直接用page.once绑定处理逻辑即可。
如果你需要等待弹窗处理结束再执行后续操作，才需要将监听器封装为Promise，示例如下：

for (const url of urls) {
  await page.goto(url);
  const someCondition = /* 基于当前页面内容生成的判断条件 */;

  // 封装为Promise等待弹窗处理完成
  const handleDialog = new Promise((resolve) => {
    page.once("dialog", async (dialog) => {
      const msg = dialog.message();
      await (someCondition ? dialog.accept() : dialog.dismiss());
      resolve(msg);
    });
  });

  // 触发弹窗后等待处理完成，再执行后续逻辑
  const dialogMsg = await handleDialog;
}

之前写法的错误原因 #

1. 循环内使用page.on绑定监听器：page.on会持续绑定监听器，每轮循环新增一个，弹窗触发时所有已绑定的监听器都会同时处理同一个Dialog实例，就会抛出Cannot dismiss dialog which is already handled!错误
2. 监听器移到循环外套URL循环：dialog事件只有弹窗触发时才会执行回调，此时循环已经执行完毕，无法匹配当前弹窗对应的URL条件，逻辑完全错位
3. 自定义页面内confirm监听器：页面上下文的监听器无法获取到Puppeteer封装的Dialog实例，自然不能调用dismiss/accept方法处理弹窗

内容的提问来源于stack exchange，提问作者Olek