dsh-quote-followup 0.2.5 → 0.2.7

package/README.md

@@ -4,6 +4,7 @@ English | [中文](README.zh.md)
 
 [![npm version](https://img.shields.io/npm/v/dsh-quote-followup.svg)](https://www.npmjs.com/package/dsh-quote-followup)
 [![license](https://img.shields.io/npm/l/dsh-quote-followup.svg)](LICENSE)
+[![DSH Market](https://raw.githubusercontent.com/2BingLing/dsh-market/master/assets/readme/badge-listed-en.svg)](https://dsh.market/)
 
 A Web-only [DeepSeek Harness](https://github.com/deepseek-ai/deepseek-harness) plugin for quoting selected conversation text into the composer and asking a focused follow-up.
 
@@ -58,6 +59,8 @@ npm test
 
 The regression harness covers compact native quote chips, locale switching, turn-number provenance with graceful degradation, repeated quoting, spacing after an existing draft, codec serialization, the Firefox text fallback, and current-client takeover of stale singleton/button state after a hot swap.
 
+An opt-in [assembled DSH Web regression](https://github.com/tr1v3r/dsh-quote-followup/blob/master/test/integration/README.md) runs the plugin through a pinned, built DSH checkout with Chromium. It covers existing drafts, repeated quoting, undo/redo, session isolation, prompt serialization, and Host-driven unavailable input.
+
 ## License
 
 MIT

package/README.zh.md

@@ -4,6 +4,7 @@
 
 [![npm version](https://img.shields.io/npm/v/dsh-quote-followup.svg)](https://www.npmjs.com/package/dsh-quote-followup)
 [![license](https://img.shields.io/npm/l/dsh-quote-followup.svg)](LICENSE)
+[![DSH Market](https://raw.githubusercontent.com/2BingLing/dsh-market/master/assets/readme/badge-listed-zh.svg)](https://dsh.market/)
 
 一个仅支持 Web 的 [DeepSeek Harness](https://github.com/deepseek-ai/deepseek-harness) 插件：选中对话文本，将其追加到输入框，再进行针对性追问。
 
@@ -58,6 +59,8 @@ npm test
 
 回归测试覆盖精简的原生引用 chip、中英文 locale 切换、轮次溯源与降级、连续引用、已有草稿后的间距、codec 序列化、Firefox 文本降级路径，以及热替换后新版 client 接管旧按钮/单例状态。
 
+可选的[真实 DSH Web 集成回归](https://github.com/tr1v3r/dsh-quote-followup/blob/master/test/integration/README.md)通过固定版本、已构建的 DSH 和 Chromium 加载插件，验证已有草稿、连续引用、撤销重做、会话隔离、发送序列化及 Host 驱动的不可写输入状态。
+
 ## 许可证
 
 MIT

package/lib/client.js

@@ -7,9 +7,11 @@
  * can edit before sending — a visible, targeted follow-up with zero hidden
  * state and zero host-side privileges.
  *
- * Pure DOM (no React), so the module carries no platform dependencies:
- * `inject: []`. Mounted by the web client runtime through the package's
- * `dsh.client` declaration (`platform: "web"`).
+ * Pure DOM (no React). The only injected host services are DSH's
+ * `inputTriggers` codec registry and `locale` (both optional — the module
+ * degrades to English text fallbacks when either is absent). Mounted by the
+ * web client runtime through the package's `dsh.client` declaration
+ * (`platform: "web"`).
  *
  * @module dsh-quote-followup/client
  */
@@ -33,7 +35,11 @@ window.__ModuleLoader__.load({
 		];
 		const BUTTON_ID = "dsh-quote-followup-btn";
 		const BUTTON_VERSION_ATTR = "data-dsh-quote-followup-version";
-		const CLIENT_VERSION = "0.2.5";
+		const CLIENT_VERSION = "0.2.7";
+		/** Shared <style> element; versioned like the button so hot-swaps replace it. */
+		const STYLE_ID = "dsh-quote-followup-style";
+		const STYLE_VERSION_ATTR = "data-dsh-quote-followup-style-version";
+		const BUTTON_CLASS = "dsh-qf-btn";
 		/** Codec owner for native DSH reference chips. */
 		const QUOTE_SOURCE = "quote-followup";
 		const LOCALE_NS = "quote-followup";
@@ -44,6 +50,8 @@ window.__ModuleLoader__.load({
 				"button.title": "引用选中内容到输入框（可多次引用，发送前可编辑）",
 				"quote.header": "引用",
 				"conversation.role": "对话",
+				"conversation.role.user": "用户",
+				"conversation.role.assistant": "助手",
 				"quote.turn": "第 {n} 轮",
 				"quote.truncated": "已截断"
 			},
@@ -52,6 +60,8 @@ window.__ModuleLoader__.load({
 				"button.title": "Quote the selection into the composer (repeatable; editable before sending)",
 				"quote.header": "Quote",
 				"conversation.role": "conversation",
+				"conversation.role.user": "user",
+				"conversation.role.assistant": "assistant",
 				"quote.turn": "turn {n}",
 				"quote.truncated": "truncated"
 			}
@@ -66,6 +76,19 @@ window.__ModuleLoader__.load({
 			const element = elementOf(node);
 			return element === null ? null : element.closest(TRANSCRIPT_SELECTOR);
 		};
+		/** Walk from a range endpoint up to (but excluding) the transcript. */
+		const walkAncestors = (node, transcript, visit) => {
+			let element = elementOf(node);
+			while (element !== null && element !== transcript) {
+				const found = visit(element);
+				if (found !== undefined)
+					return found;
+				element = element.parentElement;
+			}
+			return null;
+		};
+		/** A turn marker is only meaningful as a non-negative safe integer. */
+		const isValidTurn = (turn) => Number.isSafeInteger(turn) && turn >= 0;
 		/** The live selection when BOTH ends sit inside the same transcript. */
 		const selectionInTranscript = (selection) => {
 			if (selection === null || selection.isCollapsed || selection.rangeCount === 0)
@@ -81,9 +104,8 @@ window.__ModuleLoader__.load({
 		 * looking for role markers (data attributes, then class-name hints).
 		 * Null → the generic "对话" label; this is display-only metadata.
 		 */
-		const detectRole = (range, transcript) => {
-			let element = elementOf(range.startContainer);
-			while (element !== null && element !== transcript) {
+		const detectRole = (range, transcript) =>
+			walkAncestors(range.startContainer, transcript, (element) => {
 				const role = element.getAttribute?.("data-role") ?? element.getAttribute?.("data-message-role");
 				if (typeof role === "string" && role !== "") {
 					if (/user|human/i.test(role)) return "user";
@@ -92,11 +114,9 @@ window.__ModuleLoader__.load({
 				const cls = String(element.className ?? "");
 				if (/(^|[\s_-])user([\s_-]|$)/i.test(cls)) return "user";
 				if (/(^|[\s_-])assistant([\s_-]|$)/i.test(cls)) return "assistant";
-				element = element.parentElement;
-			}
-			return null;
-		};
-		const roleLabel = (role, t) => role === "user" ? "user" : role === "assistant" ? "assistant" : t("conversation.role");
+				return undefined;
+			});
+		const roleLabel = (role, t) => role === "user" ? t("conversation.role.user") : role === "assistant" ? t("conversation.role.assistant") : t("conversation.role");
 		/**
 		 * Conversation-turn provenance: DSH's chat renderer stamps every message
 		 * row with `data-chat-turn` (a per-session monotonic ordinal). Resolving
@@ -104,19 +124,16 @@ window.__ModuleLoader__.load({
 		 * host-side message-id API. Absent / non-numeric markers degrade to null
 		 * and the serialized frame stays exactly as before.
 		 */
-		const detectTurn = (range, transcript) => {
-			let element = elementOf(range.startContainer);
-			while (element !== null && element !== transcript) {
+		const detectTurn = (range, transcript) =>
+			walkAncestors(range.startContainer, transcript, (element) => {
 				const raw = element.getAttribute?.("data-chat-turn");
 				if (typeof raw === "string" && raw !== "") {
 					const turn = Number(raw);
-					if (Number.isSafeInteger(turn) && turn >= 0)
+					if (isValidTurn(turn))
 						return turn;
 				}
-				element = element.parentElement;
-			}
-			return null;
-		};
+				return undefined;
+			});
 		/** Bound one quote before it becomes editor state. */
 		const quotePayload = (text, role, turn) => {
 			let body = String(text ?? "");
@@ -125,28 +142,32 @@ window.__ModuleLoader__.load({
 				body = body.slice(0, QUOTE_MAX_CHARS);
 				truncated = true;
 			}
-			return { text: body, role, truncated, turn: Number.isSafeInteger(turn) && turn >= 0 ? turn : null };
+			return { text: body, role, truncated, turn: isValidTurn(turn) ? turn : null };
 		};
 		/** Model / clipboard projection. The composer shows a chip, not this frame. */
 		const quoteFrame = ({ text, role, truncated, turn }, t) => {
 			const lines = text.split("\n").map((line) => `> ${line}`.trimEnd());
 			const meta = [t("quote.header"), roleLabel(role, t)];
-			if (Number.isSafeInteger(turn) && turn >= 0)
+			if (isValidTurn(turn))
 				meta.push(String(t("quote.turn")).replace("{n}", String(turn)));
 			if (truncated)
 				meta.push(t("quote.truncated"));
 			return `> [${meta.join(" · ")}]\n${lines.join("\n")}\n\n`;
 		};
 		const decodeQuote = (ref) => {
-			const value = JSON.parse(ref);
-			if (value === null || typeof value !== "object" || typeof value.text !== "string")
-				throw new Error("invalid quote-followup reference");
-			return {
-				text: value.text,
-				role: value.role === "user" || value.role === "assistant" ? value.role : null,
-				truncated: value.truncated === true,
-				turn: Number.isSafeInteger(value.turn) && value.turn >= 0 ? value.turn : null
-			};
+			try {
+				const value = JSON.parse(ref);
+				if (value === null || typeof value !== "object" || typeof value.text !== "string")
+					return null;
+				return {
+					text: value.text,
+					role: value.role === "user" || value.role === "assistant" ? value.role : null,
+					truncated: value.truncated === true,
+					turn: isValidTurn(value.turn) ? value.turn : null
+				};
+			} catch {
+				return null;
+			}
 		};
 		const quoteInsert = (payload, t) => {
 			const clipboardText = quoteFrame(payload, t);
@@ -162,17 +183,24 @@ window.__ModuleLoader__.load({
 			};
 		};
 		/** Codec-only source: it owns quote chips but intentionally adds no @ candidates. */
-		const makeQuoteSource = (t) => ({
-			trigger: "@",
-			name: QUOTE_SOURCE,
-			order: 1000,
-			candidates: () => Promise.resolve([]),
-			onPick: () => void 0,
-			codec: {
-				clipboardText: (ref) => quoteFrame(decodeQuote(ref), t),
-				serialize: (ref) => Promise.resolve(quoteFrame(decodeQuote(ref), t))
-			}
-		});
+		const makeQuoteSource = (t) => {
+			/** Project a chip ref to Markdown, degrading to "" for malformed refs. */
+			const project = (ref) => {
+				const payload = decodeQuote(ref);
+				return payload === null ? "" : quoteFrame(payload, t);
+			};
+			return {
+				trigger: "@",
+				name: QUOTE_SOURCE,
+				order: 1000,
+				candidates: () => Promise.resolve([]),
+				onPick: () => void 0,
+				codec: {
+					clipboardText: project,
+					serialize: (ref) => Promise.resolve(project(ref))
+				}
+			};
+		};
 		const findComposer = () => {
 			for (const selector of COMPOSER_SELECTORS) {
 				const element = document.querySelector(selector);
@@ -334,7 +362,67 @@ window.__ModuleLoader__.load({
 		let pendingQuote = null;
 		let quoteSourceReady = false;
 		let currentT = fallbackT;
+		/**
+		 * Inject the button stylesheet once per client version. Visuals follow
+		 * the dsh-annotation convention: a single idempotent <style> element
+		 * built on DSH Web design tokens (--dsw-alias-* / --dsw-specific-*),
+		 * so the pill tracks the active theme instead of hard-coded colors.
+		 * The trailing fallbacks only engage when a token is renamed upstream.
+		 * Without a real document.head (test fakes) the button still works,
+		 * just unstyled.
+		 */
+		const ensureStyles = () => {
+			const head = document.head;
+			if (head === null || typeof head.appendChild !== "function")
+				return;
+			const existing = document.getElementById(STYLE_ID);
+			if (existing !== null) {
+				if (existing.getAttribute(STYLE_VERSION_ATTR) === CLIENT_VERSION)
+					return;
+				existing.remove();
+			}
+			const style = document.createElement("style");
+			style.id = STYLE_ID;
+			style.setAttribute(STYLE_VERSION_ATTR, CLIENT_VERSION);
+			style.textContent = [
+				`.${BUTTON_CLASS} {`,
+				"  position: fixed;",
+				"  z-index: 2147483600;",
+				"  display: inline-flex;",
+				"  align-items: center;",
+				"  gap: 6px;",
+				"  height: 28px;",
+				"  padding: 0 12px;",
+				"  border: none;",
+				"  border-radius: 14px;",
+				"  background: var(--dsw-alias-button-primary-fill, rgba(56, 56, 62, .94));",
+				"  color: var(--dsw-alias-label-primary-foreground, #f5f5f7);",
+				"  font-family: var(--dsw-font-family, system-ui);",
+				"  font-size: 12px;",
+				"  line-height: 18px;",
+				"  white-space: nowrap;",
+				"  cursor: pointer;",
+				"  box-shadow: var(--dsw-shadow-lv3, 0 2px 10px rgba(0, 0, 0, .28));",
+				"  user-select: none;",
+				"  animation: dsh-qf-pop .12s var(--ds-ease-in-out, ease);",
+				"}",
+				`.${BUTTON_CLASS}:hover:not(:disabled) {`,
+				"  background: var(--dsw-alias-button-primary-hover, rgba(72, 72, 80, .96));",
+				"}",
+				`.${BUTTON_CLASS}:active { filter: brightness(.92); }`,
+				`.${BUTTON_CLASS}:focus-visible {`,
+				"  outline: 2px solid var(--dsw-alias-text-accent, #4c9aff);",
+				"  outline-offset: 1px;",
+				"}",
+				"@keyframes dsh-qf-pop {",
+				"  from { opacity: 0; transform: translateY(3px); }",
+				"  to { opacity: 1; transform: none; }",
+				"}"
+			].join("\n");
+			head.appendChild(style);
+		};
 		const ensureButton = () => {
+			ensureStyles();
 			const existing = document.getElementById(BUTTON_ID);
 			if (existing?.getAttribute(BUTTON_VERSION_ATTR) === CLIENT_VERSION)
 				return existing;
@@ -343,23 +431,10 @@ window.__ModuleLoader__.load({
 			button.id = BUTTON_ID;
 			button.setAttribute(BUTTON_VERSION_ATTR, CLIENT_VERSION);
 			button.type = "button";
+			button.className = BUTTON_CLASS;
 			button.textContent = currentT("button.label");
 			button.title = currentT("button.title");
-			Object.assign(button.style, {
-				position: "fixed",
-				zIndex: "2147483600",
-				padding: "3px 10px",
-				fontSize: "12px",
-				lineHeight: "20px",
-				borderRadius: "6px",
-				border: "1px solid rgba(140,140,150,.45)",
-				background: "rgba(56,56,62,.94)",
-				color: "#f5f5f7",
-				cursor: "pointer",
-				boxShadow: "0 2px 10px rgba(0,0,0,.28)",
-				userSelect: "none",
-				display: "none"
-			});
+			button.style.display = "none";
 			button.addEventListener("mousedown", (event) => {
 				event.preventDefault();
 				event.stopPropagation();
@@ -373,14 +448,21 @@ window.__ModuleLoader__.load({
 			return button;
 		};
 		const placeButton = (button, rect) => {
-			let x = rect.left + rect.width / 2 - 30;
-			let y = rect.top - 28;
+			// Reveal before measuring: offsetWidth of a display:none element is 0,
+			// and the fixed-width guard below keeps fake DOMs (no layout) working.
+			button.style.display = "inline-flex";
+			const width = Number.isFinite(button.offsetWidth) && button.offsetWidth > 0
+				? button.offsetWidth
+				: 64;
+			// Center on the selection; measurement guards keep fake/hidden
+			// elements (offsetWidth 0 / undefined) on the old fixed-width path.
+			let x = rect.left + rect.width / 2 - width / 2;
+			let y = rect.top - 34; // pill height (28px) + 6px gap
 			if (y < 4)
 				y = rect.bottom + 6;
-			x = Math.max(4, Math.min(x, window.innerWidth - 70));
+			x = Math.max(4, Math.min(x, window.innerWidth - width - 4));
 			button.style.left = `${Math.round(x)}px`;
 			button.style.top = `${Math.round(y)}px`;
-			button.style.display = "block";
 		};
 		const hideButton = () => {
 			const button = document.getElementById(BUTTON_ID);
@@ -504,6 +586,9 @@ window.__ModuleLoader__.load({
 				const button = document.getElementById(BUTTON_ID);
 				if (button?.getAttribute(BUTTON_VERSION_ATTR) === CLIENT_VERSION)
 					button.remove();
+				const style = document.getElementById(STYLE_ID);
+				if (style?.getAttribute(STYLE_VERSION_ATTR) === CLIENT_VERSION)
+					style.remove();
 				if (globalThis[STATE] === state)
 					delete globalThis[STATE];
 			};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-quote-followup",
-  "version": "0.2.5",
+  "version": "0.2.7",
   "description": "Quote selected Web conversation text into the DeepSeek Harness composer for targeted follow-up turns.",
   "keywords": [
     "dsh",
@@ -11,7 +11,8 @@
     "follow-up"
   ],
   "scripts": {
-    "test": "node --check lib/index.js && node --check lib/client.js && node test/web-repeat-harness.mjs"
+    "test": "node --check lib/index.js && node --check lib/client.js && node test/web-repeat-harness.mjs",
+    "test:assembled-web": "node test/run-assembled-web.mjs"
   },
   "type": "module",
   "main": "lib/index.js",