dsh-quote-followup 0.2.6 → 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

@@ -35,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.6";
+		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";
@@ -358,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;
@@ -367,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();
@@ -397,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);
@@ -528,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.6",
+  "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",