@xiaou66/vite-plugin-vue-mcp-next 0.0.5 → 0.0.7

package/dist/runtime/client.d.cts

@@ -1,3 +1,39 @@
+/**
+ * 浏览器端 snapdom 截图降级能力。
+ *
+ * 该文件只在页面 runtime 中执行，适用于没有 CDP 但仍希望让 MCP 客户端看到页面视觉结果的场景；
+ * 函数型扩展通过 Vite import 路径加载，避免 Node 侧配置直接跨运行时传递函数。
+ */
+
+/**
+ * snapdom 函数边界。
+ *
+ * 只声明当前截图流程需要的最小能力，可以让本插件不绑定 snapdom 的完整内部类型。
+ */
+type SnapdomFunction = (element: Element, options: Record<string, unknown>) => Promise<{
+    toBlob: (options?: Record<string, unknown>) => Promise<Blob>;
+}>;
+/**
+ * snapdom 加载器。
+ *
+ * 该函数由 Vite 虚拟模块注册，避免发布包 runtime 直接 import optional peer 后触发 optimizeDeps 失败。
+ */
+type SnapdomLoader = () => Promise<{
+    snapdom: SnapdomFunction;
+}>;
+/**
+ * 注册截图扩展模块。
+ *
+ * Vite import 路径必须在宿主项目的 Vite 模块图里解析，适用于插件、filter、fallbackURL 需要使用 alias 或源码转换的场景。
+ */
+declare function setScreenshotModuleRegistry(registry: Record<string, Record<string, unknown>>): void;
+/**
+ * 注册 snapdom 加载器。
+ *
+ * 只有宿主 Vite 项目可以正确解析 optional peer，因此由虚拟 runtime 入口在浏览器侧注册。
+ */
+declare function setSnapdomLoader(loader: SnapdomLoader): void;
+
 /**
  * 运行时脚本执行请求。
  *
@@ -27,4 +63,4 @@ declare function evaluateExpression(request: RuntimeEvaluateRequest): Promise<un
  */
 declare function startRuntimeClient(): Promise<void>;
 
-export { type RuntimeEvaluateRequest, evaluateExpression, startRuntimeClient };
+export { type RuntimeEvaluateRequest, evaluateExpression, setScreenshotModuleRegistry, setSnapdomLoader, startRuntimeClient };

package/dist/runtime/client.d.ts

@@ -1,3 +1,39 @@
+/**
+ * 浏览器端 snapdom 截图降级能力。
+ *
+ * 该文件只在页面 runtime 中执行，适用于没有 CDP 但仍希望让 MCP 客户端看到页面视觉结果的场景；
+ * 函数型扩展通过 Vite import 路径加载，避免 Node 侧配置直接跨运行时传递函数。
+ */
+
+/**
+ * snapdom 函数边界。
+ *
+ * 只声明当前截图流程需要的最小能力，可以让本插件不绑定 snapdom 的完整内部类型。
+ */
+type SnapdomFunction = (element: Element, options: Record<string, unknown>) => Promise<{
+    toBlob: (options?: Record<string, unknown>) => Promise<Blob>;
+}>;
+/**
+ * snapdom 加载器。
+ *
+ * 该函数由 Vite 虚拟模块注册，避免发布包 runtime 直接 import optional peer 后触发 optimizeDeps 失败。
+ */
+type SnapdomLoader = () => Promise<{
+    snapdom: SnapdomFunction;
+}>;
+/**
+ * 注册截图扩展模块。
+ *
+ * Vite import 路径必须在宿主项目的 Vite 模块图里解析，适用于插件、filter、fallbackURL 需要使用 alias 或源码转换的场景。
+ */
+declare function setScreenshotModuleRegistry(registry: Record<string, Record<string, unknown>>): void;
+/**
+ * 注册 snapdom 加载器。
+ *
+ * 只有宿主 Vite 项目可以正确解析 optional peer，因此由虚拟 runtime 入口在浏览器侧注册。
+ */
+declare function setSnapdomLoader(loader: SnapdomLoader): void;
+
 /**
  * 运行时脚本执行请求。
  *
@@ -27,4 +63,4 @@ declare function evaluateExpression(request: RuntimeEvaluateRequest): Promise<un
  */
 declare function startRuntimeClient(): Promise<void>;
 
-export { type RuntimeEvaluateRequest, evaluateExpression, startRuntimeClient };
+export { type RuntimeEvaluateRequest, evaluateExpression, setScreenshotModuleRegistry, setSnapdomLoader, startRuntimeClient };

package/dist/runtime/client.js

@@ -300,119 +300,32 @@ function getRuntimePageIdentity(input) {
   };
 }
 
