手动按Esc可关闭DOM外Chrome提示，Puppeteer调用无效的原因与解决

核心问题分析 #

这类DOM外提示框（比如Slack登录后弹出的"打开桌面应用"提示），本质是浏览器级别的交互元素或Slack的非标准弹窗，Puppeteer默认的页面按键事件无法直接作用于这类元素——它们不属于主页面DOM上下文，但手动操作有效是因为浏览器会将全局按键事件传递给当前活跃的弹窗。

可行解决方案 #

1. 等待提示框加载完成再执行按键

原代码中waitForNavigation完成后立即按Esc，可能提示框还未完全渲染，添加短暂等待确保弹窗出现：

await page.waitForNavigation();
// 等待弹窗加载，根据网络情况调整时长
await page.waitForTimeout(1500);
await page.keyboard.press('Escape');

2. 模拟完整的按键按下/释放流程

部分场景下page.keyboard.press的封装不够完整，手动拆分按键事件更贴近真实操作：

await page.waitForNavigation();
await page.waitForTimeout(1500);

await page.keyboard.down('Escape');
// 短暂间隔模拟真实按键节奏
await page.waitForTimeout(100);
await page.keyboard.up('Escape');

3. 通过CDP直接发送全局按键事件

利用Chrome DevTools Protocol（CDP）绕过页面DOM限制，直接向浏览器发送按键指令：

await page.waitForNavigation();
await page.waitForTimeout(1500);

const client = await page.target().createCDPSession();
// 发送Esc键按下事件
await client.send('Input.dispatchKeyEvent', {
  type: 'keyDown',
  key: 'Escape',
  windowsVirtualKeyCode: 27
});
// 发送Esc键释放事件
await client.send('Input.dispatchKeyEvent', {
  type: 'keyUp',
  key: 'Escape',
  windowsVirtualKeyCode: 27
});

4. 彻底禁用提示弹窗（推荐）

通过浏览器配置或修改本地存储，让Slack不再弹出该提示：

• 方法一：启动浏览器时禁用PWA相关提示

const browser = await puppeteer.launch({
  args: [
    '--disable-features=DesktopPWAs', // 禁用桌面应用提示
    '--no-default-browser-check' // 跳过默认浏览器检查
  ]
});

• 方法二：设置本地存储标记
  登录后添加localStorage项，让Slack记住选择"在浏览器中使用"：

await page.waitForNavigation();
await page.evaluate(() => {
  // 对应Slack存储提示状态的键，可通过浏览器DevTools确认
  localStorage.setItem('desktop_app_prompt_dismissed', 'true');
});

原代码补充优化 #

原代码中browser.close()未使用await，会导致浏览器在操作完成前提前关闭，应修改为：

await browser.close();

内容的提问来源于stack exchange，提问作者Mix Master Mike