# 专项训练图文编辑验收（2026-10-22）
## 变更
- 正文由 HTML 文本框改为可视化编辑器：加粗、斜体、下划线、小标题、正文、两种列表、引用、清除格式、撤销和重做。
- 支持多选、粘贴、拖入图片；一批最多 20 张，单张最大 10 MiB，GIF 最大 2 MiB。
- 正文图片不裁切。小图保留原文件，大图等比例缩至最长边 2000 像素并压缩到现有 inline 上传接口的容量范围内；GIF 保留动画，不静态化压缩。
- 复用已存在的 inline 图片上传接口，不让正文上传依赖可选的 S3 配置。封面仍单独按 4:3 裁切。
- 上传期间锁定正文、保存、预览和关闭；按文件显示进度。单张失败不丢弃其他成功图片，展示文件名及错误并允许重新选择失败图片。
- 预览增加等待状态；修正动态 HTML 图片未受组件样式约束的问题，避免预览超宽。
## 验证结果
| 项目 | 结果与证据 |
| --- | --- |
| 自动化测试 | ChromeHeadless 33 项通过，包含正文编辑、图片准备、页面保存及 OperationsService。 |
| 图片处理 | 比例保留、大图缩放、格式与大小校验、损坏文件拒绝通过。 |
| 编辑交互 | 光标处顺序插入多图、父组件回写不丢光标、加粗及原生撤销、HTML 安全渲染、纯文字粘贴、忙碌状态锁定通过。 |
| 失败分支 | 单张失败保留其他成功图片；保存失败保留草稿；标题和原因校验、超过 20 张拒绝通过。 |
| 实际浏览器上传 | localhost:4300 前端连接 server.xiaoshu.pro 后端，以现有管理员登录，粘贴两张测试 PNG 并真实上传。两张图片均加载成功，分别为 32×48、64×32。 |
| 创建并回读 | 保存未发布草稿后重新打开，两张图片的 URL、标题排版和标签完整，首图自动作封面。 |
| 二次编辑 | 修改简介并再次保存、重新打开，更新内容完整；仍为草稿。 |
| 服务端预览 | 返回并显示标题、简介、小标题及两张图片；两张图片 naturalWidth 均大于 0。 |
| 窄屏与键盘 | 375×812 下工具栏换行；抽屉 clientWidth/scrollWidth 均为 375，正文均为 325；工具按钮可通过 Tab 聚焦，焦点框可见。 |
| 生产构建 | npm run build:admin 成功；有既有样式预算及 CommonJS 警告。 |
| 差异检查 | git diff --check 通过。 |
测试命令：
```sh
npm run test:admin:ci -- --include='**/training-*.spec.ts' --include='**/operations-special-training.component.spec.ts' --include='**/operations.service.spec.ts'
npm run build:admin
git diff --check
```
## 真实验收记录及边界
- 保留草稿：`【验收草稿】专项多图编辑 20261022`，展示 ID `839154386020572`。仅含测试色块和验收说明，没有发布到学生端。
- 实际媒体地址：`https://a018.2018.z01.com/UploadFiles/System/wxapp/images/20261022/165750953261.png`、`https://a018.2018.z01.com/UploadFiles/System/wxapp/images/20261022/165735933633.png`。
- 过程中一次上传触发现有 20 秒请求超时，正文及成功图片保留。最终两张上传、保存、二次编辑、预览均成功。这不证明旧媒体服务的持续稳定性，未以延长所有接口超时掩盖该现象。
- 浏览器扩展未开启本地文件 URL 访问，自动化的原生文件选择器 setFiles 被阻止。已确认选择器允许多选，批量处理由 ChromeHeadless 测试覆盖；真实后端上传使用粘贴图片完成。用户手动多选仍需操作复核。
- 本次未执行正式发布/下架、学生端或微信 WebView 验收，也未进行视频文件上传实测。视频仍使用原有 S3 预签名流程，不能将本次图文验收外推为视频已通过。
- 本次修改管理端并同步 Git，没有部署公网管理站或替换云函数。
## 截图
