Export4j

简体中文

English

简体中文

English

外观

模板逻辑与检查器验收 ​

范围 ​

模板逻辑和容器层级统一使用检查器。当前节点的属性、正文、数据路径及直属子内容在同一面板编辑；顶部面包屑返回祖先。移除独立逻辑侧栏、画布上的层级面包屑和内部内容下拉框。左侧文档结构树保留全局概览。本次不扩展模板引擎语法。

本记录保留基础检查器验收；后续标量比较、多值分支及嵌套编辑见多值条件验收。

交互契约 ​

  • 从文档内容进入条件、循环、表格或栅格，再进入直接子结构；检查器顶部始终显示当前路径。
  • 未命中的条件分支和空数组中的内容模板可以查看、修改，不向数据中增加假记录。
  • 条件面板直接填写或搜索布尔字段，显示判断句式及当前测试值；两侧分支预览正文，点击正文即可在同一检查器编辑。根布尔测试值与条件草稿一次提交、撤销，保留两个分支。
  • 正文变量在检查器就地选择、插入及逐处更新路径；替换保留格式、链接和行内对象，非法路径或包含保护对象的选区明确拒绝。循环、列表与数据表格使用当前词法作用域，表头使用外层作用域。
  • 检查器可编辑已有根数据的文字、数字和布尔测试值，并与正文草稿一起提交、撤销；循环别名不默改记录。字符串未改时保留原始转义及 CRLF，数值修改仅替换目标 JSON token；其他大整数、小数及空白保持原文。测试值过期时拒绝覆盖。
  • 返回上级前提交合法草稿，保留条件两个分支、嵌套循环别名和测试数据；无效草稿阻止跳转并显示原因。
  • 草稿改变子节点位置时，带 ID 的子项按 ID 重新定位；无 ID 且结构已变化时留在父节点，并显示持续可见的提示，避免误选相邻内容。
  • 表格的行列、合并拆分及精确列宽，栅格的本行布局、拆分合并与交换，内部内容复制删除和通栏插入均在检查器操作。
  • 内联操作区不在外部按下鼠标时先收起，避免点击下方子内容时目标移位；最末正文行和最末列的删除按钮在刷新、返回上级及提交属性后保持禁用。
  • 画布保留正文编辑、直接选择、拖动及列宽分隔线；选中容器或沿检查器导航不改变画布工具条高度，不影响双击进入编辑。
  • 窄窗口在同一临时检查器内下钻、返回；Esc 关闭临时面板并把焦点还给打开控件。
  • 复用片段使用 XML 编辑，修改前验证完整候选，失败或取消保持原资源，有效修改影响全部引用并支持撤销。

验证 ​

浏览器集成测试位于 export4j-designer/frontend/tests/template-inspector.test.mjs，覆盖隐藏分支、空循环、嵌套循环变量作用域、面包屑返回、条件修改、空分支新增与撤销、正文、窄窗口焦点、双击编辑及画布几何。补充就地字段选择、条件测试值与草稿合并撤销、分支预览正文直接编辑、变量插入的光标与格式、同名引用逐处更新、多行测试值保真和过期值保护。容器操作继续由 studio.test.mjs 的实际浏览器场景覆盖。结构变化后的草稿导航、富文本选区及测试值写回需要浏览器验证，不能仅由 TypeScript 编译证明。

bindings.test.mjs 检查字段浏览的作用域、类型过滤和有界搜索，字段枚举不携带数据值。独立的 binding-values.test.mjs 检查原始 JSON token 编辑、大整数／大指数保真、别名遮蔽、表头范围、无效候选的原子拒绝及预算。

复现入口：

powershell
.\gradlew.bat :export4j-designer:installDist
cd export4j-designer/frontend
node --test tests/template-inspector.test.mjs
npm test

需要 JDK 21、Node.js 22 或更高版本及 Playwright 可用的 Chrome；测试自行启动随机端口并在结束后关闭。可使用 EXPORT4J_DESIGNER_DIST 指定隔离的完整分发，或用 EXPORT4J_STUDIO_URL 指向专用测试实例；不能使用正在编辑的工作区。

本轮 distZip、TypeScript 检查及前端打包成功，解压到独立分发运行。最终分发上的完整前端回归为 198 项通过，无失败、跳过或取消；其中检查器为 16 个场景及父测试、17 项通过。覆盖未命中条件、空循环、嵌套别名、过期导航提示、草稿提交、末行末列保护，以及条件／变量就地编辑、精确测试值写回、多行值、单步撤销和过期值保护。

真实浏览器回归发现检查器重排正文容器会使预先保存的 DOM Range 失效；变量引用现保存文本节点和偏移，更新时重建范围，并继续校验正文版本、节点归属及原始变量文本。最终同名引用逐处修改、颜色／粗体保留及非法路径拒绝用例通过。

在 1600×900、1280×800 和 980×760 三种视口下，画布顶边均为 178 CSS px，高度分别为 676、576 和 536 CSS px；打开检查器、进入子结构、面包屑返回及关闭检查器均不改变顶边和高度。64 个条件的长内容列表在检查器内滚动，页面未出现脚本异常。已查看桌面、窄屏及表格操作截图，并使用既有模板副本确认独立预览的源码保持一致。这里测量的是浏览器 CSS px，与文档排版的 pt 无关。

本轮日志、几何数据及截图保存在忽略的 build/verification/designer-inline-inspector-20261104/，最终回归日志为 frontend-complete.log，截图目录为 studio-complete/ 和 template-inspector-complete/。独立预览使用既有模板与测试数据的副本，确认二者原文一致、无页面脚本错误；分发中的六份 UI 资源与当前源码／打包结果一致。前轮导航验收保存在 build/verification/designer-inspector-navigation-20261104/。

边界 ​

  • 片段正文以 XML 编辑，尚无独立片段可视化画布。
  • 无专用控件的结构使用已声明属性或节点 XML，不宣称任意模板全部可视化编辑。
  • 空数据表格的正文行仍可能没有可排版内容，使用已有模板编辑状态；不通过添加假记录掩盖布局失败。
  • 基础验收时块条件只读取布尔值；后续比较与多分支扩展见多值条件验收。缺失字段、数组内容和循环记录在测试数据面板编辑；正文变量最多列出 200 处引用，分支最多预览 40 项。
  • 本次为本地源码与独立实例验收，不代表现有运行实例已更新或已正式发布。