前言¶
DeepSeek Harness 的 Web 模式主要用于可视化调试智能体。在实际使用中，开发者容易忽略状态变更（如会话完成、工具申请审批、AI 询问），且界面缺乏定制化选项，文件变更的查看方式也较为原始。dsh-web-extras 是一个浏览器端插件，通过补充即时通知、外观定制和按轮次聚合的文件变更视图，解决这些 Web 界面的痛点。
核心功能¶
该插件提供三个主要功能模块：
- 完成/审批/提问提醒：针对会话完成、工具申请审批、AI 向你提问三种场景，播放不同的提示音（音效各异，可开关试听），并弹出立绘图片。立绘支持上传、裁剪、翻转。
- 外观定制：支持背景图（URL 或本地）的水平翻转、缩放、位置调整及透明度设置。可调节侧边栏、气泡、输入区、代码块的透明度，以及输入区失焦折叠。
- 文件变更视图：按「轮次」聚合 Agent 的文件修改（write / edit / str_replace_editor）。提供行级差异（增行绿色、删行红色）和修改前后代码高亮对比，支持并排查看。
安装与启用¶
安装前需确保已安装 DSH CLI 并使用 Web 模式 (dsh --profile web)。
dsh plugin --profile web add github:LimBoo233/dsh-web-extras
安装完成后，重启 dsh 并刷新浏览器页面即可生效。
典型用法¶
安装后，浏览器设置页会出现两个新入口，会话页签中会出现「文件变更」页签。
- 配置提醒：在设置页的「提醒设置」中，为三种事件分别开启音效和立绘。支持上传本地图片，并使用裁剪工具调整立绘大小与位置。若立绘意外消失，点击「裁剪并保存」即可恢复。
- 定制外观：在「外观」设置中，输入背景图 URL 或上传本地图片，通过实时预览调整缩放、位置、翻转及透明度。展开「高级选项」可统一调节界面透明度及输入区折叠行为。
- 查看文件变更：在会话页签点击「文件变更」，按轮次查看文件列表。展开文件后，可同时开启「行级差异」和「高亮对比」视图进行左右对比。高亮对比默认只显示「修改后」，「修改前」可展开。
适用场景与注意¶
- 纯浏览器端实现：该插件为 Client 插件，不含 Host 侧代码。所有配置与图片数据保存在本地浏览器（localStorage/IndexedDB），不经过任何服务器。
- 数据隐私：提示音由 Web Audio 实时合成，不依赖音频文件。数据仅存于本浏览器，清除浏览器数据或更换设备后丢失。
- 兼容性：背景图水平翻转对本地图片无限制；对 URL 图片要求服务器允许跨域读取（CORS），否则会自动降级。
总结¶
dsh-web-extras 通过补充 Web 界面的交互反馈和可视化能力，提升了调试智能体的体验。适合需要在调试过程中获得即时通知、自定义界面风格以及清晰文件变更记录的开发者。
