docs: update webdev layout probe guidance

This commit is contained in:
Codex
2026-06-26 18:02:19 +00:00
parent 938a48b6ec
commit 5e363e4aeb
+8 -1
View File
@@ -20,11 +20,18 @@ description: UniDesk Web 开发与浏览器验证技能。用户处理 UniDesk/H
- UniDesk/HWLAB 的工具页默认是工作界面,不是营销页:首屏直接呈现可操作对象、状态和主要任务流,避免 hero、装饰卡片和说明性大段文案。
- 信息密度优先但要稳定:header 保持窄,source/file/project 等上下文选择放在顶部工具栏或状态栏下拉;计数、来源、taskRef、更新时间等元信息收敛到详情/感叹号弹窗,不长期占主版面。
- 主内容区必须占优:树、大纲、列表和导航只作为左侧辅助视图,默认约 30% 或更小,并支持折叠或调整宽度;正文、报告、trace、消息或表格等主工作内容应占页面主要空间。
- Workbench 类三栏/双栏工作区优先复用通用 bounded layout 组件或抽取通用组件后再接入新页面;不要为每个页面重新堆叠一套 `aside + main + report` CSS。根容器和 workspace 使用稳定高度、`min-height: 0` 和内部滚动,避免 document 级长页或外层横向溢出;窄桌面仍应保持可操作分栏,移动断点再退化为纵向布局。
- 新建、配置、probe、reindex 等低频表单用对话框或抽屉承载;默认版面不要常驻新建框、配置表或调试面板。高频命令保留为稳定按钮或图标按钮,并配清晰状态。
- 文档/任务类页面优先就地阅读和就地编辑:标题和正文双击或显式编辑态切换,不为常规查看单独铺满输入框;正文渲染态必须可见,不能只显示 taskRef、文件名或更新时间。
- 报告、Markdown、日志和 JSON 片段要用成熟 Markdown/代码块渲染,代码块采用浅色 Workbench 风格、可滚动且不撑破布局;不要把裸 JSON 或长日志直接挤爆页面。
- 页面状态要可深链:重要 source/file/task/report/session 选择进入 RESTful URL,并能刷新后恢复;联动其他功能只通过公共 API、稳定 id 和 URL,不把两个功能互相嵌入成强依赖。
- 设计验收必须用截图或 web-probe 样本检查真实版面:正文是否可见、主区域是否足够、弹窗是否遮挡流程、长文本是否溢出、移动/窄屏是否仍可操作。
- 设计验收必须用截图或 web-probe 样本检查真实版面:正文是否可见、主区域是否足够、弹窗是否遮挡流程、长文本是否溢出、移动/窄屏是否仍可操作。项目/MDTODO/报告类页面至少覆盖紧凑桌面视口(例如 960x600)的深链默认态、左侧树折叠态、右侧报告关闭态;记录 document overflow、pane 宽高、正文/报告可见性、按钮是否被遮挡,以及截图 SHA。
## web-probe 证据规则
- 交互式线上验收优先使用 `web-probe observe start``observe command``observe collect``observe analyze``web-probe script` 只作为一次性探测逃生口。重复出现的高频动作(折叠侧栏、关闭报告、切换全屏、导出低码率截图、采集布局指标)必须沉淀为 observe command 或 analyzer 能力。
- Issue closeout 引用 observer id、command id、stateDir/report SHA、screenshot SHA 和关键字段摘要;不要粘贴截图二进制、完整 JSON、Secret、cookie 或无界日志。
- `observe analyze` 的 archive/history findings 可能包含旧样本或旧规则误判;关闭用户入口问题前同时核对最新 sample 字段、DOM 几何和截图。若 top-level findings、latest sample 和 archive red 冲突,说明冲突并补工具反馈 issue,不要只凭 archive red 或单张截图下结论。
## 高频工作流