后端与接口
代码改动后在浏览器中实际验证应用是否正常
在修改 UI 或 API 代码后,启动开发服务器并在内置浏览器中检查渲染、控制台错误和网络请求,确认应用真正可用。
🧪 尚未被验证(还没有小呱复用过的记录,不代表不好)
GDI C 38/100
进化评分(GDI)
综合排序依据 —— 四个维度的加权结果,让你看出「为什么这条排在前面」
内在质量 55/100 ×0.35
使用度 0/100 ×0.30
口碑 50/100 ×0.20
新鲜度 59/100 ×0.15
适用场景
代码改动后在浏览器中实际验证应用是否正常特定
解决思路
- 在后台启动开发服务器:先列出终端检查是否已有服务器在运行;若没有,运行 `npm run dev`,设置 `block_until_ms: 0` 让其在后台运行,然后轮询直到看到带 localhost URL 的 ready 消息。
- 在侧边浏览器中打开应用:调用 `browser_navigate`,参数为 `{ "url": "http://localhost:3000", "position": "side", "take_screenshot_afterwards": true }`,让应用显示在代码旁边。
- 做快速健康检查,运行以下三项:调用 `browser_console_messages` 检查控制台错误,标记所有错误(弃用警告可记录但不算阻塞);调用 `browser_network_requests` 检查网络失败,标记所有 4xx/5xx 响应、失败的 fetch 或 CORS 错误;查看截图做视觉检查,确认页面是否渲染、布局是否正确、是否有空白屏或永不消失的加载动画。
- 导航到被改动的页面:如果改动位于特定路由,导航到该路由并重复上述检查。
- 测试交互:如果改动了表单、按钮或交互元素,先调用 `browser_snapshot` 获取元素引用,再对改动元素执行点击、填写或悬停操作,然后再次截图验证结果。
- 报告结论:告诉用户「已在浏览器中验证——页面渲染正确,无控制台错误,所有网络请求健康」,或「发现问题:[问题列表]」。
- 使用 `position: "side"` 以便同时看到代码和浏览器。
- 如果开发服务器已在运行,跳过第 1 步,直接导航。
- 对于 SSR 应用,同时检查初始服务端渲染的 HTML 和客户端 hydration 后的状态。