需启用f12 recorder功能：一、通过settings→experiments启用enable recorder并重启；二、点击recorder标签→new recording命名后启动；三、stop后可编辑步骤并save为json；四、选录制项后play重放或step over单步调试；五、export为puppeteer脚本用于ci集成。
如果您希望在谷歌浏览器中通过开发者工具的“记录”面板自动捕获并回放用户交互行为，以支持手动验证或轻量级自动化测试场景，则需启用并操作F12 Recorder功能。以下是具体操作步骤：
一、启用Recorder面板
Recorder功能默认未在开发者工具侧边栏显示，需先通过设置开启实验性功能入口。该步骤确保Recorder面板可被访问和使用。
1、在谷歌浏览器中按 F12 打开开发者工具。
2、点击右上角三个点图标，选择 Settings（设置）。
3、在左侧菜单中选择 Experiments（实验性功能）。
4、在搜索框中输入 recorder，勾选 Enable Recorder 选项。
5、关闭设置页，重启开发者工具（关闭再按F12重新打开）。
二、创建并启动新录制
启用后，Recorder面板将出现在开发者工具顶部标签栏，用于定义录制范围、命名任务并开始捕获用户操作序列。
1、点击开发者工具顶部的 Recorder 标签。
2、点击左上角 + New recording 按钮。
3、在弹出窗口中为录制命名，例如 Login Flow，并可选择是否包含鼠标移动事件（建议取消勾选以减少冗余）。
4、点击 Start recording 按钮。
5、在页面中执行目标操作，如点击按钮、填写表单、跳转链接等。
三、停止并保存录制脚本
停止录制后，系统会生成结构化操作列表，支持查看、编辑与导出，为后续重放提供基础数据。
1、点击Recorder面板右上角的 Stop 按钮（红色方块图标）。
2、录制的操作将按时间顺序显示在主区域，每条记录含动作类型、目标元素、触发方式（如click、input）。
3、可点击任意步骤左侧的三点图标，选择 Edit step 修改选择器或延时参数。
4、点击右上角 Save 图标，将录制保存至本地JSON文件。
四、重放已录制的操作流程
重放功能可完整复现用户交互路径，适用于回归验证或快速演示，支持单步执行与全量运行两种模式。
1、在Recorder面板中，从左侧录制列表选择已保存的录制项。
2、点击面板顶部的 Play 按钮（绿色三角形）启动全量重放。
3、如需调试，点击 Step over（单步执行）按钮，逐条触发操作并观察页面响应。
4、重放过程中，当前执行步骤会在列表中高亮显示，失败步骤将标红并提示原因（如元素不可见、超时）。
五、导出为Puppeteer脚本
Recorder支持将操作序列转换为可执行的Node.js代码，便于集成至CI流程或扩展为完整自动化测试用例。
1、在Recorder面板中选中目标录制项。
2、点击右上角 Export 图标（向下箭头）。
3、选择导出格式为 Puppeteer script (.js)。
4、保存生成的JS文件，该文件已内置浏览器启动、页面导航、等待策略及操作调用逻辑。