-// src/runtime/vueBridge.ts
-import {
-  devtools,
-  devtoolsRouterInfo,
-  devtoolsState,
-  getInspector,
-  stringify,
-  toggleHighPerfMode
-} from "@vue/devtools-kit";
-import { createRPCClient } from "vite-dev-rpc";
-
-// src/runtime/domSnapshot.ts
-function createDomSnapshot(root, options) {
-  let count = 0;
-  function visit(node, depth) {
-    if (count >= options.maxNodes || depth > options.maxDepth) {
-      return null;
-    }
-    if (node.nodeType === Node.TEXT_NODE) {
-      return createTextSnapshot(node, options, () => {
-        count += 1;
-      });
-    }
-    if (!(node instanceof Element)) {
-      return null;
-    }
-    const tag = node.tagName.toLowerCase();
-    if (["script", "style", "noscript"].includes(tag)) {
-      return null;
-    }
-    count += 1;
-    return createElementSnapshot(node, tag, (child) => visit(child, depth + 1));
-  }
-  return visit(root, 0) ?? { tag: root.tagName.toLowerCase() };
-}
-function queryDomElements(selector, limit) {
-  return Array.from(document.querySelectorAll(selector)).slice(0, limit).map((element) => ({
-    tag: element.tagName.toLowerCase(),
-    text: element.textContent.trim(),
-    attrs: collectAttrs(element),
-    rect: serializeRect(element.getBoundingClientRect())
-  }));
-}
-function createTextSnapshot(node, options, markVisited) {
-  const text = node.textContent?.trim();
-  if (!text) {
-    return null;
-  }
-  markVisited();
-  return { tag: "#text", text: truncateText(text, options.maxTextLength).text };
-}
-function createElementSnapshot(node, tag, visitChild) {
-  const attrs = collectAttrs(node);
-  const children = Array.from(node.childNodes).map((child) => visitChild(child)).filter((child) => Boolean(child));
-  return {
-    tag,
-    ...Object.keys(attrs).length ? { attrs } : {},
-    ...children.length ? { children } : {}
-  };
-}
-function collectAttrs(element) {
-  const attrs = {};
-  for (const attr of Array.from(element.attributes)) {
-    attrs[attr.name] = attr.value;
-  }
-  if (element instanceof HTMLInputElement && element.type === "password") {
-    attrs.value = "[masked]";
-  }
-  return attrs;
-}
-function serializeRect(rect) {
-  return {
-    x: rect.x,
-    y: rect.y,
-    width: rect.width,
-    height: rect.height,
-    top: rect.top,
-    right: rect.right,
-    bottom: rect.bottom,
-    left: rect.left
-  };
-}
-
-// src/runtime/evaluateExpression.ts
-async function evaluateExpression(request) {
-  const value = runExpression(request.expression);
-  const result = request.awaitPromise === false ? value : await Promise.resolve(value);
-  return Promise.race([
-    Promise.resolve(result),
-    createTimeout(request.timeoutMs)
-  ]);
+// src/runtime/screenshot.ts
+var snapdomLoader = () => Promise.reject(createMissingSnapdomError());
+var screenshotModuleRegistry = {};
+function setScreenshotModuleRegistry(registry) {
+  screenshotModuleRegistry = registry;
 }
-function runExpression(expression) {
-  return new Function(`return (${expression})`)();
+function setSnapdomLoader(loader) {
+  snapdomLoader = loader;
 }
-function createTimeout(timeoutMs) {
-  return new Promise((_, reject) => {
-    window.setTimeout(() => {
-      reject(
-        new Error(`evaluate_script timed out after ${String(timeoutMs)}ms`)
-      );
-    }, timeoutMs);
-  });
-}
-
-// src/runtime/screenshot.ts
 async function takeRuntimeScreenshot(options) {
   const target = resolveScreenshotTarget(options.target, options.selector);
   if (!target.ok) {
     return target;
   }
   const loadSnapdom = options.loadSnapdom ?? loadDefaultSnapdom;
-  const { snapdom } = await loadSnapdom();
+  let loaded;
+  try {
+    loaded = await loadSnapdom();
+  } catch (error) {
+    return {
+      ok: false,
+      source: "snapdom",
+      error: error instanceof Error ? error.message : String(error)
+    };
+  }
+  const { snapdom } = loaded;
   const snapdomOptions = await createSnapdomOptions(options);
   const capture = await snapdom(target.element, snapdomOptions);
   const blob = await capture.toBlob({
@@ -435,8 +348,8 @@ async function takeRuntimeScreenshot(options) {
     ]
   };
 }
-async function loadDefaultSnapdom() {
-  return import("@zumer/snapdom");
+function loadDefaultSnapdom() {
+  return snapdomLoader();
 }
 function resolveScreenshotTarget(target, selector) {
   if (target === "element" && !selector) {
@@ -483,14 +396,12 @@ async function loadSnapdomPlugins(options) {
 function createModuleLoader(options) {
   return options.loadModule ?? loadConfiguredModule;
 }
-async function loadConfiguredModule(path) {
-  const config = await import("virtual:vite-plugin-vue-mcp-next/screenshot-config");
-  const registry = config.screenshotModuleRegistry;
-  const mod = registry[path];
+function loadConfiguredModule(path) {
+  const mod = screenshotModuleRegistry[path];
   if (!mod) {
     throw new Error(`screenshot module is not registered: ${path}`);
   }
-  return mod;
+  return Promise.resolve(mod);
 }
 async function loadPluginImport(plugin, loadModule) {
   const normalized = typeof plugin === "string" ? { path: plugin, exportName: "default" } : { exportName: "default", ...plugin };
@@ -523,6 +434,116 @@ function removeUndefinedEntries(value) {
     Object.entries(value).filter(([, item]) => item !== void 0)
   );
 }
+function createMissingSnapdomError() {
+  return new Error(
+    "\u7F3A\u5C11\u53EF\u9009\u4F9D\u8D56 @zumer/snapdom\u3002DOM \u622A\u56FE\u964D\u7EA7\u9700\u8981\u8BE5\u4F9D\u8D56\uFF0C\u8BF7\u6267\u884C\uFF1Apnpm add -D @zumer/snapdom"
+  );
+}
+
+// src/runtime/vueBridge.ts
+import {
+  devtools,
+  devtoolsRouterInfo,
+  devtoolsState,
+  getInspector,
+  stringify,
+  toggleHighPerfMode
+} from "@vue/devtools-kit";
+import { createRPCClient } from "vite-dev-rpc";
+
+// src/runtime/domSnapshot.ts
+function createDomSnapshot(root, options) {
+  let count = 0;
+  function visit(node, depth) {
+    if (count >= options.maxNodes || depth > options.maxDepth) {
+      return null;
+    }
+    if (node.nodeType === Node.TEXT_NODE) {
+      return createTextSnapshot(node, options, () => {
+        count += 1;
+      });
+    }
+    if (!(node instanceof Element)) {
+      return null;
+    }
+    const tag = node.tagName.toLowerCase();
+    if (["script", "style", "noscript"].includes(tag)) {
+      return null;
+    }
+    count += 1;
+    return createElementSnapshot(node, tag, (child) => visit(child, depth + 1));
+  }
+  return visit(root, 0) ?? { tag: root.tagName.toLowerCase() };
+}
+function queryDomElements(selector, limit) {
+  return Array.from(document.querySelectorAll(selector)).slice(0, limit).map((element) => ({
+    tag: element.tagName.toLowerCase(),
+    text: element.textContent.trim(),
+    attrs: collectAttrs(element),
+    rect: serializeRect(element.getBoundingClientRect())
+  }));
+}
+function createTextSnapshot(node, options, markVisited) {
+  const text = node.textContent?.trim();
+  if (!text) {
+    return null;
+  }
+  markVisited();
+  return { tag: "#text", text: truncateText(text, options.maxTextLength).text };
+}
+function createElementSnapshot(node, tag, visitChild) {
+  const attrs = collectAttrs(node);
+  const children = Array.from(node.childNodes).map((child) => visitChild(child)).filter((child) => Boolean(child));
+  return {
+    tag,
+    ...Object.keys(attrs).length ? { attrs } : {},
+    ...children.length ? { children } : {}
+  };
+}
+function collectAttrs(element) {
+  const attrs = {};
+  for (const attr of Array.from(element.attributes)) {
+    attrs[attr.name] = attr.value;
+  }
+  if (element instanceof HTMLInputElement && element.type === "password") {
+    attrs.value = "[masked]";
+  }
+  return attrs;
+}
+function serializeRect(rect) {
+  return {
+    x: rect.x,
+    y: rect.y,
+    width: rect.width,
+    height: rect.height,
+    top: rect.top,
+    right: rect.right,
+    bottom: rect.bottom,
+    left: rect.left
+  };
+}
+
+// src/runtime/evaluateExpression.ts
+async function evaluateExpression(request) {
+  const value = runExpression(request.expression);
+  const result = request.awaitPromise === false ? value : await Promise.resolve(value);
+  return Promise.race([
+    Promise.resolve(result),
+    createTimeout(request.timeoutMs)
+  ]);
+}
+function runExpression(expression) {
+  return new Function(`return (${expression})`)();
+}
+function createTimeout(timeoutMs) {
+  return new Promise((_, reject) => {
+    window.setTimeout(() => {
+      reject(
+        new Error(`evaluate_script timed out after ${String(timeoutMs)}ms`)
+      );
+    }, timeoutMs);
+  });
+}
 
 // src/runtime/devtoolsBridge.ts
 function createRuntimeDevtoolsRpc(getRpc) {
@@ -545,6 +566,13 @@ function createRuntimeDevtoolsRpc(getRpc) {
       );
     },
     onDomQueryUpdated: () => void 0,
+    reloadPage(options) {
+      getRpc().onPageReloaded(options.event, { ok: true, source: "hook" });
+      setTimeout(() => {
+        window.location.reload();
+      }, 0);
+    },
+    onPageReloaded: () => void 0,
     async evaluateScript(options) {
       try {
         getRpc().onEvaluateScriptUpdated(options.event, {
@@ -800,6 +828,8 @@ async function startRuntimeClient() {
 }
 export {
   evaluateExpression,
+  setScreenshotModuleRegistry,
+  setSnapdomLoader,
   startRuntimeClient
 };
 //# sourceMappingURL=client.js.map