前言

你在调试一个前端工程问题，页面表现异常。你让 AI 用浏览器工具帮你打开页面检查控制台有没有报错。

AI 打开页面扫了一圈。告诉你：控制台干干净净，没有任何错误。其实，

你将信将疑。自己用 Chrome 打开 DevTools——三条鲜红的报错赫然在列，页面其实已经白屏崩溃了。AI 明明用 Headless 浏览器访问了同一个页面为什么什么都没抓到？

这不是某个工具的 bug，也不是你的配置问题。这是一个藏在 Headless 浏览器设计深处的时序陷阱，过去几年里让无数开发者怀疑人生。它影响所有现代前端框架——React、Vue、SvelteKit、Next.js，无一幸免。

好消息是到了 2026 年，所有主流工具都已经给出了官方方法。 但在揭开答案之前，先让我们搞清楚一件事：这个错误到底是怎么“消失” 的？

再看问题重现。那个消失的错误

案发现场

一切看起来都正常：

1. 本地开发模式运行良好，建立部署也没问题。
2. 用普通 Chrome 打开，DevTools 控制台清晰地显示着红色错误。
3. 但用 Headless 工具访问时诡异的事情发生了：
   • agent-browser console 输出——空的
   • Puppeteer 的 page.on ——没触发
   • Selenium 的日志程序——一片空白

页面明明已经白屏崩溃，但这些工具异口同声地告诉你：“没有错误”。

不是你的错，是工具的时序缺陷

真相出人意料地简单：所有高层封装的 Headless 浏览器工具过去都把错误捕获代码放在了页面加载完成后才注入。

页面加载过程中- 在框架初始化、组件挂载、hydration 的几百毫秒里。你的错误捕获器还没就位，错误已经发生又消失了。

从问题本质来看，无法逾越的时序陷阱

精确的时间线分析

根本原因​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​ ​ ​​​ ​​​​​​​​​​​​​

Headless 浏览器必须在页面加载**之前**通过 CDP 调用 Runtime.enable  来打开 JavaScript 错误监听，否则早期抛出的异常会被“吞掉”。

几乎所有高级封装库直到最近才把这一步搬到 “navigation start” 之前执行。​​ ​​ ​​ ​ ​ ​ ​ ​ ​