Chrome 浏览器扩展 - Web 应用测试辅助工具
一款专为 Web 测试人员设计的 Chrome 扩展，通过元素选择和流程录制两种工作流，快速生成结构化的测试问题报告，并内置 AI 深度分析提示词。
点击页面元素 → 选择分类 → 填写描述 → 保存问题
适用于：UI 样式问题、元素显示异常、定位相关的 Bug
录制操作日志 + 元素点击顺序 → 执行页面操作 → 填写描述 → 保存问题
适用于：功能流程缺陷、操作断链、数据异常、性能卡顿
除控制台/网络日志外，还会记录用户操作序列（点击顺序），即使页面无日志输出，也能还原完整操作路径。
面板右上角「🗑」按钮可一键清空所有已记录问题，无需卸载扩展或刷新页面。
- 按页面分组：同一页面的问题自动归类
- 全局编号：问题跨页面连续编号
- 日志独立：每个问题携带自己的操作日志与操作序列
- AI 提示词：内置融合四大专业技能方法论的深度分析提示词
- 复制 Markdown 到剪贴板（点击「生成测试报告到粘贴板」后自动复制）
- 下载
.md文件 - 下载
.zip压缩包（纯 JS 实现，无外部依赖）
问题不再按主观类型划分，而是标注修改级别，帮助 AI 快速判断处理深度与所需资料：
| 级别 | 说明 |
|---|---|
| 🎨 前端修改 | 仅前端 UI/样式/交互调整，不涉及后端接口与业务流程变更 |
| 🔧 后端/业务流程 | 涉及后端接口、业务逻辑或数据流程的变更 |
| 🏗️ 模块重做 | 问题根源在架构层面，需整个模块重构或大范围整改 |
| ✨ 新需求 | 现有能力无法满足，需要新增功能或能力扩展 |
元素问题与流程问题共用同一套修改级别分类，仅采集方式不同。
- 克隆或下载本仓库
- 打开 Chrome 浏览器，访问
chrome://extensions/ - 开启右上角「开发者模式」
- 点击「加载已解压的扩展程序」
- 选择项目目录
QTest
- 在任意网页上点击扩展图标，打开悬浮面板
- 选择工作流：
- 元素问题：点击页面元素进行标记
- 流程问题：开始录制后执行操作（自动记录日志 + 点击顺序）
- 选择修改级别、填写问题描述
- 可重复添加多个问题
- 点击「📋 生成测试报告到粘贴板」→ 自动复制到剪贴板
- 需要重来时，点击右上角「🗑」一键清空
# 🐛 测试问题报告
**生成时间:** 2026-07-22 10:30:00
**问题总数:** 5
**涉及页面:** 2
---
## 📄 /dashboard
> https://example.com/dashboard
### 1. 图表数据不刷新 _🔧 后端/业务流程_
**元素:**
- `//*[@id="chart-container"]`
### 2. `流程` 提交订单无反应 _🏗️ 模块重做_
**操作序列** (3步):
1. `click` "选择商品" — `//*[@id="sku-1"]`
2. `change` <input> — `//input[@name="qty"]`
3. `click` "提交订单" — `//*[@id="submit"]`
**操作日志** (3条/1错误, 2请求/0失败):
| 时间 | 级别 | 内容 |
|------|------|------|
| 10:28:15 | error | `Cannot read property 'data' of null` |
---
## 🤖 AI 分析提示词
> 将提示词复制到 AI 对话中，获取深度分析报告报告自动生成一段研究式分析提示词，将以下方法论内联嵌入，接收分析的 AI 无需预装技能即可遵循：
| 技能 | 融入的方法论 |
|---|---|
| prjm（AI 项目管家） | 防幻觉铁律（先事实后结论）、变更前影响分析、多方案对比 |
| darc（产品架构师） | 同类问题全排查、复用扫描、避免重复实现 |
| reqa（需求设计） | 新需求 → 概念设计（业务流程、模块边界、对外接口、依赖方向） |
| uxqa（体验质量官） | UI 宏观架构 + 微观元素双维评定、量化尺寸推理 |
提示词结构：
- ⛔ 铁律：先事实后结论、结论可追溯、用户反馈优先
- 按修改级别决定研究深度：L1/L2/L3/L4 映射不同分析路线
- 变更前三思·影响分析：资料收集 → grep 真实调用点 → 波及面评估
- 统一分析链路：组件树定位 → 数据流追踪 → 交互链路 → 依赖分析 → 根因定位 → 方案设计
- 同类问题全排查：孤立点 vs 模式，横向排查一次性整改
- UI 双维评定 + 量化尺寸推理
- 修改方案：多方案对比 + 跨模块清单 + P0/P1/P2 优先级
| 技术 | 说明 |
|---|---|
| Chrome Extension Manifest V3 | 扩展规范 |
| Content Script | 注入悬浮面板到页面 |
| XPath | 元素定位 |
| MutationObserver | DOM 变化监控 |
| postMessage | 日志拦截通信 |
| Pure JS ZIP | 无依赖 ZIP 打包 |
QTest/
├── manifest.json # 扩展配置 (MV3)
├── background.js # Service Worker
├── content.js # 核心逻辑 + 悬浮面板
├── content.css # 悬浮面板样式
├── popup.html/css/js # 扩展弹窗
├── report.html/css/js # 历史报告查看页
├── icons/ # 扩展图标
└── .gitignore
- 支持截图附件
- 历史报告云同步
- 团队协作共享报告
- 自定义问题分类
- 导出为 Jira/禅道格式
MIT
Qoder Test Helper - 让测试报告更高效 🚀