@mcpc-tech/unplugin-dev-inspector-mcp 0.0.37 → 0.0.39

package/dist/config-updater.cjs

@@ -21,6 +21,7 @@ let _modelcontextprotocol_sdk_inMemory_js = require("@modelcontextprotocol/sdk/i
 let node_process = require("node:process");
 node_process = require_chunk.__toESM(node_process);
 let os = require("os");
+let child_process = require("child_process");
 let fs = require("fs");
 fs = require_chunk.__toESM(fs);
 let http = require("http");
@@ -36,6 +37,7 @@ let url = require("url");
 let ai = require("ai");
 let _agentclientprotocol_sdk = require("@agentclientprotocol/sdk");
 let node_child_process = require("node:child_process");
+let module$1 = require("module");
 let fs_promises = require("fs/promises");
 
 //#region ../../node_modules/.pnpm/@mcpc-tech+cmcp@0.0.15/node_modules/@mcpc-tech/cmcp/index.mjs
@@ -34869,7 +34871,7 @@ var require_snapshot_utils = /* @__PURE__ */ require_chunk.__commonJSMin(((expor
 //#region ../../node_modules/.pnpm/undici@7.16.0/node_modules/undici/lib/mock/snapshot-recorder.js
 var require_snapshot_recorder = /* @__PURE__ */ require_chunk.__commonJSMin(((exports, module) => {
 	const { writeFile: writeFile$1, readFile: readFile$1, mkdir: mkdir$1 } = require("node:fs/promises");
-	const { dirname: dirname$1, resolve } = require("node:path");
+	const { dirname: dirname$2, resolve } = require("node:path");
 	const { setTimeout: setTimeout$1, clearTimeout: clearTimeout$1 } = require("node:timers");
 	const { InvalidArgumentError, UndiciError } = require_errors$1();
 	const { hashId, isUrlExcludedFactory, normalizeHeaders, createHeaderFilters } = require_snapshot_utils();
@@ -35148,7 +35150,7 @@ var require_snapshot_recorder = /* @__PURE__ */ require_chunk.__commonJSMin(((ex
 			const path$3 = filePath || this.#snapshotPath;
 			if (!path$3) throw new InvalidArgumentError("Snapshot path is required");
 			const resolvedPath = resolve(path$3);
-			await mkdir$1(dirname$1(resolvedPath), { recursive: true });
+			await mkdir$1(dirname$2(resolvedPath), { recursive: true });
 			const data$1 = Array.from(this.#snapshots.entries()).map(([hash, snapshot]) => ({
 				hash,
 				snapshot
@@ -58015,9 +58017,9 @@ var require_utils$5 = /* @__PURE__ */ require_chunk.__commonJSMin(((exports) =>
 var require_execAsync$1 = /* @__PURE__ */ require_chunk.__commonJSMin(((exports) => {
 	Object.defineProperty(exports, "__esModule", { value: true });
 	exports.execAsync = void 0;
-	const child_process$1 = require("child_process");
+	const child_process$2 = require("child_process");
 	const util$1 = require("util");
-	exports.execAsync = util$1.promisify(child_process$1.exec);
+	exports.execAsync = util$1.promisify(child_process$2.exec);
 }));
 
 //#endregion
@@ -66167,9 +66169,9 @@ var require_utils$1 = /* @__PURE__ */ require_chunk.__commonJSMin(((exports) =>
 var require_execAsync = /* @__PURE__ */ require_chunk.__commonJSMin(((exports) => {
 	Object.defineProperty(exports, "__esModule", { value: true });
 	exports.execAsync = void 0;
-	const child_process = require("child_process");
+	const child_process$1 = require("child_process");
 	const util = require("util");
-	exports.execAsync = util.promisify(child_process.exec);
+	exports.execAsync = util.promisify(child_process$1.exec);
 }));
 
 //#endregion
@@ -83445,6 +83447,19 @@ async function getOrCreateMcpClient(defKey, def) {
 		mcpClientConnecting.delete(defKey);
 	}
 }
+async function releaseMcpClient(defKey) {
+	const entry = mcpClientPool.get(defKey);
+	if (!entry) return;
+	entry.refCount -= 1;
+	if (entry.refCount <= 0) {
+		mcpClientPool.delete(defKey);
+		try {
+			await entry.client.close();
+		} catch (err) {
+			console.error("Error closing MCP client:", err);
+		}
+	}
+}
 var cleanupAllPooledClients = async () => {
 	const entries = Array.from(mcpClientPool.entries());
 	mcpClientPool.clear();
@@ -83502,7 +83517,12 @@ async function composeMcpDepTools(mcpConfig, filterIn) {
 			console.error(`Error creating MCP client for ${name}:`, error);
 		}
 	}
-	const cleanupClients = async () => {};
+	const cleanupClients = async () => {
+		await Promise.all(acquiredKeys.map((k) => releaseMcpClient(k)));
+		acquiredKeys.length = 0;
+		Object.keys(allTools).forEach((key) => delete allTools[key]);
+		Object.keys(allClients).forEach((key) => delete allClients[key]);
+	};
 	return {
 		tools: allTools,
 		clients: allClients,
@@ -86304,6 +86324,17 @@ var ComposableMCPServer = class extends _modelcontextprotocol_sdk_server_index_j
 			server: this,
 			toolNames: Object.keys(allTools)
 		});
+		this.onclose = async () => {
+			await cleanupClients();
+			await this.disposePlugins();
+			await this.logger.info(`[${name}] Event: closed - cleaned up dependent clients and plugins`);
+		};
+		this.onerror = async (error) => {
+			await this.logger.error(`[${name}] Event: error - ${error?.stack ?? String(error)}`);
+			await cleanupClients();
+			await this.disposePlugins();
+			await this.logger.info(`[${name}] Action: cleaned up dependent clients and plugins`);
+		};
 		const toolNameToDetailList = Object.entries(allTools);
 		const publicToolNames = this.getPublicToolNames();
 		const hiddenToolNames = this.getHiddenToolNames();
@@ -86816,6 +86847,7 @@ var ConnectionManager = class {
 		transport.onclose = () => this.removeTransport(sessionId);
 	}
 	removeTransport(sessionId) {
+		console.log(`[dev-inspector] [connection-manager] Removing transport: ${sessionId}`);
 		delete this.transports[sessionId];
 		for (const [_clientId, sessionIds] of this.watchersByClientId) if (sessionIds.has(sessionId)) {
 			sessionIds.delete(sessionId);
@@ -86846,6 +86878,7 @@ var ConnectionManager = class {
 			}
 			sessionsToRemove.push(existingSessionId);
 		}
+		if (sessionsToRemove.length > 0) console.log(`[dev-inspector] [connection-manager] Cleaned up ${sessionsToRemove.length} previous sessions for clientId=${clientId} (new session=${newSessionId})`);
 		for (const sessionId of sessionsToRemove) sessionIds.delete(sessionId);
 	}
 	handleInspectorConnection(sessionId) {
@@ -87056,11 +87089,17 @@ async function handleSseConnection(req, res, serverContext, connectionManager) {
 		const url$1 = new URL(req.url ?? "", `http://${host}:${port}`);
 		const transport = new _modelcontextprotocol_sdk_server_sse_js.SSEServerTransport("/__mcp__/messages", res);
 		const sessionId = transport.sessionId;
-		const clientId = url$1.searchParams.get("clientId") || "agent";
+		const clientId = url$1.searchParams.get("clientId") || `agent-${sessionId}`;
 		const puppetId = url$1.searchParams.get("puppetId") || "inspector";
+		console.log(`[dev-inspector] [sse] New connection request: clientId=${clientId}, puppetId=${puppetId}, sessionId=${sessionId}`);
 		connectionManager.registerTransport(sessionId, transport);
-		if (clientId === "inspector") connectionManager.handleInspectorConnection(sessionId);
-		else connectionManager.handleWatcherConnection(sessionId, clientId, puppetId, transport);
+		if (clientId === "inspector") {
+			console.log(`[dev-inspector] [sse] Handling Inspector connection: ${sessionId}`);
+			connectionManager.handleInspectorConnection(sessionId);
+		} else {
+			console.log(`[dev-inspector] [sse] Handling Watcher connection: ${sessionId} (binding to ${puppetId})`);
+			connectionManager.handleWatcherConnection(sessionId, clientId, puppetId, transport);
+		}
 		await mcpServer.connect(transport);
 	} catch (error) {
 		console.error("Error establishing SSE connection:", error);
@@ -87200,7 +87239,7 @@ function setupInspectorMiddleware(middlewares, config) {
 }
 
 //#endregion
-//#region ../../node_modules/.pnpm/@mcpc-tech+acp-ai-provider@0.1.41/node_modules/@mcpc-tech/acp-ai-provider/index.mjs
+//#region ../../node_modules/.pnpm/@mcpc-tech+acp-ai-provider@0.1.43/node_modules/@mcpc-tech/acp-ai-provider/index.mjs
 (0, node_module.createRequire)(require("url").pathToFileURL(__filename).href);
 function formatToolError(toolResult) {
 	if (!toolResult || toolResult.length === 0) return "Unknown tool error";
@@ -87643,7 +87682,6 @@ var ACPLanguageModel = class {
 	*/
 	parseToolCall(update$1) {
 		if (update$1.sessionUpdate !== "tool_call") throw new Error("Invalid update type for parseToolCall");
-		console.log("Parsing tool call update:", JSON.stringify(update$1, null, 2));
 		return {
 			toolCallId: update$1.toolCallId,
 			toolName: update$1.title || update$1.toolCallId,
@@ -87945,11 +87983,6 @@ var ACPLanguageModel = class {
 					this.currentThinkingId = null;
 				}
 				const { toolCallId, toolName, toolInput } = this.parseToolCall(update$1);
-				console.log(`Parsing tool call: ${JSON.stringify({
-					toolCallId,
-					toolName,
-					toolInput
-				}, null, 2)}`);
 				const existingToolCall = this.toolCallsMap.get(toolCallId);
 				const hasInput = toolInput && typeof toolInput === "object" && Object.keys(toolInput).length > 0;
 				if (!existingToolCall) {
@@ -87976,13 +88009,14 @@ var ACPLanguageModel = class {
 					});
 				} else if (!existingToolCall.inputAvailable && hasInput) {
 					existingToolCall.inputAvailable = true;
+					if (update$1.title && existingToolCall.name !== update$1.title && update$1.title !== toolCallId) existingToolCall.name = update$1.title;
 					controller.enqueue({
 						type: "tool-call",
 						toolCallId,
 						toolName: ACP_PROVIDER_AGENT_DYNAMIC_TOOL_NAME2,
 						input: JSON.stringify({
 							toolCallId,
-							toolName,
+							toolName: existingToolCall.name,
 							args: toolInput
 						})
 					});
@@ -88009,13 +88043,14 @@ var ACPLanguageModel = class {
 					}
 					if (!toolInfo.inputAvailable) {
 						toolInfo.inputAvailable = true;
+						if (update$1.title && toolInfo.name !== update$1.title && update$1.title !== toolCallId) toolInfo.name = update$1.title;
 						controller.enqueue({
 							type: "tool-call",
 							toolCallId,
 							toolName: ACP_PROVIDER_AGENT_DYNAMIC_TOOL_NAME2,
 							input: JSON.stringify({
 								toolCallId,
-								toolName,
+								toolName: toolInfo.name,
 								args: {}
 							})
 						});
@@ -88041,13 +88076,14 @@ var ACPLanguageModel = class {
 					});
 				} else if (!toolInfo.inputAvailable) {
 					toolInfo.inputAvailable = true;
+					if (update$1.title && toolInfo.name !== update$1.title && update$1.title !== toolCallId) toolInfo.name = update$1.title;
 					controller.enqueue({
 						type: "tool-call",
 						toolCallId,
 						toolName: ACP_PROVIDER_AGENT_DYNAMIC_TOOL_NAME2,
 						input: JSON.stringify({
 							toolCallId,
-							toolName,
+							toolName: toolInfo.name,
 							args: {}
 						})
 					});
@@ -88280,9 +88316,52 @@ function createACPProvider(config) {
 	return new ACPProvider(config);
 }
 
+//#endregion
+//#region src/utils/npm-package.ts
+/**
+* Resolve npm package bin entry point
+* Returns the absolute path to the bin file, or null if resolution fails
+*/
+function resolveNpmPackageBin(packageName) {
+	try {
+		const packageJsonPath = (0, module$1.createRequire)(require("url").pathToFileURL(__filename).href).resolve(`${packageName}/package.json`);
+		const packageJson = JSON.parse((0, fs.readFileSync)(packageJsonPath, "utf-8"));
+		let binPath;
+		if (typeof packageJson.bin === "string") binPath = packageJson.bin;
+		else if (typeof packageJson.bin === "object") {
+			const binEntries = Object.entries(packageJson.bin);
+			const matchingEntry = binEntries.find(([name]) => name === packageJson.name.split("/").pop());
+			binPath = matchingEntry ? matchingEntry[1] : binEntries[0]?.[1];
+		}
+		if (!binPath) {
+			console.warn(`[dev-inspector] [acp] No bin entry found in ${packageName}/package.json`);
+			return null;
+		}
+		const binFullPath = (0, path.join)((0, path.dirname)(packageJsonPath), binPath);
+		console.log(`[dev-inspector] [acp] Resolved ${packageName} bin to: ${binFullPath}`);
+		return binFullPath;
+	} catch (error) {
+		console.warn(`[dev-inspector] [acp] Failed to resolve npm package ${packageName}:`, error);
+		return null;
+	}
+}
+
 //#endregion
 //#region src/middleware/acp-middleware.ts
 /**
+* Check if a command exists in the system PATH
+* Skips check for npx since it always exists
+*/
+function checkCommandExists(command) {
+	if (command === "npx" || command === "node") return true;
+	try {
+		(0, child_process.execSync)(`which ${command}`, { stdio: "ignore" });
+		return true;
+	} catch {
+		return false;
+	}
+}
+/**
 * Provider manager - stores one provider per agent config
 * Key: agentKey (command:args), Value: ProviderEntry
 */
@@ -88335,10 +88414,13 @@ async function loadMcpToolsV5(transport) {
 			inputSchema: (0, ai.jsonSchema)(toolInfo.inputSchema),
 			execute: async (args) => {
 				console.log(`[dev-inspector] [acp] Executing MCP tool: ${toolName}`);
-				return await callMcpMethodViaTransport(transport, "tools/call", {
+				const result = await callMcpMethodViaTransport(transport, "tools/call", {
 					name: toolName,
 					arguments: args
 				});
+				const parsedResult = _modelcontextprotocol_sdk_types_js.CallToolResultSchema.safeParse(result);
+				if (!parsedResult.success) return result;
+				return parsedResult.data?.content?.map((item) => item?.text).join("\n");
 			}
 		});
 	}
@@ -88346,12 +88428,33 @@ async function loadMcpToolsV5(transport) {
 	return tools;
 }
 /**
-* Get the Inspector transport from the connection manager
+* Default system instructions for DevInspector - provides AI guidance
+*/
+const DEFAULT_SYSTEM_INSTRUCTIONS = `# DevInspector Context
+
+You are connected to a web app with DevInspector. Available tools:
+
+- **list_inspections**: Check pending element inspections from user
+- **capture_element_context**: Activate visual selector to capture UI elements
+- **update_inspection_status**: Update inspection status with progress/results
+- **execute_page_script**: Run JavaScript in browser context
+- **chrome_devtools**: Access Chrome DevTools for network, console, performance
+
+Workflow: Check \`list_inspections\` first. If there are pending items, help resolve them. Otherwise, assist with the user's request.`;
+/**
+* Get an active transport from the connection manager
 */
 function getActiveTransport() {
 	const connectionManager = getConnectionManager();
 	if (!connectionManager) return null;
-	return connectionManager.getInspectorTransport();
+	return connectionManager.getInspectorTransport() || connectionManager.transports[Object.keys(connectionManager.transports)[0]];
+}
+/**
+* Get specifically the inspector transport for context and tools
+*/
+function getInspectorTransport() {
+	const connectionManager = getConnectionManager();
+	return connectionManager ? connectionManager.getInspectorTransport() : null;
 }
 function setupAcpMiddleware(middlewares, serverContext, acpOptions) {
 	/**
@@ -88398,10 +88501,28 @@ function setupAcpMiddleware(middlewares, serverContext, acpOptions) {
 					console.log(`[dev-inspector] [acp] Reusing existing provider for ${agent.name}`);
 					provider = providerEntry.provider;
 				} else {
+					if (!checkCommandExists(agent.command)) {
+						const hints = [`Agent "${agent.name}" command not found: "${agent.command}"`];
+						if (agent.installCommand) hints.push(`Install with: ${agent.installCommand}`);
+						if (agent.configHint) hints.push(agent.configHint);
+						if (agent.configLink) hints.push(`Documentation: ${agent.configLink}`);
+						console.error(`\n${hints.join("\n")}\n`);
+						return;
+					}
 					console.log(`[dev-inspector] [acp] Creating new global provider for ${agent.name}`);
+					let command = agent.command;
+					let args = agent.args;
+					if (agent.npmPackage) {
+						const binPath = resolveNpmPackageBin(agent.npmPackage);
+						if (binPath) {
+							command = binPath;
+							args = agent.npmArgs || [];
+							console.log(`[dev-inspector] [acp] Using resolved npm package: ${agent.npmPackage}`);
+						} else console.log(`[dev-inspector] [acp] Failed to resolve npm package, falling back to: ${agent.command}`);
+					}
 					provider = createACPProvider({
-						command: agent.command,
-						args: agent.args,
+						command,
+						args,
 						env: {
 							...process.env,
 							...envVars
@@ -88424,7 +88545,7 @@ function setupAcpMiddleware(middlewares, serverContext, acpOptions) {
 				}
 				console.log(`[dev-inspector] [acp] Spawning new process/session for ${agent.name}`);
 				const initPromise = (async () => {
-					const transport = getActiveTransport();
+					const transport = getInspectorTransport() || getActiveTransport();
 					let initialTools = {};
 					if (transport) try {
 						const rawTools = await loadMcpToolsV5(transport);
@@ -88456,6 +88577,7 @@ function setupAcpMiddleware(middlewares, serverContext, acpOptions) {
 			res.setHeader("Content-Type", "application/json");
 			res.end(JSON.stringify({ sessionId }));
 		} catch (error) {
+			if (error instanceof Error && error.message.includes("command not found")) throw error;
 			console.error("ACP Init Session Error:", error);
 			if (!res.headersSent) {
 				res.statusCode = 500;
@@ -88535,9 +88657,19 @@ function setupAcpMiddleware(middlewares, serverContext, acpOptions) {
 				shouldCleanupProvider = false;
 			} else {
 				console.log(`[dev-inspector] [acp] Creating new provider (no session found or provided)`);
+				let command = agent.command;
+				let args = agent.args;
+				if (agent.npmPackage) {
+					const binPath = resolveNpmPackageBin(agent.npmPackage);
+					if (binPath) {
+						command = binPath;
+						args = agent.npmArgs || [];
+						console.log(`[dev-inspector] [acp] Using resolved npm package: ${agent.npmPackage}`);
+					}
+				}
 				provider = createACPProvider({
-					command: agent.command,
-					args: agent.args,
+					command,
+					args,
 					env: {
 						...process.env,
 						...envVars
@@ -88550,7 +88682,7 @@ function setupAcpMiddleware(middlewares, serverContext, acpOptions) {
 				});
 				await provider.initSession();
 			}
-			const transport = getActiveTransport();
+			const transport = getInspectorTransport() || getActiveTransport();
 			let mcpTools = {};
 			if (transport) mcpTools = await loadMcpToolsV5(transport);
 			else console.warn("[dev-inspector] [acp] No active MCP transport available, tools will not be loaded");
@@ -88567,10 +88699,21 @@ function setupAcpMiddleware(middlewares, serverContext, acpOptions) {
 				abortController.abort();
 				if (shouldCleanupProvider) provider.cleanup();
 			});
+			const systemPrompt = agent.acpSystemPrompt ?? acpOptions?.acpSystemPrompt ?? DEFAULT_SYSTEM_INSTRUCTIONS;
+			const enhancedMessages = (0, ai.convertToModelMessages)(messages).map((msg, index$1) => {
+				if (index$1 === 0 && msg.role === "user" && Array.isArray(msg.content)) return {
+					...msg,
+					content: [{
+						type: "text",
+						text: `<system_instructions>\n${systemPrompt}\n</system_instructions>\n\n`
+					}, ...msg.content]
+				};
+				return msg;
+			});
 			const response = (0, ai.streamText)({
 				model: provider.languageModel(model, mode),
 				includeRawChunks: true,
-				messages: (0, ai.convertToModelMessages)(messages),
+				messages: enhancedMessages,
 				abortSignal: abortController.signal,
 				tools: acpTools(mcpTools),
 				onError: (error) => {