@xiaou66/vite-plugin-vue-mcp-next 1.1.1 → 1.2.0

package/dist/runtime/client.js

@@ -1,105 +1,6 @@
 // src/runtime/client.ts
 import { createHotContext } from "vite-hot-client";
 
-// src/shared/limits.ts
-var DEFAULT_DOM_MAX_DEPTH = 8;
-var DEFAULT_DOM_MAX_NODES = 2e3;
-var DEFAULT_DOM_MAX_TEXT_LENGTH = 300;
-var DEFAULT_CONSOLE_MAX_RECORDS = 1e3;
-var DEFAULT_NETWORK_MAX_RECORDS = 500;
-var DEFAULT_NETWORK_MAX_BODY_SIZE = 1e5;
-var DEFAULT_MASK_HEADERS = [
-  "authorization",
-  "cookie",
-  "set-cookie"
-];
-
-// src/constants.ts
-var DEFAULT_MCP_PATH = "/__mcp";
-var DEFAULT_SCREENSHOT_MAX_BYTES = 5 * 1024 * 1024;
-var DEFAULT_SCREENSHOT_SAVE_DIR = ".vite-mcp/screenshot";
-var DEFAULT_PERFORMANCE_SAVE_DIR = ".vite-mcp/performance";
-var DEFAULT_PERFORMANCE_MAX_DURATION_MS = 3e4;
-var DEFAULT_PERFORMANCE_SAMPLE_INTERVAL_MS = 250;
-var DEFAULT_PERFORMANCE_LONG_TASK_THRESHOLD_MS = 50;
-var VIRTUAL_RUNTIME_ID = "virtual:vite-plugin-vue-mcp-next/runtime";
-var RESOLVED_VIRTUAL_RUNTIME_ID = `\0${VIRTUAL_RUNTIME_ID}`;
-var VIRTUAL_SCREENSHOT_CONFIG_ID = "virtual:vite-plugin-vue-mcp-next/screenshot-config";
-var RESOLVED_VIRTUAL_SCREENSHOT_CONFIG_ID = `\0${VIRTUAL_SCREENSHOT_CONFIG_ID}`;
-var VIRTUAL_SNAPDOM_LOADER_ID = "virtual:vite-plugin-vue-mcp-next/snapdom-loader";
-var RESOLVED_VIRTUAL_SNAPDOM_LOADER_ID = `\0${VIRTUAL_SNAPDOM_LOADER_ID}`;
-var DEFAULT_MCP_CLIENT_SERVER_NAME = "vite-mcp-next";
-var RUNTIME_PAGE_CONNECTED_EVENT = "vite-plugin-vue-mcp-next:page-connected";
-var RUNTIME_PAGE_DISCONNECTED_EVENT = "vite-plugin-vue-mcp-next:page-disconnected";
-var RUNTIME_PAGE_HEARTBEAT_EVENT = "vite-plugin-vue-mcp-next:heartbeat";
-var DEFAULT_RUNTIME_PAGE_HEARTBEAT_INTERVAL_MS = 15e3;
-var DEFAULT_OPTIONS = {
-  mcpPath: DEFAULT_MCP_PATH,
-  host: "localhost",
-  printUrl: true,
-  updateCursorMcpJson: {
-    enabled: true,
-    serverName: DEFAULT_MCP_CLIENT_SERVER_NAME
-  },
-  mcpClients: {
-    cursor: true,
-    codex: true,
-    claudeCode: true,
-    trae: true,
-    serverName: DEFAULT_MCP_CLIENT_SERVER_NAME
-  },
-  skill: {
-    autoConfig: true
-  },
-  runtime: {
-    mode: "auto",
-    evaluate: {
-      enabled: false,
-      timeoutMs: 3e3
-    }
-  },
-  cdp: {},
-  network: {
-    mode: "auto",
-    maxRecords: DEFAULT_NETWORK_MAX_RECORDS,
-    captureRequestBody: true,
-    captureResponseBody: true,
-    maxBodySize: DEFAULT_NETWORK_MAX_BODY_SIZE,
-    maskHeaders: [...DEFAULT_MASK_HEADERS]
-  },
-  dom: {
-    maxDepth: DEFAULT_DOM_MAX_DEPTH,
-    maxNodes: DEFAULT_DOM_MAX_NODES,
-    maxTextLength: DEFAULT_DOM_MAX_TEXT_LENGTH
-  },
-  console: {
-    maxRecords: DEFAULT_CONSOLE_MAX_RECORDS
-  },
-  screenshot: {
-    type: "path",
-    saveDir: DEFAULT_SCREENSHOT_SAVE_DIR,
-    prefer: "auto",
-    maxBytes: DEFAULT_SCREENSHOT_MAX_BYTES,
-    snapdom: {
-      options: {},
-      plugins: []
-    }
-  },
-  performance: {
-    mode: "auto",
-    maxDurationMs: DEFAULT_PERFORMANCE_MAX_DURATION_MS,
-    sampleIntervalMs: DEFAULT_PERFORMANCE_SAMPLE_INTERVAL_MS,
-    longTaskThresholdMs: DEFAULT_PERFORMANCE_LONG_TASK_THRESHOLD_MS,
-    saveDir: DEFAULT_PERFORMANCE_SAVE_DIR,
-    memory: {
-      enabled: true
-    },
-    stacks: {
-      enabled: true
-    }
-  }
-};
-
 // src/runtime/consoleHook.ts
 import { nanoid } from "nanoid";
 
