fastbrowser_cli 1.0.14 → 1.0.16

package/src/fastbrowser_mcp/fastbrowser_mcp.ts

@@ -1,13 +1,20 @@
 #!/usr/bin/env node
 
+// node imports
+import * as Assert from 'node:assert/strict';
+import Fs from 'node:fs';
+import Path from 'node:path';
+
 // npm imports
-import { Command } from 'commander';
+import { Command, Option } from 'commander';
 import { z } from "zod";
-import * as A11yParse from "../../../a11y_parse/dist/src/index.js";
+import * as A11yParse from "a11y_parse";
 
 // local imports
-import { McpClient } from "./libs/mcp_client.js";
+import { McpMyClient } from "./libs/mcp_my_client.js";
 import { McpProxy } from "./libs/mcp_proxy.js";
+import { ResponseFormatter } from "./libs/response_formatter.js";
+import { FastBrowserMcpTarget } from './fastbrowser_types.js';
 import {
 	QuerySelectorInputSchema,
 	QuerySelectorsInputSchema,
@@ -18,6 +25,9 @@ import {
 	type QuerySelectorFirstInput,
 	type QuerySelectorsFirstInput,
 } from "./libs/schemas.js";
+import { McpTargetHelper } from './libs/mcp_target_helper.js';
+import { McpServer } from "@modelcontextprotocol/sdk/server/mcp.js";
+import { CallToolResult } from '@modelcontextprotocol/sdk/types';
 
 export {
 	QuerySelectorInputSchema,
@@ -37,38 +47,50 @@ export {
 ///////////////////////////////////////////////////////////////////////////////
 
 class MainHelper {
+	private static async _getA11yText(mcpClient: McpMyClient): Promise<string> {
+		const mcpTarget = await mcpClient.getMcpTarget();
+		const toolConfig = await McpTargetHelper.targetToolTakeSnapshot(mcpTarget);
+		const callToolResult = await mcpClient.callTool(toolConfig.toolName, toolConfig.toolArgs);
+		const snapshotText = await ResponseFormatter.formatTakeSnapshot(mcpTarget, callToolResult);
+		// sanity check
+		Assert.ok(snapshotText !== undefined, "Snapshot text is empty");
+
+		// return the snapshot text
+		return snapshotText;
+	}
+
+	/**
+	 * TODO to remove this function - just call the .parse
+	 * @param mcpClient 
+	 * @returns 
+	 */
+	private static async _getSnapshotTree(mcpClient: McpMyClient): Promise<{ snapshotText: string, a11yTree: A11yParse.AxNode }> {
+		const a11yText: string = await this._getA11yText(mcpClient);
+
+		// parse the accessibility tree
+		const a11yTree = A11yParse.A11yTree.parse(a11yText);
+
+		// return the parsed accessibility tree
+		return { snapshotText: a11yText, a11yTree }
+	}
+
 	/**
 	 * Takes a snapshot of the current page to get the latest accessibility tree, and parses it into an AxNode tree structure.
 	 * @param mcpClient The MCP client to use for taking a snapshot.
 	 * @returns The parsed accessibility tree as an AxNode.
 	 */
-	private static async _resolveSelectorToUid(mcpClient: McpClient, selector: string): Promise<string> {
+	private static async _resolveSelectorToUid(mcpClient: McpMyClient, selector: string): Promise<string> {
+		// Fast path: if the selector is already a uid selector (e.g. "#1_3"), extract and return the uid directly without 
+		// taking a snapshot or querying the tree.
 		const fastPathMatch = selector.match(/^#([\w-]+)$/);
 		if (fastPathMatch !== null) return fastPathMatch[1];
-		const a11yTree = await this._getSnapshotTree(mcpClient);
+
+		// Slow path: take a snapshot, parse the tree, and query it with the provided selector to find the uid of the first matching node.
+		const { a11yTree } = await this._getSnapshotTree(mcpClient);
 		const selectedNodes = A11yParse.A11yQuery.querySelectorAll(a11yTree, selector);
 		if (selectedNodes.length === 0) throw new Error(`No node matched selector '${selector}'`);
-		return selectedNodes[0].uid;
-	}
-
-	private static async _getSnapshotTree(mcpClient: McpClient): Promise<A11yParse.AxNode> {
-		// take a snapshot to get the latest accessibility tree
-		const response = await mcpClient.callTool('take_snapshot', {});
-		const responseText = response.content[0]
-		if (responseText.type !== "text") throw new Error("Unexpected content type");
 
-		// get the snapshot text and remove the first line (snapshot metadata)	
-		let snapshotText = responseText.text;
-		snapshotText = snapshotText.split('\n').slice(1).join('\n');
-
-		// log to console for debugging
-		// console.log("Snapshot text content:");
-		// console.log(snapshotText);
-
-		// parse the accessibility tree
-		const a11yTree = A11yParse.A11yTree.parse(snapshotText);
-
-		return a11yTree
+		return selectedNodes[0].uid;
 	}
 
 	/**
@@ -104,8 +126,8 @@ class MainHelper {
 	 * @param querySelectors The selectors to query the accessibility tree with.
 	 * @returns A text representation of the query results.
 	 */
-	static async querySelectorsAll(mcpClient: McpClient, querySelectors: QuerySelectorsInput): Promise<string> {
-		const a11yTree = await this._getSnapshotTree(mcpClient);
+	static async querySelectorsAll(mcpClient: McpMyClient, querySelectors: QuerySelectorsInput): Promise<string> {
+		const { a11yTree } = await this._getSnapshotTree(mcpClient);
 
 		const responseTexts: string[] = [];
 		for (const querySelector of querySelectors.selectors) {
@@ -133,8 +155,8 @@ class MainHelper {
 	 * @param querySelectors The selectors to query the accessibility tree with.
 	 * @returns A text representation of the first matching node for each selector.
 	 */
-	static async querySelectors(mcpClient: McpClient, querySelectors: QuerySelectorsFirstInput): Promise<string> {
-		const a11yTree = await this._getSnapshotTree(mcpClient);
+	static async querySelectors(mcpClient: McpMyClient, querySelectors: QuerySelectorsFirstInput): Promise<string> {
+		const { a11yTree } = await this._getSnapshotTree(mcpClient);
 
 		const responseTexts: string[] = [];
 		for (const querySelector of querySelectors.selectors) {
@@ -148,106 +170,82 @@ class MainHelper {
 
 	///////////////////////////////////////////////////////////////////////////////
 	///////////////////////////////////////////////////////////////////////////////
-	//	
+	//	Init external tools (i.e. tools that are implemented in terms of calls to the mcpClient, rather than directly registered on the mcpClient)
 	///////////////////////////////////////////////////////////////////////////////
 	///////////////////////////////////////////////////////////////////////////////
 
-	static async commandMcpServer({
-		verbose = false,
-	}: {
-		verbose?: boolean
-	}): Promise<void> {
+	static async initExternalTools(mcpServer: McpServer, mcpClient: McpMyClient): Promise<void> {
+		const mcpTarget = await mcpClient.getMcpTarget();
 
 		///////////////////////////////////////////////////////////////////////////////
 		///////////////////////////////////////////////////////////////////////////////
-		//	mcp client
+		//	list_pages
 		///////////////////////////////////////////////////////////////////////////////
 		///////////////////////////////////////////////////////////////////////////////
 
-		// Create the mcp client toward the official chrome-devtools-mcp tool, which provides access to a Chrome tab's accessibility 
-		// tree and allows us to take snapshots and query the tree with selectors.
-		const mcpClient = new McpClient({
-			name: "my-app",
-			version: "0.1.0",
-			transport: {
-				type: "stdio",
-				command: "npx",
-				args: [
-					"chrome-devtools-mcp@latest", "--autoconnect", "--no-performance-crux", "--no-usage-statistics",
-				],
+		mcpServer.registerTool(
+			McpTargetHelper.EXTERNAL_TOOL_NAME.listPages,
+			{
+				description: "List the open pages/tabs in the browser",
+				inputSchema: z.object({}),
 			},
-		});
-
-		// Connect the mcp client to the chrome-devtools-mcp tool, which will allow us to take snapshots and query the accessibility tree.
-		await mcpClient.connect();
-
+			async () => {
+				const toolConfig = await McpTargetHelper.targetToolListPages(mcpTarget);
+				const callToolResult = await mcpClient.callTool(toolConfig.toolName, toolConfig.toolArgs);
+				let outputStr = await ResponseFormatter.formatListPages(mcpTarget, callToolResult);
 
-		if (verbose) {
-			// list all the tools available in mcpClient for debugging
-			const mcpClientTools = await mcpClient.listTools();
-			console.error("Tools available in mcpClient:");
-			for (const tool of mcpClientTools) {
-				console.error(`- ${tool.name}: ${tool.description}`);
+				return {
+					content: [{ type: "text", text: outputStr }],
+				};
 			}
-		}
+		);
 
 		///////////////////////////////////////////////////////////////////////////////
 		///////////////////////////////////////////////////////////////////////////////
-		//	
+		//	navigate_page
 		///////////////////////////////////////////////////////////////////////////////
 		///////////////////////////////////////////////////////////////////////////////
 
-		if (false) {
-			await mcpClient.callTool('navigate_page', {
-				// url: "https://www.example.com/",
-				url: "https://welcometothejungle.com/"
-			});
-			const responseText = await MainHelper.querySelectorsAll(mcpClient, {
-				selectors: [
-					{
-						selector: "link, button",
-						withAncestors: true,
-						limit: 0,
-					},
-					{
-						selector: 'heading[level="1"]',
-						withAncestors: false,
-						limit: 0,
-					},
-				],
-			});
-			console.log(responseText);
-			await mcpClient.close();
-			process.exit(0);
-		}
+		mcpServer.registerTool(
+			McpTargetHelper.EXTERNAL_TOOL_NAME.navigatePage,
+			{
+				description: "Navigate the current page to a new URL",
+				inputSchema: z.object({
+					url: z.string().describe("The URL to navigate to"),
+				}),
+			},
+			async ({ url }: { url: string }) => {
+				const toolConfig = await McpTargetHelper.targetToolNavigatePage(mcpTarget, url);
+				const callToolResult = await mcpClient.callTool(toolConfig.toolName, toolConfig.toolArgs);
+				let outputStr = await ResponseFormatter.formatNavigatePage(mcpTarget, callToolResult);
+
+				return {
+					content: [{ type: "text", text: outputStr }],
+				};
+			}
+		);
 
 		///////////////////////////////////////////////////////////////////////////////
 		///////////////////////////////////////////////////////////////////////////////
-		//	
+		//	list_pages
 		///////////////////////////////////////////////////////////////////////////////
 		///////////////////////////////////////////////////////////////////////////////
 
-		// Create the MCP proxy server, which will expose tools to the MCP client and proxy calls to those tools to 
-		// the mcpClient connected to the chrome-devtools-mcp.
-		const mcpProxy = new McpProxy();
-
-		// Proxy the 'most interesting' tools from the mcpClient to the mcpProxy, so that they can be called from the 
-		// MCP server (and thus from an LLM agent connected to the MCP server).
-		// TODO new_page/navigate_page are very similar - maybe we can unify them in the chrome-devtools-mcp tool and 
-		// - have a single 'open_page' tool instead?
-		const toolsToProxys: string[] = [
-			'list_pages',
-			'new_page',
-			'close_page',
-			'navigate_page',
-			'take_snapshot',
-		]
-		for (const toolName of toolsToProxys) {
-			await mcpProxy.proxyToolCall(mcpClient, toolName)
-		}
+		mcpServer.registerTool(
+			McpTargetHelper.EXTERNAL_TOOL_NAME.takeSnapshot,
+			{
+				description: "Take a snapshot of the current page to get the latest accessibility tree",
+				inputSchema: z.object({}),
+			},
+			async () => {
+				const a11yText: string = await MainHelper._getA11yText(mcpClient);
+				let outputStr = a11yText
 
-		// Connect the MCP proxy server to start accepting connections from MCP clients (e.g. LLM agents).
-		await mcpProxy.connect();
+				return {
+					content: [{ type: "text", text: outputStr }],
+				};
+			}
+		);
 
 		///////////////////////////////////////////////////////////////////////////////
 		///////////////////////////////////////////////////////////////////////////////
@@ -269,9 +267,8 @@ class MainHelper {
 			`- You can combine selectors: e.g. 'RootWebArea > link[url*="iana"]'`,
 		].join('\n');
 
-		const mcpServer = await mcpProxy.getMcpServer();
 		mcpServer.registerTool(
-			"querySelectorsAll",
+			McpTargetHelper.EXTERNAL_TOOL_NAME.querySelectorsAll,
 			{
 				description: [
 					`Query the accessibility tree with CSS-like selectors`,
@@ -296,7 +293,7 @@ class MainHelper {
 		///////////////////////////////////////////////////////////////////////////////
 
 		mcpServer.registerTool(
-			"querySelectors",
+			McpTargetHelper.EXTERNAL_TOOL_NAME.querySelectors,
 			{
 				description: [
 					`Query the accessibility tree with one or more CSS-like selectors. For each selector, returns the first matching node (or "No node found").`,
@@ -306,7 +303,6 @@ class MainHelper {
 			},
 			async (querySelectorsInput: QuerySelectorsFirstInput) => {
 				const outputText: string = await MainHelper.querySelectors(mcpClient, querySelectorsInput);
-
 				return {
 					content: [{ type: "text", text: outputText }],
 				};
@@ -320,7 +316,7 @@ class MainHelper {
 		///////////////////////////////////////////////////////////////////////////////
 
 		mcpServer.registerTool(
-			"pressKeys",
+			McpTargetHelper.EXTERNAL_TOOL_NAME.pressKeys,
 			{
 				description: "Press a sequence of keys on the page. E.g. 'Tab', 'Enter', 'ArrowDown'",
 				inputSchema: z.object({
@@ -345,12 +341,22 @@ class MainHelper {
 				console.error("Keys to send:", keysToSend);
 				// chrome-devtools-mcp's 'press_key' tool accepts a single 'key' per call — loop through the sequence
 				for (const key of keysToSend) {
-					await mcpClient.callTool('press_key', { key });
+					const toolConfig = await McpTargetHelper.targetToolPressKey(mcpTarget, key);
+					const callToolResult = await mcpClient.callTool(toolConfig.toolName, toolConfig.toolArgs);
+					// trying to handle the error case
+					if (callToolResult.isError) {
+						console.error(`Error pressing key '${key}':`, callToolResult.error);
+						return {
+							content: [{ type: "text", text: `Error pressing key '${key}'` }],
+						};
+					}
 				}
 
+				let outputText = await ResponseFormatter.formatPressKeys(mcpTarget, keysToSend);
+
 				// return a response indicating which keys were pressed
 				return {
-					content: [{ type: "text", text: `Pressed keys: ${keysToSend.join(', ')}` }],
+					content: [{ type: "text", text: outputText }],
 				};
 			}
 		);
@@ -362,7 +368,7 @@ class MainHelper {
 		///////////////////////////////////////////////////////////////////////////////
 
 		mcpServer.registerTool(
-			"click",
+			McpTargetHelper.EXTERNAL_TOOL_NAME.click,
 			{
 				description: [
 					`Click an element selected by an accessibility selector.`,
@@ -374,7 +380,14 @@ class MainHelper {
 			},
 			async ({ selector }: { selector: string }) => {
 				const uid = await MainHelper._resolveSelectorToUid(mcpClient, selector);
-				return await mcpClient.callTool('click', { uid });
+
+				const toolConfig = await McpTargetHelper.targetToolClick(mcpTarget, uid);
+				const callToolResult = await mcpClient.callTool(toolConfig.toolName, toolConfig.toolArgs);
+				let outputText = await ResponseFormatter.formatClick(mcpTarget, callToolResult);
+
+				return {
+					content: [{ type: "text", text: outputText }],
+				};
 			}
 		);
 
@@ -385,7 +398,7 @@ class MainHelper {
 		///////////////////////////////////////////////////////////////////////////////
 
 		mcpServer.registerTool(
-			"fill_form",
+			McpTargetHelper.EXTERNAL_TOOL_NAME.fillForm,
 			{
 				description: [
 					`Fill one or more form fields, each selected by an accessibility selector.`,
@@ -399,11 +412,40 @@ class MainHelper {
 				},
 			},
 			async ({ elements }: { elements: { selector: string; value: string }[] }) => {
-				const resolved = await Promise.all(elements.map(async (element) => ({
-					uid: await MainHelper._resolveSelectorToUid(mcpClient, element.selector),
-					value: element.value,
-				})));
-				return await mcpClient.callTool('fill_form', { elements: resolved });
+				const resolved = [];
+				for (const element of elements) {
+					const uid = await MainHelper._resolveSelectorToUid(mcpClient, element.selector);
+					resolved.push({
+						uid,
+						value: element.value,
+					});
+				}
+				if (mcpTarget === 'chrome_devtools') {
+					const toolConfig = await McpTargetHelper.targetToolFillForm(mcpTarget, resolved);
+					const callToolResult = await mcpClient.callTool(toolConfig.toolName, toolConfig.toolArgs);
+					// const callToolResult = await mcpClient.callTool('fill_form', { elements: resolved });
+					return callToolResult
+				} else if (mcpTarget === 'playwright') {
+					type Field = {
+						name: string; // Human readable name for the field, e.g. "Email address"
+						// type can be textbox, checkbox, radio, combobox, or slider
+						type: 'textbox' | 'checkbox' | 'radio' | 'combobox' | 'slider';
+						// the uid of the field's corresponding node in the accessibility tree
+						ref: string;
+						// the value to fill into the field - for checkboxes this can be "checked" or "unchecked", for radio buttons this can be "selected", for comboboxes this can be the option to select, and for sliders this can be the value to set the slider to
+						value: string
+					};
+					const fields: Field[] = resolved.map((element, index) => ({
+						name: `Field ${index + 1}`,
+						type: 'textbox', // for simplicity, we assume all fields are textboxes in this example
+						ref: element.uid,
+						value: element.value,
+					}));
+					const callToolResult = await mcpClient.callTool('browser_fill_form', { fields: fields });
+					return callToolResult
+				} else {
+					throw new Error(`Unsupported MCP target: ${mcpTarget}`);
+				}
 			}
 		);
 
@@ -413,34 +455,144 @@ class MainHelper {
 		///////////////////////////////////////////////////////////////////////////////
 		///////////////////////////////////////////////////////////////////////////////
 
-		// const mcpServer = await mcpProxy.getMcpServer();
-		// const timezoneSchema = {
-		// 	timezone: z.string().optional().describe("IANA timezone name (e.g. 'America/New_York'). Defaults to local system timezone."),
-		// };
-		// mcpServer.registerTool(
-		// 	"get_current_datetime",
-		// 	{
-		// 		description: "Get the current date and time",
-		// 		inputSchema: timezoneSchema,
-		// 	},
-		// 	async ({ timezone }) => {
-		// 		const date = new Date();
-		// 		const options: Intl.DateTimeFormatOptions = {
-		// 			timeZone: timezone,
-		// 			year: "numeric",
-		// 			month: "2-digit",
-		// 			day: "2-digit",
-		// 			hour: "2-digit",
-		// 			minute: "2-digit",
-		// 			second: "2-digit",
-		// 			timeZoneName: "short",
-		// 		};
-		// 		const formatted = new Intl.DateTimeFormat("en-US", options).format(date);
-		// 		return {
-		// 			content: [{ type: "text", text: formatted }],
-		// 		};
-		// 	}
-		// );
+		const timezoneSchema = {
+			timezone: z.string().optional().describe("IANA timezone name (e.g. 'America/New_York'). Defaults to local system timezone."),
+		};
+		mcpServer.registerTool(
+			McpTargetHelper.EXTERNAL_TOOL_NAME.getCurrentDateTime,
+			{
+				description: "Get the current date and time",
+				inputSchema: timezoneSchema,
+			},
+			async ({ timezone }) => {
+				const date = new Date();
+				const options: Intl.DateTimeFormatOptions = {
+					timeZone: timezone,
+					year: "numeric",
+					month: "2-digit",
+					day: "2-digit",
+					hour: "2-digit",
+					minute: "2-digit",
+					second: "2-digit",
+					timeZoneName: "short",
+				};
+				const formatted = new Intl.DateTimeFormat("en-US", options).format(date);
+				return {
+					content: [{ type: "text", text: formatted }],
+				};
+			}
+		);
+	}
+
+	///////////////////////////////////////////////////////////////////////////////
+	///////////////////////////////////////////////////////////////////////////////
+	//	.commandMcpServer: the main entry point for starting the MCP proxy server, which connects to the MCP 
+	// 	target (e.g. chrome-devtools-mcp), proxies tools from the MCP target, and registers external tools that 
+	// 	are implemented in terms of calls to the MCP target.
+	///////////////////////////////////////////////////////////////////////////////
+	///////////////////////////////////////////////////////////////////////////////
+
+	static async commandMcpServer({
+		mcpTarget,
+		verbose = false,
+	}: {
+		mcpTarget: FastBrowserMcpTarget,
+		verbose?: boolean
+	}): Promise<void> {
+		///////////////////////////////////////////////////////////////////////////////
+		///////////////////////////////////////////////////////////////////////////////
+		//	mcp client
+		///////////////////////////////////////////////////////////////////////////////
+		///////////////////////////////////////////////////////////////////////////////
+
+		const { command: mcpCommand, args: mcpArgs } = McpTargetHelper.mcpArgs(mcpTarget);
+
+		// TODO remove this MCPMyClient - confusing
+
+		// Create the mcp client toward the official chrome-devtools-mcp tool, which provides access to a Chrome tab's accessibility 
+		// tree and allows us to take snapshots and query the tree with selectors.
+		const mcpClient = new McpMyClient({
+			name: "fastbrowser_mcp_proxy_client",
+			version: "1.0.0",
+			mcpTarget,
+			transport: {
+				type: "stdio",
+				command: mcpCommand,
+				args: mcpArgs,
+			},
+		});
+
+		// Connect the mcp client to the chrome-devtools-mcp tool, which will allow us to take snapshots and query the accessibility tree.
+		await mcpClient.connect();
+
+		// If verbose mode is enabled, list all the tools available in the mcpClient for debugging purposes.
+		if (verbose) {
+			// list all the tools available in mcpClient for debugging
+			const mcpClientTools = await mcpClient.listTools();
+			console.error("Tools available in mcpClient:");
+			for (const tool of mcpClientTools) {
+				console.error(`- ${tool.name}: ${tool.description}`);
+			}
+		}
+
+		///////////////////////////////////////////////////////////////////////////////
+		///////////////////////////////////////////////////////////////////////////////
+		//	
+		///////////////////////////////////////////////////////////////////////////////
+		///////////////////////////////////////////////////////////////////////////////
+
+		if (false) {
+			await mcpClient.callTool('navigate_page', {
+				// url: "https://www.example.com/",
+				url: "https://welcometothejungle.com/"
+			});
+			const responseText = await MainHelper.querySelectorsAll(mcpClient, {
+				selectors: [
+					{
+						selector: "link, button",
+						withAncestors: true,
+						limit: 0,
+					},
+					{
+						selector: 'heading[level="1"]',
+						withAncestors: false,
+						limit: 0,
+					},
+				],
+			});
+			console.log(responseText);
+			await mcpClient.close();
+			process.exit(0);
+		}
+
+		///////////////////////////////////////////////////////////////////////////////
+		///////////////////////////////////////////////////////////////////////////////
+		//	
+		///////////////////////////////////////////////////////////////////////////////
+		///////////////////////////////////////////////////////////////////////////////
+
+		// Create the MCP proxy server, which will expose tools to the MCP client and proxy calls to those tools to 
+		// the mcpClient connected to the chrome-devtools-mcp.
+		const mcpProxy = new McpProxy();
+
+		// Proxy the 'most interesting' tools from the mcpClient to the mcpProxy, so that they can be called from the 
+		// MCP server (and thus from an LLM agent connected to the MCP server).
+		const toolsToProxys: string[] = await McpTargetHelper.toolsToProxy(mcpTarget);
+		for (const toolName of toolsToProxys) {
+			await mcpProxy.proxyToolCall(mcpClient, toolName)
+		}
+		///////////////////////////////////////////////////////////////////////////////
+		///////////////////////////////////////////////////////////////////////////////
+		//	.querySelectorsAll tool implementation
+		///////////////////////////////////////////////////////////////////////////////
+		///////////////////////////////////////////////////////////////////////////////
+		const mcpServer = await mcpProxy.getMcpServer();
+
+		await MainHelper.initExternalTools(mcpServer, mcpClient);
+
+
+		// Connect the MCP proxy server to start accepting connections from MCP clients (e.g. LLM agents).
+		await mcpProxy.connect();
 	}
 }
 
@@ -451,16 +603,38 @@ class MainHelper {
 ///////////////////////////////////////////////////////////////////////////////
 
 async function main() {
-	const program = new Command();
+	// Redirect process.stderr to a log file, so that the MCP communication is not polluted by logs.
+	const logFile = Path.resolve(import.meta.dirname, `../../outputs/fastbrowser_mcp_${new Date().toISOString()}.log`);
+	const logStream = Fs.createWriteStream(logFile, { flags: 'a' });
+	process.stderr.write = logStream.write.bind(logStream);
 
+
+	// throw Error("This entry point is not meant to be run directly. Please run one of the npm scripts defined in package.json, e.g. 'npm run start:fastbrowser_mcp' or 'npm run inspect:fastbrowser_mcp:chrome_devtools'");
+
+	const program = new Command();
 	program
 		.command('mcp_server')
 		.description('Start the MCP proxy server')
 		.option('-v, --verbose', 'Enable verbose logging')
-		.action(async ({ verbose }: { verbose?: boolean }) => {
-			await MainHelper.commandMcpServer({ verbose });
+		.addOption(
+			new Option('-b, --mcp_target <mcpTarget>', 'the MCP> of MCP to run')
+				.choices(['chrome_devtools', 'playwright'])
+				.default('playwright')
+		)
+		.action(async (options: { verbose?: boolean, mcp_target: FastBrowserMcpTarget }) => {
+			await MainHelper.commandMcpServer({
+				mcpTarget: options.mcp_target,
+				verbose: options.verbose,
+			});
 		});
 
+	// display help if no command is provided
+	if (process.argv.length < 3) {
+		program.help();
+		process.exit(1);
+	}
+
+	// Parse the command-line arguments and execute the appropriate command action.
 	program.parse(process.argv);
 }