@presto1314w/vite-devtools-browser 0.1.1 → 0.1.3

package/dist/browser.d.ts

@@ -15,7 +15,10 @@ export declare function reactTree(id?: string): Promise<string>;
 export declare function svelteTree(id?: string): Promise<string>;
 export declare function viteRestart(): Promise<string>;
 export declare function viteHMR(): Promise<string>;
-export declare function errors(): Promise<string>;
+export declare function viteRuntimeStatus(): Promise<string>;
+export declare function viteHMRTrace(mode: "summary" | "trace" | "clear", limit?: number): Promise<string>;
+export declare function viteModuleGraph(filter?: string, limit?: number, mode?: "snapshot" | "trace" | "clear"): Promise<string>;
+export declare function errors(mapped?: boolean, inlineSource?: boolean): Promise<string>;
 export declare function logs(): Promise<string>;
 export declare function screenshot(): Promise<string>;
 export declare function evaluate(script: string): Promise<string>;

package/dist/browser.js

@@ -6,6 +6,7 @@ import * as vueDevtools from "./vue/devtools.js";
 import * as reactDevtools from "./react/devtools.js";
 import * as svelteDevtools from "./svelte/devtools.js";
 import * as networkLog from "./network.js";
+import { resolveViaSourceMap } from "./sourcemap.js";
 const extensionPath = process.env.REACT_DEVTOOLS_EXTENSION ??
     resolve(import.meta.dirname, "../../next-browser/extensions/react-devtools-chrome");
 const hasReactExtension = existsSync(join(extensionPath, "manifest.json"));
@@ -15,9 +16,13 @@ const installHook = hasReactExtension
 let context = null;
 let page = null;
 let framework = "unknown";
+let extensionModeDisabled = false;
 const consoleLogs = [];
 const MAX_LOGS = 200;
+const MAX_HMR_EVENTS = 500;
 let lastReactSnapshot = [];
