dsh-chrome-bridge 0.0.0-stage → 1.14.0

package/client.js

@@ -0,0 +1,341 @@
+/**
+ * dsh-chrome-bridge 的网页端：DSH「插件」页里我们这张卡的设置页。
+ *
+ *   连接状态（扩展 / 本地宿主、版本、正在控制哪些标签页）+ 全部松手
+ *   两个开关：允许 DSH 控制浏览器（这里只能关）、页面里显示 DSH 光标
+ *   没连上时：差哪一步、一键帮你打开安装页
+ *
+ * 数据全走插件自己挂在 DSH webServer 上的路由（plugin/panel.js），每 2.5 秒刷一次。
+ * 走官方客户端插件机制：window.__ModuleLoader__.load({ id, factory })，factory 里 apply(ctx)
+ * → 注册到 plugins.bundle.config（包详情页）和 plugins.row.config（行详情页）两个 keyed slot。
+ * 拿不到 react 或 DSH 的组件就安静退出 / 用最朴素的替身，别把宿主页面搞崩。
+ */
+window.__ModuleLoader__.load({
+  id: 'dsh-chrome-bridge',
+  factory: (require) => {
+    var module = { exports: {} }
+    var exports = module.exports
+
+    const opt = (id) => { try { return require(id) } catch (_) { return null } }
+    const React = opt('react')
+    if (!React) {
+      exports.apply = () => {}
+      exports.inject = ['slots', 'locale']
+      return module.exports
+    }
+    const UI = opt('@deepseek-ai/dsh-client-ui-primitives') || {}
+    const h = React.createElement
+    const { useState, useEffect, useCallback, useRef } = React
+
+    const PKG = 'dsh-chrome-bridge'
+    const ROW = 'chrome-bridge'
+    const NS = 'dsh-chrome-bridge'
+    const ROUTE = '/dsh-chrome-bridge/panel'
+    const REPO = 'https://github.com/OrderG-X/dsh-chrome-bridge'
+
+    // 占位符用 %x：不跟 DSH 自己的 {name} 插值撞
+    const zh = {
+      title: 'Chrome 浏览器控制',
+      checking: '正在检查…',
+      connected: '已连接',
+      paused: '已暂停',
+      disconnected: '未连接',
+      unsupported: '目前只支持 macOS、Windows、Linux',
+      summaryOn: '已连接 · 正在控制 %n 个标签页',
+      summaryIdle: '已连接，没有在控制的标签页',
+      summaryOff: '还没连上 Chrome，点开看怎么装',
+      summaryPaused: '已暂停：DSH 暂时不能操作浏览器',
+      storeBuild: '商店版',
+      localBuild: '本地版',
+      controlling: '正在控制 %n 个标签页',
+      controllingIdle: '没有在控制的标签页',
+      releaseAll: '全部松手',
+      released: '已全部松手',
+      allowControl: '允许 DSH 控制浏览器',
+      allowControlHint: '关掉后，DSH 的浏览器操作会被直接拒绝。重新打开要到 Chrome 工具栏的 DSH Bridge 面板里点 —— 这样模型自己没法把它打开。',
+      resumeInChrome: '要恢复，请点 Chrome 工具栏上的 DSH Bridge 图标，打开「允许 DSH 控制浏览器」。',
+      showCursor: '页面里显示 DSH 光标',
+      showCursorHint: '关掉只是不画光标，点击、输入照做。',
+      outdated: 'Chrome 里的扩展版本较旧，更新后才能在这里切换开关。',
+      setupTitle: '还差一步：把扩展装进 Chrome',
+      setupStoreTitle: '扩展装了，但没连上',
+      setupStep1: '打开 Chrome，地址栏进入 chrome://extensions，右上角打开「开发者模式」',
+      setupStep2: '点「加载已解压的扩展程序」，选这个文件夹：',
+      setupStep3: '装好后这里会自动变成「已连接」',
+      setupStoreAlt: '更省事：直接从 Chrome 应用商店装，不用开发者模式。',
+      openStore: '去商店装',
+      storeOpened: '已在 Chrome 里打开商店页，点「添加至 Chrome」就行',
+      setupStore1: '确认 Chrome 开着，并且 DSH Bridge 扩展是启用状态',
+      setupStore2: '还不行就重启一下 Chrome',
+      openInstall: '帮我打开安装页',
+      installOpened: '已在 Chrome 里打开扩展页',
+      pathCopied: '，文件夹路径也复制好了（文件框里按 ⌘⇧G 再 ⌘V）',
+      pathCopiedWin: '，文件夹路径也复制好了（粘进文件框顶上的地址栏、回车）',
+      plugin: '插件 v%v',
+      guide: '使用说明',
+      failed: '操作没成功：%e',
+      unreachable: '读不到插件状态，重启 DSH 后再试',
+    }
+    const en = {
+      title: 'Chrome Bridge',
+      checking: 'Checking…',
+      connected: 'Connected',
+      paused: 'Paused',
+      disconnected: 'Not connected',
+      unsupported: 'Supports macOS, Windows and Linux only',
+      summaryOn: 'Connected · controlling %n tab(s)',
+      summaryIdle: 'Connected, no tabs under control',
+      summaryOff: 'Not connected to Chrome yet — open for setup steps',
+      summaryPaused: 'Paused: DSH cannot operate the browser',
+      storeBuild: 'Web Store',
+      localBuild: 'Local',
+      controlling: 'Controlling %n tab(s)',
+      controllingIdle: 'No tabs under control',
+      releaseAll: 'Release all',
+      released: 'Released all tabs',
+      allowControl: 'Allow DSH to control the browser',
+      allowControlHint: 'When off, DSH browser actions are refused. Turning it back on is done from the DSH Bridge panel in Chrome\'s toolbar, so the model cannot re-enable it itself.',
+      resumeInChrome: 'To resume, click the DSH Bridge icon in Chrome\'s toolbar and turn on "Allow DSH to control the browser".',
+      showCursor: 'Show the DSH cursor on pages',
+      showCursorHint: 'Off only hides the cursor; clicks and typing still happen.',
+      outdated: 'The extension in Chrome is outdated; update it to change these switches here.',
+      setupTitle: 'One step left: add the extension to Chrome',
+      setupStoreTitle: 'The extension is installed but not connected',
+      setupStep1: 'Open chrome://extensions in Chrome and turn on Developer mode (top right)',
+      setupStep2: 'Click "Load unpacked" and choose this folder:',
+      setupStep3: 'This page turns to "Connected" once it is loaded',
+      setupStoreAlt: 'Easier: install it from the Chrome Web Store, no Developer mode needed.',
+      openStore: 'Get it from the store',
+      storeOpened: 'Opened the store page in Chrome; click "Add to Chrome"',
+      setupStore1: 'Make sure Chrome is running and the DSH Bridge extension is enabled',
+      setupStore2: 'If it still does not connect, restart Chrome',
+      openInstall: 'Open the install page for me',
+      installOpened: 'Opened the extensions page in Chrome',
+      pathCopied: '; the folder path is on the clipboard (⌘⇧G then ⌘V in the file picker)',
+      pathCopiedWin: '; the folder path is on the clipboard (paste it into the file picker\'s address bar)',
+      plugin: 'Plugin v%v',
+      guide: 'Guide',
+      failed: 'That did not work: %e',
+      unreachable: 'Could not read the plugin status; restart DSH and try again',
+    }
+
+    const fmt = (s, vars) => String(s).replace(/%([a-z])/g, (m, k) => (vars && k in vars ? String(vars[k]) : m))
+
+    const CSS = `
+.dcb{display:grid;gap:12px;color:var(--dsw-alias-label-primary);font-size:13px;line-height:1.5}
+.dcb-card{border:1px solid var(--dsw-alias-settings-card-stroke,var(--dsw-alias-border-l));background:var(--dsw-alias-settings-card-fill,transparent);border-radius:12px;overflow:hidden}
+.dcb-row{display:flex;align-items:flex-start;gap:12px;padding:12px 14px}
+.dcb-row+.dcb-row{border-top:1px solid var(--dsw-alias-border-l)}
+.dcb-main{flex:1;min-width:0;display:grid;gap:2px}
+.dcb-title{font-weight:600;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
+.dcb-sub{color:var(--dsw-alias-label-secondary);font-size:12px}
+.dcb-hint{color:var(--dsw-alias-label-tertiary);font-size:12px;margin:0}
+.dcb-dot{width:9px;height:9px;border-radius:50%;flex:none;margin-top:6px;background:var(--dsw-alias-label-tertiary)}
+.dcb-dot[data-s=on]{background:var(--dsw-alias-state-success-primary,#34c759);box-shadow:0 0 0 3px color-mix(in srgb,var(--dsw-alias-state-success-primary,#34c759) 22%,transparent)}
+.dcb-dot[data-s=paused]{background:var(--dsw-alias-state-warn-primary,#ff9f0a)}
+.dcb-dot[data-s=off]{background:var(--dsw-alias-state-error-primary,#ff453a)}
+.dcb-tabs{margin:6px 0 0;padding:0;list-style:none;display:grid;gap:2px}
+.dcb-tabs li{color:var(--dsw-alias-label-secondary);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+.dcb-steps{margin:6px 0 0;padding-left:18px;display:grid;gap:4px;color:var(--dsw-alias-label-secondary)}
+.dcb-path{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;padding:1px 6px;border-radius:6px;background:var(--dsw-alias-interactive-bg-hover);color:var(--dsw-alias-label-primary);user-select:all}
+.dcb-note{font-size:12px;padding:8px 12px;border-radius:10px;background:color-mix(in srgb,var(--dsw-alias-state-warn-primary,#ff9f0a) 12%,transparent);color:var(--dsw-alias-label-primary)}
+.dcb-note[data-tone=ok]{background:color-mix(in srgb,var(--dsw-alias-state-success-primary,#34c759) 12%,transparent)}
+.dcb-note[data-tone=err]{background:color-mix(in srgb,var(--dsw-alias-state-error-primary,#ff453a) 12%,transparent)}
+.dcb-foot{display:flex;gap:10px;align-items:center;color:var(--dsw-alias-label-tertiary);font-size:12px}
+.dcb-foot a{color:var(--dsw-alias-link);text-decoration:none}
+.dcb-foot a:hover{text-decoration:underline}
+.dcb-tag{font-size:11px;font-weight:500;padding:0 6px;border-radius:6px;border:1px solid var(--dsw-alias-border-l);color:var(--dsw-alias-label-secondary)}
+.dcb-btn{font:inherit;font-size:12px;padding:4px 12px;border-radius:8px;border:1px solid var(--dsw-alias-border-l);background:transparent;color:var(--dsw-alias-label-primary);cursor:pointer;white-space:nowrap}
+.dcb-btn:hover:not(:disabled){background:var(--dsw-alias-interactive-bg-hover)}
+.dcb-btn:disabled{opacity:.45;cursor:default}
+.dcb-switch{flex:none;margin-top:2px}`
+    function ensureCss() {
+      if (typeof document === 'undefined' || document.querySelector('style[data-plugin-css="dsh-chrome-bridge"]')) return
+      const tag = document.createElement('style')
+      tag.dataset.plugin = PKG
+      tag.dataset.pluginCss = 'dsh-chrome-bridge'
+      tag.textContent = CSS
+      document.head.appendChild(tag)
+    }
+
+    // ── DSH 组件，拿不到就用朴素替身 ────────────────────────────────────────
+    function Toggle({ checked, disabled, label, onChange }) {
+      if (UI.Switch) return h('span', { className: 'dcb-switch' }, h(UI.Switch, { checked, disabled, label, onChange }))
+      return h('input', { className: 'dcb-switch', type: 'checkbox', role: 'switch', 'aria-label': label, checked, disabled, onChange: (e) => onChange(e.target.checked) })
+    }
+    function Btn({ onClick, disabled, children, primary }) {
+      if (UI.Button) return h(UI.Button, { variant: primary ? 'primary' : 'outline', size: 'sm', disabled, onClick }, children)
+      return h('button', { type: 'button', className: 'dcb-btn', disabled, onClick }, children)
+    }
+
+    // ── 数据 ──────────────────────────────────────────────────────────────
+    async function fetchState(action) {
+      const res = await fetch(ROUTE, action
+        ? { method: 'POST', headers: { 'content-type': 'application/json' }, body: JSON.stringify(action), credentials: 'same-origin' }
+        : { credentials: 'same-origin', cache: 'no-store' })
+      if (!res.ok) throw new Error(`HTTP ${res.status}`)
+      return res.json()
+    }
+
+    /** 2.5 秒刷一次；页面藏起来时不刷。 */
+    function useBridgeState() {
+      const [state, setState] = useState(null)
+      const [error, setError] = useState('')
+      const alive = useRef(true)
+      const load = useCallback(async () => {
+        try {
+          const s = await fetchState()
+          if (alive.current) { setState(s); setError('') }
+        } catch (e) {
+          if (alive.current) setError(String((e && e.message) || e))
+        }
+      }, [])
+      useEffect(() => {
+        alive.current = true
+        load()
+        const timer = setInterval(() => {
+          if (typeof document === 'undefined' || document.visibilityState !== 'hidden') load()
+        }, 2500)
+        return () => { alive.current = false; clearInterval(timer) }
+      }, [load])
+      const act = useCallback(async (action) => {
+        const s = await fetchState(action)
+        if (alive.current) setState(s)
+        return s
+      }, [])
+      return { state, error, act }
+    }
+
+    function phaseOf(s) {
+      if (!s) return 'checking'
+      if (s.platform && !['darwin', 'win32', 'linux'].includes(s.platform)) return 'unsupported'
+      if (!s.connected) return 'off'
+      return s.paused ? 'paused' : 'on'
+    }
+
+    // ── 概要（行卡片上的一句话）────────────────────────────────────────────
+    function Summary({ t }) {
+      const { state } = useBridgeState()
+      const p = phaseOf(state)
+      if (p === 'checking') return t('checking')
+      if (p === 'unsupported') return t('unsupported')
+      if (p === 'off') return t('summaryOff')
+      if (p === 'paused') return t('summaryPaused')
+      return state.attachedCount ? fmt(t('summaryOn'), { n: state.attachedCount }) : t('summaryIdle')
+    }
+
+    // ── 设置页 ────────────────────────────────────────────────────────────
+    function Page({ t }) {
+      const { state, error, act } = useBridgeState()
+      const [busy, setBusy] = useState(false)
+      const [note, setNote] = useState(null)
+      const p = phaseOf(state)
+      const can = !!state && state.connected && !state.outdated && !busy
+
+      const run = async (action, ok) => {
+        setBusy(true)
+        try {
+          const s = await act(action)
+          if (s.actionError) setNote({ tone: 'err', text: fmt(t('failed'), { e: s.actionError }) })
+          else setNote(ok ? { tone: 'ok', text: typeof ok === 'function' ? ok(s) : ok } : null)
+        } catch (e) {
+          setNote({ tone: 'err', text: fmt(t('failed'), { e: String((e && e.message) || e) }) })
+        } finally {
+          setBusy(false)
+        }
+      }
+
+      const statusTitle = { checking: t('checking'), on: t('connected'), paused: t('paused'), off: t('disconnected'), unsupported: t('unsupported') }[p]
+      const ext = state && state.ext
+      const status = h('div', { className: 'dcb-card' },
+        h('div', { className: 'dcb-row' },
+          h('span', { className: 'dcb-dot', 'data-s': p === 'unsupported' ? 'off' : p }),
+          h('div', { className: 'dcb-main' },
+            h('div', { className: 'dcb-title' }, statusTitle,
+              ext ? h('span', { className: 'dcb-tag' }, `${ext.store ? t('storeBuild') : t('localBuild')} v${ext.version}`) : null),
+            state && state.connected
+              ? h('div', { className: 'dcb-sub' }, state.attachedCount ? fmt(t('controlling'), { n: state.attachedCount }) : t('controllingIdle'))
+              : null,
+            state && state.tabs && state.tabs.length
+              ? h('ul', { className: 'dcb-tabs' }, state.tabs.map((tab, i) => h('li', { key: i, title: tab.url }, tab.title || tab.url)))
+              : null,
+            p === 'paused' ? h('p', { className: 'dcb-hint' }, t('resumeInChrome')) : null),
+          state && state.connected
+            ? h(Btn, { disabled: !can || !state.attachedCount, onClick: () => run({ action: 'releaseAll' }, t('released')) }, t('releaseAll'))
+            : null))
+
+      const setup = p === 'off' ? h('div', { className: 'dcb-card' },
+        h('div', { className: 'dcb-row' },
+          h('div', { className: 'dcb-main' },
+            h('div', { className: 'dcb-title' }, state.store ? t('setupStoreTitle') : t('setupTitle')),
+            state.store
+              ? h('ol', { className: 'dcb-steps' }, h('li', null, t('setupStore1')), h('li', null, t('setupStore2')))
+              : h('ol', { className: 'dcb-steps' },
+                h('li', null, t('setupStep1')),
+                h('li', null, t('setupStep2'), ' ', h('span', { className: 'dcb-path' }, state.extDir)),
+                h('li', null, t('setupStep3'))),
+            state.store ? null : h('p', { className: 'dcb-hint' }, t('setupStoreAlt'))),
+          state.store ? null : h(Btn, { primary: true, disabled: busy, onClick: () => run({ action: 'install', via: 'store' }, t('storeOpened')) }, t('openStore')),
+          h(Btn, { primary: !!state.store, disabled: busy, onClick: () => run({ action: 'install' }, (s) => t('installOpened') + (s.assist && s.assist.clipboard ? t(state.platform === 'win32' ? 'pathCopiedWin' : 'pathCopied') : '')) }, t('openInstall')))) : null
+
+      const switches = state && state.connected ? h('div', { className: 'dcb-card' },
+        h('div', { className: 'dcb-row' },
+          h('div', { className: 'dcb-main' },
+            h('div', { className: 'dcb-title' }, t('allowControl')),
+            h('p', { className: 'dcb-hint' }, t('allowControlHint'))),
+          h(Toggle, {
+            label: t('allowControl'),
+            checked: !state.paused,
+            // 只能往「关」的方向拨：打开要去 Chrome 里点
+            disabled: !can || state.paused,
+            onChange: (on) => { if (!on) run({ action: 'pause' }) },
+          })),
+        h('div', { className: 'dcb-row' },
+          h('div', { className: 'dcb-main' },
+            h('div', { className: 'dcb-title' }, t('showCursor')),
+            h('p', { className: 'dcb-hint' }, t('showCursorHint'))),
+          h(Toggle, { label: t('showCursor'), checked: state.showCursor !== false, disabled: !can, onChange: (on) => run({ action: 'cursor', on }) }))) : null
+
+      const notes = [
+        error && !state ? { tone: 'err', text: t('unreachable') } : null,
+        state && state.outdated ? { tone: 'warn', text: t('outdated') } : null,
+        note,
+      ].filter(Boolean)
+
+      return h('div', { className: 'dcb' },
+        status,
+        setup,
+        switches,
+        ...notes.map((n, i) => h('div', { key: `n${i}`, className: 'dcb-note', 'data-tone': n.tone }, n.text)),
+        h('div', { className: 'dcb-foot' },
+          state && state.plugin ? h('span', null, fmt(t('plugin'), { v: state.plugin })) : null,
+          h('a', { href: REPO, target: '_blank', rel: 'noopener noreferrer' }, t('guide'))))
+    }
+
+    function makeCard(boundT) {
+      return function ChromeBridgeCard(props) {
+        ensureCss()
+        const t = typeof props.t === 'function' ? props.t : boundT
+        return props.view === 'summary' ? h(Summary, { t }) : h(Page, { t })
+      }
+    }
+
+    function apply(ctx) {
+      const t = ctx.locale && typeof ctx.locale.bind === 'function' ? ctx.locale.bind(NS) : (k) => zh[k] || k
+      if (ctx.locale && typeof ctx.locale.register === 'function') {
+        ctx.effect(() => ctx.locale.register(NS, { zh, en }), 'dsh-chrome-bridge: dictionaries')
+      }
+      const Card = makeCard(t)
+      const mount = (name, key) => {
+        const reg = () => ctx.slots.register({ name, key, locale: NS }, Card)
+        ctx.effect(() => (typeof ctx.slots.inject === 'function' ? ctx.slots.inject(name, reg) : reg()), `dsh-chrome-bridge: ${name}`)
+      }
+      mount('plugins.bundle.config', PKG)
+      mount('plugins.row.config', `${PKG}#${ROW}`)
+    }
+
+    exports.apply = apply
+    exports.inject = ['slots', 'locale']
+    return module.exports
+  },
+})

