52 lines
4.2 KiB
Markdown
52 lines
4.2 KiB
Markdown
|
# SiteForge V8.21.1 — 可视化编辑器体验增强
|
||
|
|
|
||
|
|
状态：`8.21.1-dev.1`，在 V8.21 源码基础上做前端编辑器的向后兼容升级。
|
||
|
|
|
||
|
|
## 已实际开发的内容
|
||
|
|
|
||
|
|
1. **页面区块面板**：按标题、类型、嵌套区块内容搜索；拖拽排序继续保留；新增上/下移动、显隐、复制和删除快捷操作；支持 Alt+↑/↓ 按键移动聚焦的结构行。
|
||
|
|
2. **属性分区**：从单一长滚动面板拆分为「内容」「样式」「响应式」，多列布局与平板/手机跨度和显隐均放在响应式面板。
|
||
|
|
3. **PC/平板/手机预览**：桌面自适应宽度、平板 780px、手机 390px；展示明确设备标签，窄屏可分别展开区块侧栏和属性侧栏。
|
||
|
|
4. **页面刷新安全性**：所有预览请求使用 `AbortController` 取消上一个请求，并通过请求序号和页面 ID 双重核对；旧请求不得覆盖新预览。
|
||
|
|
5. **草稿可靠保存**：调用保存接口前冻结请求数据，写入过程中若发生额外本地修改不会错误清除 dirty 标志；同一时间仅处理一项保存请求，页面切换时阻止混淆。
|
||
|
|
6. **撤销与重做**：历史操作按钮可用状态实时更新；连续输入编辑合并短时间内的快照，提供 Ctrl/Cmd+S 快捷保存（前端输入框内保留浏览器默认编辑撤销行为）。
|
||
|
|
7. **顶部操作层级**：保留高频保存/发布操作，低频的版本历史、全站设计、构建等放入「更多操作」菜单。移动端保存按钮仍可见。
|
||
|
|
8. **测试辅助**：纯函数 `editor-helpers.js` 以 Node Test Runner 检验，新增浏览器烟测脚本（需要运行环境允许本机 HTTP）和可离线打开的静态交互演示。
|
||
|
|
|
||
|
|
## 安全与兼容约束
|
||
|
|
|
||
|
|
- 不修改已有页面 `blocks` JSON 数据模型、不新增生产数据库迁移；旧页面和已有 V8.21 草稿可以继续使用。
|
||
|
|
- 仍使用原有 `PUT /studio-draft` 的 `expected_revision` 乐观锁、发布接口、站点权限及审批逻辑。页面草稿保存不会自动发布静态网站。
|
||
|
|
- 编辑器 iframe 仍使用 `sandbox="allow-scripts"`，未添加 `allow-same-origin`。UI 表单不执行用户自定义代码。
|
||
|
|
- **没有**实现无限自由定位、Figma 式像素编辑、复杂组件级协作锁、跨页面模板继承或官方 Art Design Pro 全工程真实编译。相关模块需要后续专项开发。
|
||
|
|
|
||
|
|
## 本次验证结果
|
||
|
|
|
||
|
|
- JavaScript 纯函数：6/6 通过（`node --test tests_js/editor_ux.test.cjs`）。
|
||
|
|
- Python 编辑器专项和既有历史/映射：9/9 通过；新静态界面测试：3/3。
|
||
|
|
- 现有 39 个 Python 测试模块**分段或独立运行**，累计 328 个用例通过；其中前六批计 215 项、批次 7 拆分运行计 26 项、余下独立模块 87 项。
|
||
|
|
- HTTP + Worker 实际建站构建：通过（隔离临时 SQLite 环境）。
|
||
|
|
- Python 编译、全部 `app/static/*.js` 语法校验、工程静态发布检查：通过。
|
||
|
|
- 一键完整回归：**未通过完整单次执行门槛**，第七批发生进程停滞，已记录。独立模块通过不代表一键执行器稳定。
|
||
|
|
- 真实 Chromium 操作：当前执行环境 `ERR_BLOCKED_BY_ADMINISTRATOR`，不计为通过；保留 `scripts/browser_studio_v8211.py` 供在 CI/开发机复测。
|
||
|
|
- Docker/PostgreSQL/Redis/Art Design Pro 官方工程：未进行本轮真实环境验收。
|
||
|
|
|
||
|
|
## 运行与使用
|
||
|
|
|
||
|
|
```bash
|
||
|
|
python scripts/http_end_to_end.py
|
||
|
|
node --test tests_js/editor_ux.test.cjs
|
||
|
|
python -m pytest -q tests/test_editor_ux_v8211.py
|
||
|
|
python scripts/browser_studio_v8211.py # 需本地 Chromium、Playwright、本机 HTTP 访问权限
|
||
|
|
```
|
||
|
|
|
||
|
|
网站编辑器继续通过 `/editor/{site_id}/{entry_id}` 访问。单独查看视觉交互可直接在浏览器打开 `examples/Studio_V8_21_1_交互预览.html`，该文件为**示例 UI**，不访问数据库也不是真实发布端。
|
||
|
|
|
||
|
|
## 后续计划
|
||
|
|
|
||
|
|
- 进行真实浏览器的 PC/平板/手机 E2E，并按操作可用性修复视觉缺陷；
|
||
|
|
- 实现嵌套 layout 子组件的独立属性选择、拖拽落点可视化与组件版本继承；
|
||
|
|
- 增加数据源联动的结构化表单编辑，而非复杂 JSON 文本框；
|
||
|
|
- 拿到 Art Design Pro 官方项目后进行完整编译及权限/路由集成验收；
|
||
|
|
- 排查一键测试执行器跨模块进程停滞并在 CI 设置稳定性门槛。
|