Skip to content

dsh-find-bar

Verified

dsh-find-bar · v0.4.0 · MIT · Web UI

DSH web plugin: a Cmd/Ctrl+F find bar (like the browser's built-in find) for the desktop Electron shell, which has none. Centre/right segmented scope picker (hidden while the right column is collapsed), collapsed regions skipped and re-added on expand, wi

Install

dsh plugin add dsh-find-bar

Confirm the layer applied with dsh --profile default --dump-config — see the install guide.

Source

Tags

Creators

Readme

dsh-find-bar

English | 中文

DSH web 插件:为桌面 App(Electron 壳)补上 ⌘F / Ctrl+F 页内查找, 体验对齐浏览器原生查找条——支持全文高亮、匹配计数、回车跳转, 并可用中|右滑块选择搜索区域。

搜索范围

搜索输入框右侧叠加两段滑块,对应两个可搜索栏(选择会记忆,下次打开时保持)。 滑块显隐不会改变查找条尺寸——右侧栏收起时滑块自动隐藏。 滑块无文字——左段=对话区域(默认),右段=右侧面板;悬浮滑块会显示 共用说明气泡(500ms 延迟,样式对齐应用自带控件的悬浮提示)。

范围规则:

  • 有选择才显示选择器:右侧面板收起时只搜对话区域,滑块整体隐藏;右栏展开后自动重现。搜索中该栏收起则自动退回"中"(不覆盖已保存的选择)
  • 跳过折叠内容:对话区自动收起的操作步骤、隐藏的面板内容不参与匹配;展开后约 250ms 内自动重新计数并入结果
  • 面板全屏(覆盖中央)仍视为"右"可搜
  • 左侧栏不作为范围:dsh 工作区自带搜索

原理

Electron 没有浏览器内置查找栏。本插件在客户端实现:

  • 监听 ⌘F/Ctrl+F(capture 阶段)弹出自绘查找条(跟随主题变量)
  • 用 TreeWalker 收集文本节点(含 shadow root 内),按所选栏限定根节点 (右栏锚点 [data-rightbar-col],中央列为其前一兄弟), 命中后用 checkVisibility 过滤被折叠隐藏的文本,构建 DOM Range 匹配
  • 用 CSS Custom Highlight API(CSS.highlights + ::highlight())高亮—— 只绘制不修改 DOM,与 React 渲染零冲突
  • MutationObserver(含属性变化)防抖跟随内容更新与折叠/展开
  • 不支持该 API 的环境自动退回 window.find()(该模式无范围与计数)

快捷键

键 功能
⌘F / Ctrl+F 打开查找条(自动填入当前选中文本)
Enter / Shift+Enter 下一个 / 上一个匹配
⌘G / F3(+Shift) 下一个 / 上一个
Esc 关闭并清除高亮

输入即搜(防抖跟随内容流式更新),计数显示 当前/总数。

安装

dsh plugin --profile <profile> add dsh-find-bar

从 npm 安装(推荐);或从源码:

git clone https://github.com/secyborg/dsh-find-bar
dsh plugin --profile <profile> add ./dsh-find-bar

安装后重启一次应用(插件清单启动时装载)。

已知限制

  • 只搜索已渲染且可见在 DOM 里的内容;未展开的会话/极长列表若被界面折叠,需先展开
  • 面板内嵌 iframe 的网页内容不在搜索范围内
  • 匹配上限 5000 条(超限显示 +)
  • 大小写不敏感,暂无"区分大小写"开关
  • 退回 window.find() 的旧环境不支持范围选择

卸载

dsh plugin --profile <profile> remove dsh-find-bar