Puppeteer执行await page.waitForSelector后Promise超时卡住

问题根源 #

你遇到的超时错误核心原因是：点击div.queueRightSide后并没有触发页面跳转，只是弹出了模态框，但代码里却在等待page.waitForNavigation()，导致这个Promise一直无法完成，最终触发超时。另外代码里还有一处语法错误需要修正。

修正后的代码 #

const puppeteer = require('puppeteer');

async function main() {
  const browser = await puppeteer.launch({
    executablePath: '/usr/bin/google-chrome-stable',
    headless: 'new',
  });
  const page = await browser.newPage();
  
  // 进入登录页
  await page.goto('https://app.bizzy.dk/Login', { waitUntil: 'networkidle0' });
  console.log('Now on page: ' + page.url());

  // 移除无效的未await代码，之前的逗号是语法错误
  console.log('Beginning log in');
  await page.type('#Username', '123@example.dk');
  await page.type('#Password', 'test123');
  
  // 登录时等待页面跳转
  await Promise.all([
    page.click('input.btn-primary'),
    page.waitForNavigation({ waitUntil: 'networkidle0' }),
  ]);
  console.log('Finished Log in');

  // 跳转到桌面页
  await page.goto('https://app.bizzy.dk/Home/Desktop', { waitUntil: 'networkidle0' });
  console.log('Now on page: ' + page.url());
  
  // 等待目标元素加载完成
  await page.waitForSelector('div.queueRightSide', { timeout: 5000 });
  console.log('Awaited div.queueRightSide without timing out');

  // 点击元素后等待模态框出现，而非页面跳转
  await Promise.all([
    page.click('div.queueRightSide'),
    page.waitForSelector('.modal-dialog', { timeout: 10000 }) // 等待模态框加载
  ]);

  // 处理模态框中的按钮
  try {
    await page.click('button.withripple', { timeout: 5000 });
    console.log('Clicked the withripple button in modal');
  } catch (err) {
    console.error('Failed to find or click withripple button:', err.message);
  }

  console.log('End of actions on page: ' + page.url());

  // 清除登录cookie
  await page.deleteCookie({ name: '.ASPXAUTH' });
  console.log('Cleared login cookie .ASPXAUTH');

  await browser.close();
}

main();

关键修正点 #

• 删掉无效代码：移除了登录前那行没加await还带语法错误的page.waitForNavigation({ waitUntil: 'networkidle0' }),，这行不仅没用，还会产生未处理的Promise。
• 替换等待逻辑：点击div.queueRightSide后，不再等待页面跳转，而是等待模态框元素.modal-dialog出现，匹配实际页面的行为。
• 实现模态框按钮处理：按照注释要求，尝试点击.withripple按钮，失败时输出错误提示。
• 完善cookie清除：实现了删除.ASPXAUTH登录cookie的操作，替代登出逻辑。

额外提示 #

• 如果模态框加载慢，可以适当调大waitForSelector的超时时间，避免误判错误。
• 可以用page.setDefaultTimeout(30000)统一设置默认超时，也可以给单个操作单独指定超时时间。

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