前言¶
用 DeepSeek Harness(DSH)久了会遇到两个界面问题:左侧面板列表有几个条目就占几行,选项一多,底部的「工作区」就被挤出窗口;右侧栏有些 tab 的内容比盒子高,却被 overflow: hidden/clip 裁掉,既看不见也滚不到。这两处都不是配置项,插件注册接口也只接受 id / order / label,没有尺寸参数。下面介绍的 gusong1729/dsh-panel-scroll 就是一个客户端插件,直接在 DOM 层补这两个缺口。
这是什么¶
dsh-panel-scroll 由 gusong1729 维护,分类是客户端插件,给 DSH 的 Web / Desktop 界面打一个小布局补丁:左侧面板列表封顶 4 行、剩下的用滚轮滑出来;右侧栏被裁掉内容的容器改成可以上下滚动。仓库地址是 https://github.com/gusong1729/dsh-panel-scroll ,社区目录页是 https://www.skillhub.cn/plugins/gusong1729/dsh-panel-scroll 。许可证为 MIT,package.json 里版本号为 0.2.4。
核心功能¶
- 左侧面板列表封顶:默认只显示 4 行(学习 / 插件 / 插件市场 / 自动化任务等),剩下的用滚轮滑出来,「工作区」往上升、会话列表多露几条。
- 右侧栏不再裁内容:右栏里凡是「内容比盒子高、却被
overflow: hidden/clip切掉」的容器,改成可以上下滚动,滑到底能看到原本够不到的项。
安装与启用¶
README 给出的安装方式有两种。方式一是本地目录,适合开发或自用,把插件所在的绝对路径交给 dsh plugin add:
dsh plugin --profile <你的 profile> add /绝对路径/dsh-panel-scroll
也可以在 DSH 里让 agent 用 plugin_manager 的 install_bundle 指向该目录。方式二是 npm,README 标注为「如果已发布」:
dsh plugin --profile <你的 profile> add dsh-panel-scroll
无论哪种方式,装完都要重启一次 DSH 才生效,因为客户端插件代码是在启动时装载的。
配置¶
配置全部走 localStorage,改完刷新页面即可,不需要重启。可用键有两个:
| 键 | 默认 | 说明 |
|---|---|---|
dsh-panel-scroll:rows |
4 |
面板列表显示几行,取值 1–20。设成 3 时算上「学习」那一行正好 4 行 |
dsh-panel-scroll:unclog |
开 | 设为 "off" 关闭右栏的滚动修复,只保留左侧 4 行封顶 |
在 DevTools Console 里改值后刷新即可:
localStorage['dsh-panel-scroll:rows'] = 3
location.reload()
工作原理¶
左栏的做法是向 sidebar.panellist 注册一个不可见的标记行,它的 DOM 节点必然落在真正的面板列表里,插件从这个锚点往上走,找到「自己那一行」和「行列表」,判据是有没有同 tag 同 class 的兄弟,而不是硬编码的类名,再给列表发布一条 max-height: N × 行距 的样式表规则。这里刻意用样式表加 !important,不用内联样式,因为 shell 重渲染会把内联值冲掉。
右栏的做法是先不认类名,按「贴着视口右边缘、高度 ≥ 70% 视口的最宽容器」定位右栏,再扫描其子树:内容比盒子高、且被 hidden/clip 裁掉的容器改成 overflow-y: auto;另外还处理起始侧溢出——justify-content: flex-end/center 这类末端或居中对齐时,多出的内容会落在容器上边界之外,scrollHeight 不计入、任何 scrollTop 都够不到,表现为「滚到顶也看不到第一项」,这类容器往往还是 overflow: visible,所以这条判据先于 overflow 判断执行:检测到有子元素跑到容器上边界之上,就先把对齐改成 flex-start,让溢出变成正常的下方溢出、可滚动。
适用场景与注意¶
适合在 DSH 里长期开多个面板、右侧栏有长内容、又不想动 shell 源码的人。安装前应检查源码与许可证。下面是 README 列出的已知限制:
- 依赖 shell 的 DOM 结构。插件刻意避开类名(DSH 用的是 CSS Module 哈希类名),但 shell 若改了层级关系,插件可能失效,失效时表现为「没效果」,不会破坏界面。
- 在
dsh 0.2.1-rc.2上验证过,package.json里dsh.engines.dsh声明为>=0.2.1-rc.2 <0.3.0。 - 右栏关闭时,「贴右边的那条」是主区,因此右栏规则也会作用到主区。不想要就把
dsh-panel-scroll:unclog设成"off"。 - 注册的标记项
label为空,会出现在面板列表的「更多」菜单和无障碍树里,是一个空项。 - 面板少于 2 个时左侧封顶逻辑不生效,因为没有兄弟行可判定。
- 高度小于 60px 的被裁容器不处理,阈值内是滚动条比内容还高的区域,修了反而更糟。
- 开发时改完
client.js,刷新页面即可生效,不需要重启 DSH。
验收与开发¶
插件包是 link: 安装到 profile 的,相关文件都在 client.js,通过 window.__ModuleLoader__.load({ id, factory }) 暴露 apply/inject。两种验证方式都不需要装进 DSH:
node tests/smoke.mjs
这条命令用无依赖的冒烟测试装载 client.js,跑 apply()/注册/销毁。浏览器验收页 tests/harness.html 复刻了 shell 骨架,打开后底部打印 HARNESS PASS。也可以用无头 Edge 跑一遍并截图:
msedge --headless=new --disable-gpu --window-size=1400,900 \
--screenshot=harness.png tests/harness.html
卸载¶
dsh plugin --profile <你的 profile> remove dsh-panel-scroll
或者在 Plugins 页面把 dsh-panel-scroll 关掉或卸载。插件全部效果都走注入的样式表加类名,卸载时样式表移除、加过的类在 dispose() 里清掉,不残留。README 提到 0.2.2 及更早版本曾用内联样式,卸载后左栏会保持封顶直到刷新,0.2.3 起修正。
小结¶
dsh-panel-scroll 的价值不在新功能,而是把两个没有配置项可用的界面问题在 DOM 层补掉:左栏封顶滚动、右栏解除裁剪。改动面小、回退也干净,适合需要面板列表更紧凑、又希望右侧长内容可滚动的人。目录页 https://www.skillhub.cn/plugins/gusong1729/dsh-panel-scroll ,源码 https://github.com/gusong1729/dsh-panel-scroll 。
说明:社区目录是独立站点,与 DeepSeek / 幻方无官方从属关系,不是官方应用商店。