@@ -455,6 +356,101 @@ function getRuntimePageIdentity(input) {
 // src/runtime/performanceHook.ts
 import { nanoid as nanoid4 } from "nanoid";
 
+// src/shared/limits.ts
+var DEFAULT_DOM_MAX_DEPTH = 8;
+var DEFAULT_DOM_MAX_NODES = 2e3;
+var DEFAULT_DOM_MAX_TEXT_LENGTH = 300;
+var DEFAULT_CONSOLE_MAX_RECORDS = 1e3;
+var DEFAULT_NETWORK_MAX_RECORDS = 500;
+var DEFAULT_NETWORK_MAX_BODY_SIZE = 1e5;
+var DEFAULT_MASK_HEADERS = [
+  "authorization",
+  "cookie",
+  "set-cookie"
+];
+
+// src/constants.ts
+var DEFAULT_MCP_PATH = "/__mcp";
+var DEFAULT_SCREENSHOT_MAX_BYTES = 5 * 1024 * 1024;
+var DEFAULT_SCREENSHOT_SAVE_DIR = ".vite-mcp/screenshot";
+var DEFAULT_PERFORMANCE_SAVE_DIR = ".vite-mcp/performance";
+var DEFAULT_PERFORMANCE_MAX_DURATION_MS = 3e4;
+var DEFAULT_PERFORMANCE_SAMPLE_INTERVAL_MS = 250;
+var DEFAULT_PERFORMANCE_LONG_TASK_THRESHOLD_MS = 50;
+var VIRTUAL_RUNTIME_ID = "virtual:vite-plugin-vue-mcp-next/runtime";
+var RESOLVED_VIRTUAL_RUNTIME_ID = `\0${VIRTUAL_RUNTIME_ID}`;
+var VIRTUAL_SCREENSHOT_CONFIG_ID = "virtual:vite-plugin-vue-mcp-next/screenshot-config";
+var RESOLVED_VIRTUAL_SCREENSHOT_CONFIG_ID = `\0${VIRTUAL_SCREENSHOT_CONFIG_ID}`;
+var VIRTUAL_SNAPDOM_LOADER_ID = "virtual:vite-plugin-vue-mcp-next/snapdom-loader";
+var RESOLVED_VIRTUAL_SNAPDOM_LOADER_ID = `\0${VIRTUAL_SNAPDOM_LOADER_ID}`;
+var DEFAULT_MCP_CLIENT_SERVER_NAME = "vite-mcp-next";
+var DEFAULT_OPTIONS = {
+  mcpPath: DEFAULT_MCP_PATH,
+  host: "localhost",
+  printUrl: true,
+  updateCursorMcpJson: {
+    enabled: true,
+    serverName: DEFAULT_MCP_CLIENT_SERVER_NAME
+  },
+  mcpClients: {
+    cursor: true,
+    codex: true,
+    claudeCode: true,
+    trae: true,
+    serverName: DEFAULT_MCP_CLIENT_SERVER_NAME
+  },
+  skill: {
+    autoConfig: true
+  },
+  runtime: {
+    mode: "auto",
+    evaluate: {
+      enabled: false,
+      timeoutMs: 3e3
+    }
+  },
+  cdp: {},
+  network: {
+    mode: "auto",
+    maxRecords: DEFAULT_NETWORK_MAX_RECORDS,
+    captureRequestBody: true,
+    captureResponseBody: true,
+    maxBodySize: DEFAULT_NETWORK_MAX_BODY_SIZE,
+    maskHeaders: [...DEFAULT_MASK_HEADERS]
+  },
+  dom: {
+    maxDepth: DEFAULT_DOM_MAX_DEPTH,
+    maxNodes: DEFAULT_DOM_MAX_NODES,
+    maxTextLength: DEFAULT_DOM_MAX_TEXT_LENGTH
+  },
+  console: {
+    maxRecords: DEFAULT_CONSOLE_MAX_RECORDS
+  },
+  screenshot: {
+    type: "path",
+    saveDir: DEFAULT_SCREENSHOT_SAVE_DIR,
+    prefer: "auto",
+    maxBytes: DEFAULT_SCREENSHOT_MAX_BYTES,
+    snapdom: {
+      options: {},
+      plugins: []
+    }
+  },
+  performance: {
+    mode: "auto",
+    maxDurationMs: DEFAULT_PERFORMANCE_MAX_DURATION_MS,
+    sampleIntervalMs: DEFAULT_PERFORMANCE_SAMPLE_INTERVAL_MS,
+    longTaskThresholdMs: DEFAULT_PERFORMANCE_LONG_TASK_THRESHOLD_MS,
+    saveDir: DEFAULT_PERFORMANCE_SAVE_DIR,
+    memory: {
+      enabled: true
+    },
+    stacks: {
+      enabled: true
+    }
+  }
+};
+
 // src/performance/summary.ts
 function buildPerformanceSummary(input) {
   const memory = buildMemorySummary(input.memorySamples);
@@ -1096,6 +1092,390 @@ function createTimeout(timeoutMs) {
   });
 }
 
