使用WaitForRequestFinishedAsync为何触发TimeoutException？

问题根源 #

WaitForRequestFinishedAsync的作用是等待页面上所有正在进行的网络请求完成，如果你的点击操作没有触发任何网络请求，或者请求在你调用该方法前已经完成，就会触发超时错误。它并不是用来等待UI操作完成的通用方法。

正确的替代方案 #

根据你的实际场景选择对应的等待方式：

• 等待UI元素状态变化
  Playwright的ClickAsync本身就会自动等待元素可点击。如果点击后需要等待某个UI元素加载完成（比如弹窗、列表项），直接针对目标元素使用WaitForAsync：

  await page.Locator(".my-class").ClickAsync();
  // 等待目标元素可见
  await page.Locator(".target-loaded-element").WaitForAsync(new LocatorWaitForOptions { State = WaitForSelectorState.Visible });
  

• 等待特定网络请求完成
  如果点击后确实会发起网络请求，必须先注册请求监听，再执行点击，避免因请求完成过快导致监听失效：

  // 先监听目标请求（根据URL或其他特征匹配）
  var targetRequest = page.WaitForRequestFinishedAsync(req => req.Url.Contains("/api/your-endpoint"));
  // 执行点击操作
  await page.Locator(".my-class").ClickAsync();
  // 等待监听的请求完成
  await targetRequest;
  

• 放弃滥用Thread.Sleep()
  Playwright内置了自动等待机制（等待元素可交互、DOM稳定、网络空闲等），绝大多数场景下不需要手动Sleep。只有极特殊情况（比如动画过渡）可使用短时间的Task.Delay()替代Thread.Sleep()（避免阻塞线程）。

排查步骤 #

1. 打开浏览器开发者工具的Network面板，确认点击.my-class后是否有网络请求发起。
2. 如果有请求，检查请求的完成时间，是否在点击操作后立即完成，导致WaitForRequestFinishedAsync调用时已无待处理请求。

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