+const hmrEvents = [];
+let lastModuleGraphUrls = null;
 export async function open(url) {
     const currentPage = await ensurePage();
     if (url) {
@@ -37,6 +42,8 @@ export async function close() {
     page = null;
     framework = "unknown";
     consoleLogs.length = 0;
+    hmrEvents.length = 0;
+    lastModuleGraphUrls = null;
     networkLog.clear();
     lastReactSnapshot = [];
 }
@@ -48,7 +55,17 @@ async function ensurePage() {
     if (!context)
         throw new Error("browser not open");
     if (!page || page.isClosed()) {
-        page = context.pages()[0] ?? (await context.newPage());
+        try {
+            page = context.pages()[0] ?? (await context.newPage());
+        }
+        catch (error) {
+            if (!isClosedTargetError(error))
+                throw error;
+            await close();
+            extensionModeDisabled = true;
+            context = await launch();
+            page = context.pages()[0] ?? (await context.newPage());
+        }
         attachListeners(page);
         networkLog.attach(page);
     }
@@ -65,20 +82,30 @@ function contextUsable(current) {
         return false;
     }
 }
+function isClosedTargetError(error) {
+    if (!(error instanceof Error))
+        return false;
+    return /Target page, context or browser has been closed/i.test(error.message);
+}
 async function launch() {
-    if (hasReactExtension && installHook) {
-        const ctx = await chromium.launchPersistentContext("", {
-            headless: false,
-            viewport: { width: 1280, height: 720 },
-            args: [
-                `--disable-extensions-except=${extensionPath}`,
-                `--load-extension=${extensionPath}`,
-                "--auto-open-devtools-for-tabs",
-            ],
-        });
-        await ctx.waitForEvent("serviceworker").catch(() => { });
-        await ctx.addInitScript(installHook);
-        return ctx;
+    if (hasReactExtension && installHook && !extensionModeDisabled) {
+        try {
+            const ctx = await chromium.launchPersistentContext("", {
+                headless: false,
+                viewport: { width: 1280, height: 720 },
+                args: [
+                    `--disable-extensions-except=${extensionPath}`,
+                    `--load-extension=${extensionPath}`,
+                    "--auto-open-devtools-for-tabs",
+                ],
+            });
+            await ctx.waitForEvent("serviceworker").catch(() => { });
+            await ctx.addInitScript(installHook);
+            return ctx;
+        }
+        catch {
+            extensionModeDisabled = true;
+        }
     }
     const browser = await chromium.launch({
         headless: false,
@@ -92,8 +119,41 @@ function attachListeners(currentPage) {
         consoleLogs.push(text);
         if (consoleLogs.length > MAX_LOGS)
             consoleLogs.shift();
+        const viteMessage = msg.text();
+        if (!viteMessage.includes("[vite]"))
+            return;
+        const event = parseViteLog(viteMessage);
+        hmrEvents.push(event);
+        if (hmrEvents.length > MAX_HMR_EVENTS)
+            hmrEvents.shift();
     });
 }
+function parseViteLog(message) {
+    const lower = message.toLowerCase();
+    const event = {
+        timestamp: Date.now(),
+        type: "log",
+        message,
+    };
+    if (lower.includes("connecting"))
+        event.type = "connecting";
+    else if (lower.includes("connected"))
+        event.type = "connected";
+    else if (lower.includes("hot updated"))
+        event.type = "update";
+    else if (lower.includes("page reload"))
+        event.type = "full-reload";
+    else if (lower.includes("disconnected") ||
+        lower.includes("failed to connect") ||
+        lower.includes("connection lost") ||
+        lower.includes("error")) {
+        event.type = "error";
+    }
+    const hotUpdateMatch = message.match(/hot updated:\s*(.+)$/i);
+    if (hotUpdateMatch?.[1])
+        event.path = hotUpdateMatch[1].trim();
+    return event;
+}
 export async function goto(url) {
     const currentPage = await ensurePage();
     await currentPage.goto(url, { waitUntil: "domcontentloaded" });
@@ -202,17 +262,202 @@ export async function viteRestart() {
 export async function viteHMR() {
     if (!page)
         throw new Error("browser not open");
+    return viteHMRTrace("summary", 20);
+}
+export async function viteRuntimeStatus() {
+    if (!page)
+        throw new Error("browser not open");
+    const runtime = await page.evaluate(() => {
+        const findViteClient = () => {
+            const scripts = Array.from(document.querySelectorAll("script[src]"));
+            return scripts.some((script) => script.getAttribute("src")?.includes("/@vite/client"));
+        };
+        const wsStateName = (wsState) => {
+            if (wsState == null)
+                return "unknown";
+            if (wsState === 0)
+                return "connecting";
+            if (wsState === 1)
+                return "open";
+            if (wsState === 2)
+                return "closing";
+            if (wsState === 3)
+                return "closed";
+            return "unknown";
+        };
+        const hot = window.__vite_hot;
+        const ws = hot?.ws || hot?.socket;
+        return {
+            url: location.href,
+            hasViteClient: findViteClient(),
+            wsState: wsStateName(ws?.readyState),
+            hasErrorOverlay: Boolean(document.querySelector("vite-error-overlay")),
+            timestamp: Date.now(),
+        };
+    });
+    const output = [];
+    output.push("# Vite Runtime");
+    output.push(`URL: ${runtime.url}`);
+    output.push(`Framework: ${framework}`);
+    output.push(`Vite Client: ${runtime.hasViteClient ? "loaded" : "not detected"}`);
+    output.push(`HMR Socket: ${runtime.wsState}`);
+    output.push(`Error Overlay: ${runtime.hasErrorOverlay ? "present" : "none"}`);
+    output.push(`Tracked HMR Events: ${hmrEvents.length}`);
+    const last = hmrEvents[hmrEvents.length - 1];
+    if (last) {
+        output.push(`Last HMR Event: ${new Date(last.timestamp).toLocaleTimeString()} [${last.type}] ${last.message}`);
+    }
+    return output.join("\n");
+}
+export async function viteHMRTrace(mode, limit = 20) {
+    if (!page)
+        throw new Error("browser not open");
+    if (mode === "clear") {
+        hmrEvents.length = 0;
+        return "cleared HMR trace";
+    }
+    if (hmrEvents.length === 0) {
+        const fallback = await page.evaluate(() => {
+            const updates = window.__vite_hmr_updates || [];
+            return updates.slice(-20).map((u) => ({
+                timestamp: u.timestamp ?? Date.now(),
+                type: "update",
+                message: u.path ? `[vite] hot updated: ${u.path}` : "[vite] hot updated",
+                path: u.path,
+            }));
+        });
+        if (fallback.length > 0)
+            hmrEvents.push(...fallback);
+    }
+    if (hmrEvents.length === 0)
+        return "No HMR updates";
+    const safeLimit = Number.isFinite(limit) && limit > 0 ? Math.min(limit, 200) : 20;
+    const recent = hmrEvents.slice(-safeLimit);
+    if (mode === "summary") {
+        const counts = recent.reduce((acc, event) => {
+            acc[event.type] = (acc[event.type] ?? 0) + 1;
+            return acc;
+        }, {});
+        const lines = ["# HMR Summary"];
+        lines.push(`Events considered: ${recent.length}`);
+        lines.push(`Counts: ${Object.entries(counts)
+            .map(([k, v]) => `${k}=${v}`)
+            .join(", ")}`);
+        const last = recent[recent.length - 1];
+        lines.push(`Last: ${new Date(last.timestamp).toLocaleTimeString()} [${last.type}] ${last.path ?? last.message}`);
+        lines.push("\nUse `vite-browser vite hmr trace --limit <n>` for timeline details.");
+        return lines.join("\n");
+    }
+    return [
+        "# HMR Trace",
+        ...recent.map((event) => {
+            const detail = event.path ? `${event.path}` : event.message;
+            return `[${new Date(event.timestamp).toLocaleTimeString()}] ${event.type} ${detail}`;
+        }),
+    ].join("\n");
+}
+export async function viteModuleGraph(filter, limit = 200, mode = "snapshot") {
+    if (!page)
+        throw new Error("browser not open");
+    if (mode === "clear") {
+        lastModuleGraphUrls = null;
+        return "cleared module-graph baseline";
+    }
+    const moduleRows = await collectModuleRows(page);
+    const currentUrls = moduleRows.map((row) => row.url);
+    const previousUrls = lastModuleGraphUrls ? new Set(lastModuleGraphUrls) : null;
+    const currentSet = new Set(currentUrls);
+    lastModuleGraphUrls = [...currentUrls];
+    const normalizedFilter = filter?.trim().toLowerCase();
+    const safeLimit = Number.isFinite(limit) && limit > 0 ? Math.min(limit, 500) : 200;
+    if (mode === "trace") {
+        if (!previousUrls) {
+            return "No module-graph baseline. Captured current snapshot; run `vite module-graph trace` again.";
+        }
+        const added = currentUrls.filter((url) => !previousUrls.has(url));
+        const removed = [...previousUrls].filter((url) => !currentSet.has(url));
+        const addedFiltered = normalizedFilter
+            ? added.filter((url) => url.toLowerCase().includes(normalizedFilter))
+            : added;
+        const removedFiltered = normalizedFilter
+            ? removed.filter((url) => url.toLowerCase().includes(normalizedFilter))
+            : removed;
+        const lines = [];
+        lines.push("# Vite Module Graph Trace");
+        lines.push(`Added: ${addedFiltered.length}, Removed: ${removedFiltered.length}`);
+        lines.push("");
+        lines.push("## Added");
+        if (addedFiltered.length === 0)
+            lines.push("(none)");
+        else
+            addedFiltered.slice(0, safeLimit).forEach((url) => lines.push(`+ ${url}`));
+        lines.push("");
+        lines.push("## Removed");
+        if (removedFiltered.length === 0)
+            lines.push("(none)");
+        else
+            removedFiltered.slice(0, safeLimit).forEach((url) => lines.push(`- ${url}`));
+        return lines.join("\n");
+    }
+    const filtered = moduleRows.filter((row) => normalizedFilter ? row.url.toLowerCase().includes(normalizedFilter) : true);
+    const limited = filtered.slice(0, safeLimit);
+    if (limited.length === 0)
+        return "No module resources found";
+    const lines = [];
+    lines.push("# Vite Module Graph (loaded resources)");
+    lines.push(`Total: ${filtered.length}${filtered.length > limited.length ? ` (showing ${limited.length})` : ""}`);
+    lines.push("# idx initiator ms url");
+    lines.push("");
+    limited.forEach((row, idx) => {
+        lines.push(`${idx} ${row.initiator} ${row.durationMs}ms ${row.url}`);
+    });
+    return lines.join("\n");
+}
+async function collectModuleRows(page) {
     return page.evaluate(() => {
-        const updates = window.__vite_hmr_updates || [];
-        if (updates.length === 0)
-            return "No HMR updates";
-        return updates
-            .slice(-20)
-            .map((u) => `${new Date(u.timestamp).toLocaleTimeString()} - ${u.path}`)
-            .join("\n");
+        const isLikelyModuleUrl = (url) => {
+            if (!url)
+                return false;
+            if (url.includes("/@vite/"))
+                return true;
+            if (url.includes("/@id/"))
+                return true;
+            if (url.includes("/src/"))
+                return true;
+            if (url.includes("/node_modules/"))
+                return true;
+            return /\.(mjs|cjs|js|jsx|ts|tsx|vue|css)(\?|$)/.test(url);
+        };
+        const scripts = Array.from(document.querySelectorAll("script[src]")).map((node) => node.src);
+        const resources = performance
+            .getEntriesByType("resource")
+            .map((entry) => {
+            const item = entry;
+            return {
+                url: item.name,
+                initiator: item.initiatorType || "unknown",
+                durationMs: Number(item.duration.toFixed(1)),
+            };
+        })
+            .filter((entry) => isLikelyModuleUrl(entry.url));
+        const all = [
+            ...scripts
+                .filter((url) => isLikelyModuleUrl(url))
+                .map((url) => ({ url, initiator: "script-tag", durationMs: 0 })),
+            ...resources,
+        ];
+        const seen = new Set();
+        const unique = [];
+        for (const row of all) {
+            if (seen.has(row.url))
+                continue;
+            seen.add(row.url);
+            unique.push(row);
+        }
+        return unique;
     });
 }
-export async function errors() {
+export async function errors(mapped = false, inlineSource = false) {
     if (!page)
         throw new Error("browser not open");
     const errorInfo = await page.evaluate(() => {
@@ -225,7 +470,12 @@ export async function errors() {
     });
     if (!errorInfo)
         return "no errors";
-    return `${errorInfo.message ?? "Vite error"}\n\n${errorInfo.stack ?? ""}`.trim();
+    const raw = `${errorInfo.message ?? "Vite error"}\n\n${errorInfo.stack ?? ""}`.trim();
+    if (!mapped)
+        return raw;
+    const origin = new URL(page.url()).origin;
+    const mappedStack = await mapStackTrace(raw, origin, inlineSource);
+    return mappedStack;
 }
 export async function logs() {
     if (consoleLogs.length === 0)
@@ -250,3 +500,27 @@ export async function network(idx) {
         return networkLog.format();
     return networkLog.detail(idx);
 }
+async function mapStackTrace(stack, origin, inlineSource = false) {
+    const locationRegex = /(https?:\/\/[^\s)]+):(\d+):(\d+)/g;
+    const matches = Array.from(stack.matchAll(locationRegex));
+    if (matches.length === 0)
+        return stack;
+    const mappedLines = [];
+    for (const match of matches) {
+        const fileUrl = match[1];
+        const line = Number.parseInt(match[2], 10);
+        const column = Number.parseInt(match[3], 10);
+        if (!Number.isFinite(line) || !Number.isFinite(column))
+            continue;
+        const mapped = await resolveViaSourceMap(origin, fileUrl, line, column, inlineSource);
+        if (!mapped)
+            continue;
+        mappedLines.push(`- ${fileUrl}:${line}:${column} -> ${mapped.file}:${mapped.line}:${mapped.column}`);
+        if (inlineSource && mapped.snippet) {
+            mappedLines.push(`  ${mapped.snippet}`);
+        }
+    }
+    if (mappedLines.length === 0)
+        return stack;
+    return `${stack}\n\n# Mapped Stack\n${mappedLines.join("\n")}`;
+}

package/dist/cli.js

@@ -85,11 +85,45 @@ if (cmd === "vite" && arg === "restart") {
     exit(res, res.ok && res.data ? String(res.data) : "restarted");
 }
 if (cmd === "vite" && arg === "hmr") {
-    const res = await send("vite-hmr");
+    const sub = args[2];
+    if (sub === "clear") {
+        const res = await send("vite-hmr", { mode: "clear" });
+        exit(res, res.ok && res.data ? String(res.data) : "cleared HMR trace");
+    }
+    if (sub === "trace") {
+        const limitIdx = args.indexOf("--limit");
+        const limit = limitIdx >= 0 ? Number.parseInt(args[limitIdx + 1] ?? "20", 10) : 20;
+        const res = await send("vite-hmr", { mode: "trace", limit });
+        exit(res, res.ok && res.data ? String(res.data) : "");
+    }
+    const res = await send("vite-hmr", { mode: "summary", limit: 20 });
+    exit(res, res.ok && res.data ? String(res.data) : "");
+}
+if (cmd === "vite" && arg === "runtime") {
+    const res = await send("vite-runtime");
+    exit(res, res.ok && res.data ? String(res.data) : "");
+}
+if (cmd === "vite" && arg === "module-graph") {
+    const sub = args[2];
+    const filterIdx = args.indexOf("--filter");
+    const limitIdx = args.indexOf("--limit");
+    const filter = filterIdx >= 0 ? args[filterIdx + 1] : undefined;
+    const limit = limitIdx >= 0 ? Number.parseInt(args[limitIdx + 1] ?? "200", 10) : 200;
+    if (sub === "clear") {
+        const res = await send("vite-module-graph", { mode: "clear" });
+        exit(res, res.ok && res.data ? String(res.data) : "cleared module-graph baseline");
+    }
+    if (sub === "trace") {
+        const res = await send("vite-module-graph", { mode: "trace", filter, limit });
+        exit(res, res.ok && res.data ? String(res.data) : "");
+    }
+    const res = await send("vite-module-graph", { mode: "snapshot", filter, limit });
     exit(res, res.ok && res.data ? String(res.data) : "");
 }
 if (cmd === "errors") {
-    const res = await send("errors");
+    const mapped = args.includes("--mapped");
+    const inlineSource = args.includes("--inline-source");
+    const res = await send("errors", { mapped, inlineSource });
     exit(res, res.ok && res.data ? String(res.data) : "no errors");
 }
 if (cmd === "logs") {
@@ -154,8 +188,18 @@ SVELTE COMMANDS
 
 VITE COMMANDS
   vite restart                        Restart Vite dev server
-  vite hmr                            Show HMR status
+  vite hmr                            Show HMR summary
+  vite hmr trace [--limit <n>]        Show HMR timeline
+  vite hmr clear                      Clear tracked HMR timeline
+  vite runtime                        Show Vite runtime status
+  vite module-graph [--filter <txt>] [--limit <n>]
+                                     Show loaded Vite module resources
+  vite module-graph trace [--filter <txt>] [--limit <n>]
+                                     Show module additions/removals since baseline
+  vite module-graph clear             Clear module-graph baseline
   errors                              Show build/runtime errors
+  errors --mapped                     Show errors with source-map mapping
+  errors --mapped --inline-source     Include mapped source snippets
   logs                                Show dev server logs
 
 UTILITIES

package/dist/daemon.js

@@ -96,11 +96,21 @@ async function run(cmd) {
         return { ok: true, data };
     }
     if (cmd.action === "vite-hmr") {
-        const data = await browser.viteHMR();
+        const hmrMode = cmd.mode === "trace" || cmd.mode === "clear" ? cmd.mode : "summary";
+        const data = await browser.viteHMRTrace(hmrMode, cmd.limit ?? 20);
+        return { ok: true, data };
+    }
+    if (cmd.action === "vite-runtime") {
+        const data = await browser.viteRuntimeStatus();
+        return { ok: true, data };
+    }
+    if (cmd.action === "vite-module-graph") {
+        const graphMode = cmd.mode === "trace" || cmd.mode === "clear" ? cmd.mode : "snapshot";
+        const data = await browser.viteModuleGraph(cmd.filter, cmd.limit ?? 200, graphMode);
         return { ok: true, data };
     }
     if (cmd.action === "errors") {
-        const data = await browser.errors();
+        const data = await browser.errors(Boolean(cmd.mapped), Boolean(cmd.inlineSource));
         return { ok: true, data };
     }
     if (cmd.action === "logs") {

package/dist/sourcemap.d.ts

@@ -0,0 +1,8 @@
+type MappedLocation = {
+    file: string;
+    line: number;
+    column: number;
+    snippet?: string;
+};
+export declare function resolveViaSourceMap(origin: string, fileUrl: string, line: number, column: number, includeSnippet?: boolean): Promise<MappedLocation | null>;
+export {};

package/dist/sourcemap.js

@@ -0,0 +1,71 @@
+import { SourceMapConsumer } from "source-map-js";
+const consumers = new Map();
+export async function resolveViaSourceMap(origin, fileUrl, line, column, includeSnippet = false) {
+    const consumer = await loadConsumer(origin, fileUrl);
+    if (!consumer)
+        return null;
+    const position = consumer.originalPositionFor({
+        line,
+        column: Math.max(0, column - 1),
+    });
+    if (!position.source || position.line == null || position.column == null)
+        return null;
+    const mapped = {
+        file: cleanSource(position.source),
+        line: position.line,
+        column: position.column + 1,
+    };
+    if (includeSnippet) {
+        mapped.snippet = snippetFor(consumer, position.source, position.line);
+    }
+    return mapped;
+}
+async function loadConsumer(origin, fileUrl) {
+    const candidates = buildMapCandidates(origin, fileUrl);
+    for (const url of candidates) {
+        if (consumers.has(url)) {
+            const cached = consumers.get(url);
+            if (cached)
+                return cached;
+            continue;
+        }
+        const response = await fetch(url, { signal: AbortSignal.timeout(5000) }).catch(() => null);
+        if (!response?.ok) {
+            consumers.set(url, null);
+            continue;
+        }
+        const map = await response.json().catch(() => null);
+        if (!map) {
+            consumers.set(url, null);
+            continue;
+        }
+        const consumer = new SourceMapConsumer(map);
+        consumers.set(url, consumer);
+        return consumer;
+    }
+    return null;
+}
+function buildMapCandidates(origin, fileUrl) {
+    const url = new URL(fileUrl, origin);
+    const basePath = `${url.pathname}.map`;
+    const withSearch = url.search ? `${basePath}${url.search}` : basePath;
+    // Try preserving query first (Vite often keeps cache-busting query params).
+    return [`${origin}${withSearch}`, `${origin}${basePath}`];
+}
+function cleanSource(source) {
+    const decoded = decodeURIComponent(source.replace(/^file:\/\//, ""));
+    const nodeModulesIndex = decoded.lastIndexOf("/node_modules/");
+    if (nodeModulesIndex >= 0)
+        return decoded.slice(nodeModulesIndex + 1);
+    return decoded;
+}
+function snippetFor(consumer, source, line) {
+    const content = consumer.sourceContentFor(source, true);
+    if (!content)
+        return undefined;
+    const lines = content.split(/\r?\n/);
+    const sourceLine = lines[line - 1];
+    if (!sourceLine)
+        return undefined;
+    return `${line} | ${sourceLine.trim()}`;
+}

package/dist/vue/devtools.js

@@ -176,12 +176,51 @@ export async function getComponentDetails(page, id) {
  */
 export async function getPiniaStores(page, storeName) {
     const result = await page.evaluate((name) => {
+        const safeJson = (value) => {
+            if (typeof value === "function")
+                return "[Function]";
+            if (typeof value === "bigint")
+                return value.toString();
+            const seen = new WeakSet();
+            try {
+                return JSON.stringify(value, (_, v) => {
+                    if (typeof v === "function")
+                        return "[Function]";
+                    if (typeof v === "bigint")
+                        return v.toString();
+                    if (v && typeof v === "object") {
+                        if (seen.has(v))
+                            return "[Circular]";
+                        seen.add(v);
+                    }
+                    return v;
+                });
+            }
+            catch {
+                return String(value);
+            }
+        };
+        const hook = window.__VUE_DEVTOOLS_GLOBAL_HOOK__;
+        const piniaFromApp = hook?.apps?.[0]?.config?.globalProperties?.$pinia;
         // Try to find Pinia instance
-        const pinia = window.__PINIA__ || window.pinia;
+        const pinia = window.__PINIA__ || window.pinia || piniaFromApp;
         if (!pinia)
             return "Pinia not found";
-        const stores = pinia._s || pinia.state?.value || {};
-        const storeKeys = Object.keys(stores);
+        // Pinia v3 uses Map for _s, older integrations can expose plain objects.
+        const storesById = {};
+        const registry = pinia._s;
+        if (registry instanceof Map) {
+            registry.forEach((store, id) => {
+                storesById[String(id)] = store;
+            });
+        }
+        else if (registry && typeof registry === "object") {
+            for (const [id, store] of Object.entries(registry)) {
+                storesById[id] = store;
+            }
+        }
+        const stateById = pinia.state?.value && typeof pinia.state.value === "object" ? pinia.state.value : {};
+        const storeKeys = Array.from(new Set([...Object.keys(storesById), ...Object.keys(stateById)]));
         if (storeKeys.length === 0)
             return "No Pinia stores found";
         const output = [];
@@ -195,29 +234,40 @@ export async function getPiniaStores(page, storeName) {
             return output.join("\n");
         }
         // Get specific store
-        const store = stores[name];
-        if (!store)
+        const store = storesById[name] ?? null;
+        const stateOnly = stateById[name];
+        if (!store && !stateOnly)
             return `Store '${name}' not found`;
         output.push(`# Pinia Store: ${name}\n`);
         // State
-        const state = store.$state || store.state || store;
+        const state = store?.$state || store?.state || stateOnly || store;
         if (state && typeof state === 'object') {
             output.push("## State");
             for (const [key, value] of Object.entries(state)) {
                 if (key.startsWith('$'))
                     continue; // Skip Pinia internals
-                output.push(`  ${key}: ${JSON.stringify(value)}`);
+                output.push(`  ${key}: ${safeJson(value)}`);
             }
             output.push("");
         }
         // Getters
-        const getters = store._getters || {};
-        if (Object.keys(getters).length > 0) {
+        const getterNames = [];
+        const rawGetters = store?._getters;
+        if (Array.isArray(rawGetters)) {
+            getterNames.push(...rawGetters.map((g) => String(g)));
+        }
+        else if (rawGetters instanceof Set) {
+            getterNames.push(...Array.from(rawGetters).map((g) => String(g)));
+        }
+        else if (rawGetters && typeof rawGetters === "object") {
+            getterNames.push(...Object.keys(rawGetters));
+        }
+        if (getterNames.length > 0) {
             output.push("## Getters");
-            for (const key of Object.keys(getters)) {
+            for (const key of getterNames) {
                 try {
                     const value = store[key];
-                    output.push(`  ${key}: ${JSON.stringify(value)}`);
+                    output.push(`  ${key}: ${safeJson(value)}`);
                 }
                 catch {
                     output.push(`  ${key}: [Error]`);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@presto1314w/vite-devtools-browser",
-  "version": "0.1.1",
+  "version": "0.1.3",
   "description": "CLI for programmatic access to Vue/React DevTools in Vite applications",
   "license": "MIT",
   "repository": {
@@ -19,7 +19,7 @@
     "dist"
   ],
   "bin": {
-    "vite-browser": "./dist/cli.js"
+    "vite-browser": "dist/cli.js"
   },
   "scripts": {
     "start": "node --import tsx src/cli.ts",
@@ -28,7 +28,11 @@
     "build": "tsc -p tsconfig.build.json",
     "prepack": "pnpm build",
     "test": "vitest run",
-    "test:watch": "vitest"
+    "test:watch": "vitest",
+    "test:coverage": "vitest run --coverage",
+    "test:evals": "vitest run --dir test/evals",
+    "test:evals:ci": "vitest run --dir test/evals --coverage --reporter=default",
+    "test:evals:e2e": "pnpm build && vitest run --config vitest.e2e.config.ts"
   },
   "dependencies": {
     "playwright": "^1.50.0",
@@ -36,6 +40,7 @@
   },
   "devDependencies": {
     "@types/node": "^22.0.0",
+    "@vitest/coverage-v8": "^4.0.18",
     "@vue/devtools-kit": "^7.3.2",
     "@vue/devtools-api": "^7.3.2",
     "tsx": "^4.20.6",