前言¶
在 DeepSeek Harness（DSH）里改本地 HTML demo 或预览页时，常见做法是口述「改导航栏那个按钮」或整段粘贴 HTML，智能体容易指错节点或改错范围。若能把「你点中的那个元素」对应的 CSS 选择器、可见文本和 HTML 片段直接写进当前对话输入框，后续编辑会更精确，且不必动磁盘上的源文件。
下面介绍社区插件 dsh-html-inspector（维护者 robin421，GitHub：robin421/dsh-html-inspector）。它在 DSH 的 HTML 预览与浏览器标签页中提供选区模式：开启后在本机页面上点击元素，定位信息自动进入聊天输入框，供智能体按点选结果修改。
这是什么¶
dsh-html-inspector 是 DSH 的客户端类插件（dsh.client，平台 web）。一句话：为 HTML 预览和浏览器标签提供「点击定位」，把元素的定位信息写入当前会话输入框，不会修改磁盘上的任何文件。
插件在 host 侧注册代理路由，在 client 侧拦截本机地址、处理 iframe 预览，并与可选的工具栏开关配合；两部分除访问本机 loopback 外不向外部网络发送数据。
核心功能¶
以下能力均来自插件 README 与 package.json 说明。
点击定位（Click-to-locate）¶
开启选区模式后，鼠标悬停会用蓝色描边高亮当前元素；单击会采集：
- 标签、
id、class - 基于
nth-of-type的 CSS 选择器路径 - 最多约 1200 字符的可见文本
- 最多约 4000 字符的元素 outer HTML
采集结果写入当前对话的输入框。按 Esc 可取消。插件不会改写你项目里的 HTML 文件。
浏览器标签页（本机地址）¶
在 DSH 浏览器标签的地址栏输入 loopback 地址（localhost / 127.0.0.1）时，插件会通过注入式代理路由（GET /inspector/proxy?url=…）加载页面，并在页面内注入 inspector 脚本；在同一会话内导航后，选区能力仍可继续使用。
文件树 HTML 预览¶
从文件树打开 HTML（/sidebar/html 编辑器 iframe 预览）时，预览帧会换成带 inspector 的同内容副本（保留 <base> 以便相对路径资源正常加载），选区结果会带上「file preview」来源标记，便于区分来自文件预览还是浏览器标签。
选区模式工具栏按钮（可选）¶
若已安装 dsh-better-sidebar，插件会在浏览器标签工具栏注入选区模式开/关按钮；每个标签会话内会记住开关状态，默认开启。未安装该 sidebar 插件时，地址栏本机拦截与文件预览选区仍可用，只是没有该按钮。
仅 loopback、只读¶
代理只接受本机目标（如 localhost、127.0.0.0/8、::1、0.0.0.0 的精确匹配规则），拒绝其它地址；仅对你请求的页面做 GET、注入脚本并返回给 GUI，不持久化、不外发。
安装与启用¶
官方安装命令（web profile）如下。安装前请自行查看仓库源码与 MIT 许可证；插件以当前 DSH 进程权限运行。
dsh plugin --profile web add github:robin421/dsh-html-inspector
也可在插件市场上架后，从 dsh-market（Settings → Plugin Market）一键安装。
安装后重启 Web GUI（或刷新页面）。若装了 dsh-better-sidebar，可在浏览器标签工具栏找 selection mode 按钮；否则在浏览器标签输入 localhost 开头的本机 URL 即可走代理与选区逻辑。
运行环境：package.json 要求 Node >=20；适用于带 dsh client runtime 的 Web GUI 及同类桌面客户端。
典型用法¶
- 用上述命令安装并刷新 DSH Web 界面。
- 在本机启动静态服务或 dev server（例如页面在
http://127.0.0.1:8080）。 - 在 DSH 浏览器标签地址栏输入该 loopback URL，或从文件树打开 HTML 使用预览。
- 开启选区模式（工具栏按钮，或依赖默认开启的行为）；在页面上移动鼠标确认高亮，点击目标元素。
- 查看对话输入框中已写入的选择器、文本与 HTML 片段，再让智能体按该定位修改代码。
取消当前选区操作：按 Esc。
适用场景与注意¶
适合谁： 经常在 DSH 里调试本地 HTML/CSS/小型 demo、希望用「点选」代替手工描述 DOM 位置的开发者。
架构要点（便于排查问题）：
- Host 侧
index.js：Cordis 插件，注册GET /inspector/proxy?url=…，拉取 loopback 页面、改写同源链接以保持导航仍在代理内，并注入自包含 inspector 脚本；除 dsh runtime 外无额外依赖。 - Client 侧
client.js：拦截 loopback 地址栏输入、监听代理页面的postMessage选区、写入聊天 composer、管理工具栏开关。
安全与权限： 代理仅服务本机 loopback，不做写盘。仍建议在安装前阅读 GitHub 仓库 源码，确认行为符合你的环境策略。
生态说明： DSH 采用「一切皆插件」的扩展方式；社区目录页 skillhub.cn 上的条目 与 GitHub 仓库由社区维护，与 DeepSeek / 幻方无官方从属关系。
结尾¶
dsh-html-inspector 把「在本机 HTML 页面上点一下」变成对话输入框里可引用的定位信息，适合与 DSH 智能体配合做精确 DOM 级修改，且保持对源文件的只读预览/代理访问。
