Playwright locator.click()在CI环境超时但调用日志显示执行正常

我有一个仅在CI环境中失败的不稳定Playwright测试。启用追踪输出后检查失败的click操作，发现一切看似正常——click操作似乎已完成任务，且调用日志与成功测试完全一致：

TimeoutError: locator.click: Timeout 10000ms exceeded.
Call log:
  - waiting for getByTestId('outlinerNode.17126087311408424225')
  -   locator resolved to <div data-testid="outlinerNode.17126087311408424225" class="sc-bczRLJ sc-gsnTZi sc-eCqeQn inzphK egGwwM ixijrF">…</div>
  - attempting click action
  -   waiting for element to be visible, enabled and stable
  -   element is visible, enabled and stable
  -   scrolling into view if needed
  -   done scrolling
  -   performing click action

（附Trace Viewer截图）

为何在所有操作看似正常的情况下，该click操作仍会超时？

可能的原因及解决方向 #

• CI环境资源受限：CI机器的CPU、内存往往不如本地开发机充裕，页面渲染、JS执行或事件处理速度变慢。Playwright的click操作不仅执行点击动作，还会默认等待点击触发的后续行为（如页面跳转、组件状态更新、API请求完成），若这些后续操作在超时时间内未完成，就会抛出TimeoutError，即便点击本身的步骤都显示完成。
• 动态元素遮挡：日志显示元素可见，但CI环境中可能存在动态加载的浮层、弹窗或z-index更高的元素，在点击瞬间临时遮挡目标元素，导致点击实际未生效，测试因等待预期状态超时失败。这种瞬间遮挡可能无法被Trace Viewer完整捕捉。
• 事件绑定延迟：目标元素的点击事件可能是异步绑定的，CI环境中JS执行速度慢，点击动作完成时事件还未挂载，导致点击没有触发预期逻辑，测试后续等待状态超时。
• 等待策略不匹配：locator.click()默认会等待页面稳定或导航完成，若点击后页面有长时间的异步操作（如大文件加载、复杂计算），超出默认超时时间就会报错。可以调整等待策略，比如使用{ waitFor: "commit" }等待DOM提交，或{ waitFor: false }禁用自动等待（需确保后续测试逻辑能处理未完成的状态）。
• 浏览器环境差异：CI环境使用的浏览器版本、启动参数可能和本地不同，部分浏览器在资源受限环境下的事件处理存在兼容性问题，导致点击未触发预期效果。

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