package/cordis.patch.yml

@@ -0,0 +1,4 @@
+# Bundle patch for dsh-chrome-bridge: inserts the plugin row into the DSH profile.
+- insert:
+    - id: chrome-bridge
+      name: 'dsh-chrome-bridge'

package/devtools.js

@@ -0,0 +1,94 @@
+/**
+ * 控制台 / 网络 / 返回内容 —— 调试网页用（browser_devtools）。
+ *
+ * 记录都在扩展里（console + JS 报错 + 浏览器日志一个环形缓冲，网络请求一个），这里只负责取和排版。
+ * 只记得到调试器接上之后的事；不过接上那一刻 V8 会把之前的 console 和报错补发一遍，
+ * 所以看 console 前先 attach 一下就能拿到「打开页面以来」的输出。网络请求没有补发，要 reload。
+ */
+
+const time = (ms) => new Date(ms).toTimeString().slice(0, 8)
+const sleep = (ms) => new Promise((r) => setTimeout(r, ms))
+const LEVELS = {
+  error: ['error', 'assert'],
+  warning: ['error', 'assert', 'warning', 'warn'],
+}
+
+/** "http://x.com/static/app.js?v=3:12" → "app.js?v=3:12" */
+const shortWhere = (w) => {
+  const m = /([^/]+)$/.exec(String(w || ''))
+  return m ? m[1].slice(0, 60) : ''
+}
+
+export async function consoleLog(call, tabId, { level = 'all', filter, limit = 40 } = {}) {
+  await call('attach', { tabId })
+  await sleep(300) // 等 V8 补发完旧消息
+  const r = await call('console', { tabId, limit: 300 })
+  let items = r.items || []
+  if (LEVELS[level]) items = items.filter((c) => LEVELS[level].includes(c.level))
+  if (filter) {
+    const f = String(filter).toLowerCase()
+    items = items.filter((c) => `${c.level} ${c.text} ${c.where || ''}`.toLowerCase().includes(f))
+  }
+  const total = items.length
+  items = items.slice(-limit)
+  if (!items.length) return level === 'all' && !filter ? '(控制台没有输出)' : '(没有匹配的条目)'
+  const lines = items.map((c) => {
+    const tag = c.kind === 'exception' ? '[未捕获] ' : c.kind && c.kind !== 'console' ? `[${c.kind}] ` : ''
+    const where = c.where ? `  (${shortWhere(c.where)})` : ''
+    return `${time(c.at)} ${String(c.level).padEnd(7)} ${tag}${c.text}${where}`
+  })
+  const head = total > items.length ? `最近 ${items.length} 条（共 ${total} 条）` : `${items.length} 条`
+  return `${head}\n${lines.join('\n')}`
+}
+
+export async function networkLog(call, tabId, { filter, reload = false, limit = 40 } = {}) {
+  const r = await call('network', { tabId, limit: 400, reload: !!reload, waitMs: 2500 }, 30000)
+  let items = r.items || []
+  if (filter) {
+    const f = String(filter).toLowerCase()
+    items = items.filter((n) => `${n.method} ${n.status} ${n.type} ${n.url}`.toLowerCase().includes(f))
+  }
+  const total = items.length
+  items = items.slice(-limit)
+  if (!items.length) {
+    return filter ? '(没有匹配的请求)' : '(还没记到请求——只记调试器接上之后的；传 reload=true 刷新一次就能抓到页面加载的全部请求)'
+  }
+  const hasId = items.some((n) => n.id)
+  const lines = items.map((n) => {
+    const status = n.failed ? `✗ ${n.failed}` : String(n.status ?? '…')
+    const ms = n.ms !== undefined ? `${n.ms}ms` : ''
+    const url = n.url.length > 150 ? n.url.slice(0, 149) + '…' : n.url
+    return `${hasId ? `#${n.id} ` : ''}${n.method} ${status} ${String(n.type || '').toLowerCase()} ${ms} ${url}`
+  })
+  const head = (total > items.length ? `最近 ${items.length} 个请求（共 ${total} 个）` : `${items.length} 个请求`) +
+    (hasId ? '；看返回内容：action=response，request 传 # 后面的编号' : '；扩展版本旧，看不了返回内容——重载一下扩展')
+  return `${head}\n${lines.join('\n')}`
+}
+
+export async function responseBody(call, tabId, requestId, limit = 6000) {
+  if (!requestId) throw new Error('action=response 需要 request（action=network 列出的 # 编号）')
+  const id = String(requestId).replace(/^#/, '')
+  let r
+  try {
+    r = await call('cdp', { tabId, method: 'Network.getResponseBody', params: { requestId: id } })
+  } catch (e) {
+    if (/No resource|No data found|identifier/i.test(e.message)) {
+      throw new Error('拿不到这个请求的返回内容（太早了被清掉、请求还没完成，或调试器断开过）——action=network reload=true 重抓一次')
+    }
+    throw e
+  }
+  const { body = '', base64Encoded } = r.result || {}
+  if (base64Encoded) return `(二进制内容，约 ${Math.round((body.length * 3) / 4 / 1024)}KB——不是文字)`
+  let text = body
+  const t = body.trim()
+  if (t.startsWith('{') || t.startsWith('[')) {
+    try { text = JSON.stringify(JSON.parse(t), null, 2) } catch {}
+  }
+  return text.length > limit ? text.slice(0, limit) + `\n…（截断，全文 ${text.length} 字）` : text || '(空)'
+}
+
+export async function clearLogs(call, tabId) {
+  await call('console', { tabId, clear: true })
+  await call('network', { tabId, clear: true })
+  return '已清空控制台和网络记录'
+}

package/drag.js

@@ -0,0 +1,132 @@
+/**
+ * 拖拽（browser_drag）。页面有两种「拖」，拖法不一样：
+ *
+ *   · 元素带 draggable="true" 的 HTML5 原生拖放：CDP 的鼠标事件在有界面的 Chrome 里
+ *     起不了原生拖放会话，所以在页面里合成 dragstart → dragenter → dragover → drop → dragend，
+ *     共用同一个 DataTransfer（页面在 dragstart 里塞的数据 drop 时拿得到）
+ *   · 其它（滑块、排序列表、看板、画布……靠鼠标/指针事件的）：发真实的
+ *     按下 → 分步移动 → 松开，Chrome 会顺带生成 pointer 事件
+ *
+ * 起点终点都能用编号 ref / selector / 可见文字 / 坐标给。放置区（"拖到这里"那种框）
+ * 往往不是可点元素、snapshot 里没编号，所以按文字找最实用。
+ */
+
+import { refElementJs } from './refs.js'
+
+const sleep = (ms) => new Promise((r) => setTimeout(r, ms))
+
+/** 按可见文字找元素：包含这段文字、看得见的元素里面积最小的那个（最贴近文字本身）。 */
+const textElementJs = (text) => `((t) => {
+  let best = null, area = Infinity;
+  for (const el of document.body.querySelectorAll('*')) {
+    if (!(el.textContent || '').includes(t) || !(el.innerText || '').includes(t)) continue;
+    const r = el.getBoundingClientRect();
+    if (r.width < 1 || r.height < 1 || r.width * r.height >= area) continue;
+    best = el; area = r.width * r.height;
+  }
+  return best;
+})(${JSON.stringify(String(text))})`
+
+const hasRef = (end) => end.ref !== undefined && end.ref !== null
+
+/** 端点 → 页内取元素的表达式；坐标端点返回 'null'。 */
+const elementJs = (end) =>
+  hasRef(end) ? refElementJs(end.ref)
+    : end.selector ? `document.querySelector(${JSON.stringify(end.selector)})`
+      : end.text ? textElementJs(end.text)
+        : 'null'
+
+const isElementEnd = (end) => hasRef(end) || !!end.selector || !!end.text
+const describe = (end) =>
+  hasRef(end) ? `[${end.ref}]` : end.selector || (end.text ? `「${end.text}」` : `(${end.x}, ${end.y})`)
+
+/** 一次 eval 算出两端的视口坐标，顺带判断是不是原生拖放。 */
+const PLAN_JS = (from, to) => `(async () => {
+  const src = ${elementJs(from)};
+  const dst = ${elementJs(to)};
+  if (${isElementEnd(from)} && !src) return { missing: 'from' };
+  if (${isElementEnd(to)} && !dst) return { missing: 'to' };
+  if (src) {
+    src.scrollIntoView({ block: 'nearest', inline: 'nearest', behavior: 'instant' });
+    // 后台标签页会暂停 rAF，定时器兜底
+    await new Promise((res) => { requestAnimationFrame(() => requestAnimationFrame(res)); setTimeout(res, 120); });
+  }
+  const mid = (el) => { const r = el.getBoundingClientRect(); return { x: r.left + r.width / 2, y: r.top + r.height / 2 }; };
+  const a = src ? mid(src) : { x: ${Number(from.x) || 0}, y: ${Number(from.y) || 0} };
+  const b = dst ? mid(dst) : { x: ${Number(to.x) || 0}, y: ${Number(to.y) || 0} };
+  const hit = src || document.elementFromPoint(a.x, a.y);
+  const native = !!(hit && hit.closest && hit.closest('[draggable="true"]'));
+  const inView = (p) => p.x >= 0 && p.y >= 0 && p.x <= innerWidth && p.y <= innerHeight;
+  return { a, b, native, aIn: inView(a), bIn: inView(b) };
+})()`
+
+/** HTML5 原生拖放：页面里合成整套 DragEvent。 */
+const NATIVE_JS = (from, to, a, b) => `(() => {
+  const start = ${elementJs(from)} || document.elementFromPoint(${a.x}, ${a.y});
+  const src = start.closest('[draggable="true"]') || start;
+  const tgt = ${elementJs(to)} || document.elementFromPoint(${b.x}, ${b.y});
+  if (!tgt) return { error: 'no-target' };
+  const dt = new DataTransfer();
+  const fire = (el, type, p) => el.dispatchEvent(new DragEvent(type, {
+    bubbles: true, cancelable: true, composed: true, clientX: p.x, clientY: p.y, dataTransfer: dt,
+  }));
+  const A = { x: ${a.x}, y: ${a.y} }, B = { x: ${b.x}, y: ${b.y} };
+  fire(src, 'dragstart', A);
+  fire(tgt, 'dragenter', B);
+  const accepted = !fire(tgt, 'dragover', B);   // 页面 preventDefault 了 dragover = 这里能放
+  fire(tgt, 'drop', B);
+  fire(src, 'dragend', B);
+  return { accepted };
+})()`
+
+/**
+ * @param from/to  { ref?, selector?, text?, x?, y? }
+ * @param cursor   可选：页内光标 { move(x, y, { duration?, straight?, label? }) → 滑行 ms, down(), up() }，
+ *                 让用户看得见在拖什么；任何一步出错都不影响真实拖拽
+ */
+export async function drag(call, tabId, from, to, { steps = 12, cursor } = {}) {
+  const plan = (await call('eval', { tabId, expression: PLAN_JS(from, to), userGesture: false })).value
+  if (!plan) throw new Error('页面没回话（可能刚跳转，重试一次）')
+  if (plan.missing) {
+    const end = plan.missing === 'from' ? from : to
+    throw new Error(`没找到${plan.missing === 'from' ? '起点' : '终点'} ${describe(end)}` +
+      (hasRef(end) ? '（编号可能已失效，重新 snapshot）' : ''))
+  }
+  const { a, b } = plan
+  if (!plan.bIn) throw new Error(`终点 ${describe(to)} 不在当前屏幕里——先滚动让起点和终点都露出来`)
+
+  const cur = async (fn) => {
+    if (!cursor) return 0
+    try { return Number(await fn(cursor)) || 0 } catch { return 0 }
+  }
+  // 光标先滑到起点亮名牌，到位了再按下
+  if (cursor) await sleep(Math.min(700, await cur((c) => c.move(a.x, a.y, { label: `拖拽 ${describe(from)} → ${describe(to)}` }))) + 60)
+
+  if (plan.native) {
+    await cur((c) => c.down())
+    await sleep(await cur((c) => c.move(b.x, b.y, { duration: 420, straight: true })))
+    const r = (await call('eval', { tabId, expression: NATIVE_JS(from, to, a, b) })).value
+    await cur((c) => c.up())
+    if (r && r.error) throw new Error('终点那里没有元素')
+    return `已拖拽 ${describe(from)} → ${describe(to)}（HTML5 拖放${r && r.accepted ? '，目标接受了' : '，但目标没表示接受——看看结果对不对'}）`
+  }
+
+  const mouse = (type, p, extra) => call('cdp', {
+    tabId,
+    method: 'Input.dispatchMouseEvent',
+    params: { type, x: Math.round(p.x), y: Math.round(p.y), ...extra },
+  })
+  await mouse('mouseMoved', a, { button: 'none', buttons: 0 })
+  await cur((c) => c.down())
+  await mouse('mousePressed', a, { button: 'left', buttons: 1, clickCount: 1 })
+  const n = Math.max(2, Math.min(60, Number(steps) || 12))
+  await cur((c) => c.move(b.x, b.y, { duration: n * 24, straight: true }))   // 光标和真实鼠标一起走
+  for (let i = 1; i <= n; i++) {
+    const p = { x: a.x + ((b.x - a.x) * i) / n, y: a.y + ((b.y - a.y) * i) / n }
+    await mouse('mouseMoved', p, { button: 'left', buttons: 1 })
+    await sleep(16)
+  }
+  await mouse('mouseReleased', b, { button: 'left', buttons: 0, clickCount: 1 })
+  await cur((c) => c.up())
+  return `已拖拽 ${describe(from)} → ${describe(to)}：(${Math.round(a.x)}, ${Math.round(a.y)}) → (${Math.round(b.x)}, ${Math.round(b.y)})`
+}

package/icon.svg

@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128" width="128" height="128">
+  <rect width="128" height="128" rx="28" fill="#4D6BFE"/>
+  <path d="M30 22 L30 96 L50 76 L65 112 L80 105 L65 70 L96 68 Z"
+        fill="#FFFFFF" stroke="#FFFFFF" stroke-width="4" stroke-linejoin="round"/>
+</svg>