+// src/runtime/storageBridge.ts
+function createRuntimeStorageBridge(env) {
+  return {
+    async manageStorage(request) {
+      try {
+        return await manageRuntimeStorage(env, request);
+      } catch (error) {
+        return createRuntimeStorageError(
+          request,
+          error instanceof Error ? error.message : String(error)
+        );
+      }
+    }
+  };
+}
+async function manageRuntimeStorage(env, request) {
+  if (request.origin !== env.origin) {
+    return createRuntimeStorageError(
+      request,
+      "Runtime storage access is limited to the current page origin"
+    );
+  }
+  if (request.scope === "cookie") {
+    return manageRuntimeCookie(env, request);
+  }
+  if (request.scope === "indexedDB") {
+    return manageRuntimeIndexedDb(env, request);
+  }
+  return manageRuntimeWebStorage(getWebStorage(env, request.scope), request);
+}
+function manageRuntimeCookie(env, request) {
+  if (!env.cookie) {
+    return createRuntimeStorageError(
+      request,
+      "Runtime cookie access is unavailable",
+      ["document.cookie is not available in this runtime environment"]
+    );
+  }
+  if (request.action === "list") {
+    return createRuntimeStorageSuccess(request, {
+      origin: request.origin,
+      cookies: readRuntimeCookies(env.cookie)
+    });
+  }
+  if (request.action === "get") {
+    assertCookieName(request);
+    return createRuntimeStorageSuccess(request, {
+      origin: request.origin,
+      cookies: readRuntimeCookies(env.cookie).filter(
+        (cookie) => cookie.name === request.cookie.name
+      )
+    });
+  }
+  if (request.action === "set") {
+    assertCookieName(request);
+    env.cookie.set(createRuntimeCookieWrite(request));
+    return createRuntimeStorageSuccess(request, { ok: true });
+  }
+  if (request.action === "delete") {
+    assertCookieName(request);
+    env.cookie.set(createRuntimeCookieDelete(request));
+    return createRuntimeStorageSuccess(request, {
+      deletedCount: 1,
+      skippedHttpOnlyCount: 0,
+      limitations: ["HttpOnly cookies are invisible to runtime cookie access"]
+    });
+  }
+  const cookies = readRuntimeCookies(env.cookie);
+  for (const cookie of cookies) {
+    env.cookie.set(
+      createRuntimeCookieDelete({
+        ...request,
+        cookie: {
+          name: cookie.name,
+          path: request.cookie?.path
+        }
+      })
+    );
+  }
+  return createRuntimeStorageSuccess(request, {
+    deletedCount: cookies.length,
+    skippedHttpOnlyCount: 0,
+    limitations: ["HttpOnly cookies are invisible to runtime cookie access"]
+  });
+}
+function getWebStorage(env, scope) {
+  return scope === "sessionStorage" ? env.sessionStorage : env.localStorage;
+}
+function manageRuntimeWebStorage(storage, request) {
+  if (request.action === "list") {
+    return createRuntimeStorageSuccess(request, {
+      origin: request.origin,
+      scope: request.scope,
+      entries: readStorageEntries(storage)
+    });
+  }
+  if (request.action === "get") {
+    assertStorageKey(request);
+    return createRuntimeStorageSuccess(request, {
+      origin: request.origin,
+      scope: request.scope,
+      key: request.key,
+      value: storage.getItem(request.key)
+    });
+  }
+  if (request.action === "set") {
+    assertStorageKey(request);
+    storage.setItem(request.key, request.value ?? "");
+    return createRuntimeStorageSuccess(request, { ok: true });
+  }
+  if (request.action === "delete") {
+    assertStorageKey(request);
+    storage.removeItem(request.key);
+    return createRuntimeStorageSuccess(request, { ok: true });
+  }
+  storage.clear();
+  return createRuntimeStorageSuccess(request, { ok: true });
+}
+async function manageRuntimeIndexedDb(env, request) {
+  if (!env.indexedDB?.databases) {
+    return createRuntimeStorageError(request, "IndexedDB metadata API is unavailable");
+  }
+  if (request.action === "list") {
+    const databases = await env.indexedDB.databases();
+    return createRuntimeStorageSuccess(request, {
+      origin: request.origin,
+      scope: request.scope,
+      databases: databases.map((database) => ({
+        name: database.name,
+        version: database.version
+      }))
+    });
+  }
+  assertIndexedDbTarget(request);
+  if ("stores" in env.indexedDB) {
+    return manageMemoryIndexedDb(env.indexedDB, request);
+  }
+  return manageBrowserIndexedDb(env.indexedDB, request);
+}
+function manageMemoryIndexedDb(indexedDB, request) {
+  const storeId = `${request.databaseName}:${request.objectStoreName}`;
+  const store = indexedDB.stores.get(storeId) ?? /* @__PURE__ */ new Map();
+  indexedDB.stores.set(storeId, store);
+  if (request.action === "get") {
+    assertStorageKey(request);
+    return createRuntimeStorageSuccess(request, {
+      key: request.key,
+      value: store.get(request.key) ?? null
+    });
+  }
+  if (request.action === "set") {
+    assertStorageKey(request);
+    store.set(request.key, parseIndexedDbValue(request.value));
+    return createRuntimeStorageSuccess(request, { ok: true });
+  }
+  if (request.action === "delete") {
+    assertStorageKey(request);
+    store.delete(request.key);
+    return createRuntimeStorageSuccess(request, { ok: true });
+  }
+  store.clear();
+  return createRuntimeStorageSuccess(request, { ok: true });
+}
+async function manageBrowserIndexedDb(indexedDB, request) {
+  const database = await openIndexedDbForRequest(indexedDB, request);
+  try {
+    return await executeIndexedDbTransaction(database, request);
+  } finally {
+    database.close();
+  }
+}
+function openIndexedDb(indexedDB, databaseName) {
+  return new Promise((resolve, reject) => {
+    const request = indexedDB.open(databaseName);
+    request.onerror = () => {
+      reject(request.error ?? new Error("IndexedDB open failed"));
+    };
+    request.onsuccess = () => {
+      resolve(request.result);
+    };
+  });
+}
+async function openIndexedDbForRequest(indexedDB, request) {
+  const database = await openIndexedDb(indexedDB, request.databaseName);
+  if (request.action !== "set" || database.objectStoreNames.contains(request.objectStoreName)) {
+    return database;
+  }
+  const version = database.version + 1;
+  database.close();
+  return openIndexedDbWithStore(indexedDB, {
+    databaseName: request.databaseName,
+    objectStoreName: request.objectStoreName,
+    version
+  });
+}
+function openIndexedDbWithStore(indexedDB, options) {
+  return new Promise((resolve, reject) => {
+    const request = indexedDB.open(options.databaseName, options.version);
+    request.onupgradeneeded = () => {
+      const database = request.result;
+      if (!database.objectStoreNames.contains(options.objectStoreName)) {
+        database.createObjectStore(options.objectStoreName);
+      }
+    };
+    request.onerror = () => {
+      reject(request.error ?? new Error("IndexedDB upgrade failed"));
+    };
+    request.onsuccess = () => {
+      resolve(request.result);
+    };
+  });
+}
+function executeIndexedDbTransaction(database, request) {
+  return new Promise((resolve, reject) => {
+    const mode = request.action === "get" ? "readonly" : "readwrite";
+    const transaction = database.transaction(request.objectStoreName, mode);
+    const store = transaction.objectStore(request.objectStoreName);
+    transaction.onerror = () => {
+      reject(transaction.error ?? new Error("IndexedDB transaction failed"));
+    };
+    if (request.action === "get") {
+      assertStorageKey(request);
+      const getRequest = store.get(request.key);
+      getRequest.onerror = () => {
+        reject(getRequest.error ?? new Error("IndexedDB get failed"));
+      };
+      getRequest.onsuccess = () => {
+        const value = getRequest.result ?? null;
+        resolve(
+          createRuntimeStorageSuccess(request, {
+            key: request.key,
+            value
+          })
+        );
+      };
+      return;
+    }
+    if (request.action === "set") {
+      assertStorageKey(request);
+      store.put(parseIndexedDbValue(request.value), request.key);
+      transaction.oncomplete = () => {
+        resolve(createRuntimeStorageSuccess(request, { ok: true }));
+      };
+      return;
+    }
+    if (request.action === "delete") {
+      assertStorageKey(request);
+      store.delete(request.key);
+      transaction.oncomplete = () => {
+        resolve(createRuntimeStorageSuccess(request, { ok: true }));
+      };
+      return;
+    }
+    store.clear();
+    transaction.oncomplete = () => {
+      resolve(createRuntimeStorageSuccess(request, { ok: true }));
+    };
+  });
+}
+function readStorageEntries(storage) {
+  const entries = [];
+  for (let index = 0; index < storage.length; index += 1) {
+    const key = storage.key(index);
+    if (!key) {
+      continue;
+    }
+    const value = storage.getItem(key);
+    if (value === null) {
+      continue;
+    }
+    entries.push({ key, value });
+  }
+  return entries;
+}
+function readRuntimeCookies(cookieAccess) {
+  return cookieAccess.get().split(";").map((item) => item.trim()).filter(Boolean).map((item) => {
+    const separatorIndex = item.indexOf("=");
+    if (separatorIndex === -1) {
+      return { name: decodeCookiePart(item), value: "" };
+    }
+    return {
+      name: decodeCookiePart(item.slice(0, separatorIndex)),
+      value: decodeCookiePart(item.slice(separatorIndex + 1))
+    };
+  });
+}
+function createRuntimeCookieWrite(request) {
+  const value = request.cookie.value ?? request.value ?? "";
+  const parts = [
+    `${encodeURIComponent(request.cookie.name)}=${encodeURIComponent(value)}`
+  ];
+  appendRuntimeCookieAttributes(parts, request.cookie);
+  return parts.join("; ");
+}
+function createRuntimeCookieDelete(request) {
+  const parts = [
+    `${encodeURIComponent(request.cookie.name)}=`,
+    "Expires=Thu, 01 Jan 1970 00:00:00 GMT",
+    "Max-Age=0"
+  ];
+  appendRuntimeCookieAttributes(parts, {
+    path: request.cookie.path,
+    domain: request.cookie.domain
+  });
+  return parts.join("; ");
+}
+function appendRuntimeCookieAttributes(parts, cookie) {
+  if (cookie.path) {
+    parts.push(`Path=${cookie.path}`);
+  }
+  if (cookie.domain) {
+    parts.push(`Domain=${cookie.domain}`);
+  }
+  if (cookie.expires !== void 0) {
+    parts.push(`Expires=${new Date(cookie.expires * 1e3).toUTCString()}`);
+  }
+  if (cookie.sameSite) {
+    parts.push(`SameSite=${normalizeRuntimeSameSite(cookie.sameSite)}`);
+  }
+  if (cookie.secure) {
+    parts.push("Secure");
+  }
+}
+function normalizeRuntimeSameSite(sameSite) {
+  if (sameSite === "strict") {
+    return "Strict";
+  }
+  if (sameSite === "lax") {
+    return "Lax";
+  }
+  return "None";
+}
+function decodeCookiePart(value) {
+  try {
+    return decodeURIComponent(value);
+  } catch {
+    return value;
+  }
+}
+function assertStorageKey(request) {
+  if (!request.key) {
+    throw new Error("Storage key is required for this operation");
+  }
+}
+function assertCookieName(request) {
+  if (!request.cookie?.name) {
+    throw new Error("Cookie name is required for this operation");
+  }
+}
+function assertIndexedDbTarget(request) {
+  if (!request.databaseName || !request.objectStoreName) {
+    throw new Error("IndexedDB databaseName and objectStoreName are required");
+  }
+}
+function parseIndexedDbValue(value) {
+  if (value === void 0) {
+    return null;
+  }
+  try {
+    return JSON.parse(value);
+  } catch {
+    return value;
+  }
+}
+function createRuntimeStorageSuccess(request, data) {
+  return {
+    ok: true,
+    source: "hook",
+    action: request.action,
+    scope: request.scope,
+    data
+  };
+}
+function createRuntimeStorageError(request, error, limitations) {
+  return {
+    ok: false,
+    source: "hook",
+    action: request.action,
+    scope: request.scope,
+    error,
+    limitations
+  };
+}
+
 // src/runtime/devtoolsBridge.ts
 function createRuntimeDevtoolsRpc(getRpc) {
   return {
@@ -1151,7 +1531,26 @@ function createRuntimeDevtoolsRpc(getRpc) {
         });
       }
     },
