AI 辅助前端发布前的 7 大关键用户旅程测试
AI 编程工具能快速生成可用网站,但手动点几下不能证明真实用户能完成任务。上线前必须从头到尾测试首屏加载、登录注册、核心功能、表单提交、文件上传、导航路由及权限会话这 7 条完整旅程。
DEV.to #vibecoding
CursorClaude Codev0Bolt
收录于 2026-10-31 · 原文发布于 Fri, 30 Oct 2026 02:26:01 +0000
要点
- 测试首屏与加载:检查桌面及移动端布局、刷新后是否可用、是否有空白屏或控制台错误。
- 测试注册与登录:验证表单必填项、错误凭据提示、注册成功后的跳转及刷新后会话是否保持。
- 测试核心功能:检查输入缺失时的拦截、加载/进度状态、失败提示以及防止重复点击提交。
- 测试表单与文件:验证特殊字符、字数限制、失败时保留已填内容、文件大小及类型限制、拖拽和点击上传。
- 测试权限与会话:检查未登录用户访问受保护页面的重定向、越权访问限制以及登出后是否无法访问受保护内容。
坑点
- 核心功能按钮被双击时提交了两次,导致重复记录
- 用户登出后依然能够访问需要账号权限的内容
.cursorrules
- Test all user journeys from start to finish before launching (First visit, Sign-up/login, Core feature, Form submission, File upload, Navigation, Permissions). - Prevent duplicate submissions on buttons (e.g., disable on submit or handle double-clicks). - Ensure proper validation, error messages, and loading/progress states for all forms and tasks. - Verify session persistence and access control for protected routes.
可复制提示词
请为 [页面/功能名称] 编写或完善前端代码,并确保通过以下测试:1. 首屏与移动端布局正常,刷新后可用;2. 表单和核心功能具备完整的输入验证、错误提示及加载/进度状态;3. 防止按钮被重复点击导致重复提交;4. 做好权限控制和路由重定向。请检查代码中是否存在未捕获的错误或漏洞。
#AI前端#VibeCoding#测试与避坑#用户旅程
相关方法
内容由 AI 依据原文翻译整理,细节以原帖为准;版权归原作者。