-    onScreenshotTaken: () => void 0
+    onScreenshotTaken: () => void 0,
+    async manageStorage(options) {
+      const bridge = createRuntimeStorageBridge({
+        origin: window.location.origin,
+        localStorage: window.localStorage,
+        sessionStorage: window.sessionStorage,
+        indexedDB: window.indexedDB,
+        cookie: {
+          get: () => window.document.cookie,
+          set: (value) => {
+            window.document.cookie = value;
+          }
+        }
+      });
+      getRpc().onStorageUpdated(
+        options.event,
+        await bridge.manageStorage(options)
+      );
+    },
+    onStorageUpdated: () => void 0
   };
 }
 
@@ -1449,11 +1848,7 @@ async function startRuntimeClient() {
     innerHeight: window.innerHeight,
     readyState: document.readyState
   });
-  hot.send(RUNTIME_PAGE_CONNECTED_EVENT, identity);
-  installRuntimePageLifecycle({
-    pageId: identity.pageId,
-    send: hot.send.bind(hot)
-  });
+  hot.send("vite-plugin-vue-mcp-next:page-connected", identity);
   installPerformanceHook({
     pageId: identity.pageId,
     send(report) {
@@ -1475,27 +1870,6 @@ async function startRuntimeClient() {
     }
   });
 }
-function installRuntimePageLifecycle(options) {
-  let disconnected = false;
-  const heartbeatTimer = setInterval(() => {
-    options.send(RUNTIME_PAGE_HEARTBEAT_EVENT, {
-      pageId: options.pageId,
-      timestamp: Date.now()
-    });
-  }, DEFAULT_RUNTIME_PAGE_HEARTBEAT_INTERVAL_MS);
-  const disconnect = () => {
-    if (disconnected) {
-      return;
-    }
-    disconnected = true;
-    clearInterval(heartbeatTimer);
-    options.send(RUNTIME_PAGE_DISCONNECTED_EVENT, {
-      pageId: options.pageId
-    });
-  };
-  window.addEventListener("pagehide", disconnect, { once: true });
-  window.addEventListener("beforeunload", disconnect, { once: true });
-}
 export {
   evaluateExpression,
   setScreenshotModuleRegistry,