@democratize-quality/mcp-server 1.0.0

package/src/tools/browser/advanced/browser-dialog.js

@@ -0,0 +1,319 @@
+const ToolBase = require('../../base/ToolBase');
+const browserService = require('../../../services/browserService');
+
+/**
+ * Dialog Tool - Handle browser dialogs (alert, confirm, prompt)
+ * Inspired by Playwright MCP dialog capabilities
+ */
+class BrowserDialogTool extends ToolBase {
+    static definition = {
+        name: "browser_dialog",
+        description: "Handle browser dialogs including alert, confirm, and prompt dialogs with automatic detection and response.",
+        input_schema: {
+            type: "object",
+            properties: {
+                browserId: { 
+                    type: "string", 
+                    description: "The ID of the browser instance" 
+                },
+                action: {
+                    type: "string",
+                    enum: ["handle", "dismiss", "accept", "getInfo", "setupHandler"],
+                    description: "Dialog action to perform"
+                },
+                accept: {
+                    type: "boolean",
+                    default: true,
+                    description: "Whether to accept or dismiss the dialog (for handle action)"
+                },
+                promptText: {
+                    type: "string",
+                    description: "Text to enter in prompt dialogs"
+                },
+                autoHandle: {
+                    type: "boolean",
+                    default: false,
+                    description: "Whether to automatically handle future dialogs (for setupHandler action)"
+                },
+                defaultResponse: {
+                    type: "object",
+                    properties: {
+                        accept: { type: "boolean", description: "Default accept/dismiss behavior" },
+                        promptText: { type: "string", description: "Default text for prompts" }
+                    },
+                    description: "Default responses for auto-handling dialogs"
+                }
+            },
+            required: ["browserId", "action"]
+        },
+        output_schema: {
+            type: "object",
+            properties: {
+                success: { type: "boolean", description: "Whether the operation was successful" },
+                action: { type: "string", description: "The action that was performed" },
+                dialog: {
+                    type: "object",
+                    properties: {
+                        type: { type: "string" },
+                        message: { type: "string" },
+                        defaultValue: { type: "string" },
+                        handled: { type: "boolean" },
+                        response: { type: "string" }
+                    },
+                    description: "Dialog information"
+                },
+                autoHandling: { type: "boolean", description: "Whether auto-handling is enabled" },
+                browserId: { type: "string", description: "Browser instance ID" }
+            },
+            required: ["success", "action", "browserId"]
+        }
+    };
+
+    constructor() {
+        super();
+        this.dialogStates = new Map(); // browserId -> dialog state
+        this.autoHandlers = new Map(); // browserId -> auto-handler config
+    }
+
+    async execute(parameters) {
+        const { 
+            browserId, 
+            action, 
+            accept = true, 
+            promptText, 
+            autoHandle = false,
+            defaultResponse = {}
+        } = parameters;
+        
+        const browser = browserService.getBrowserInstance(browserId);
+        if (!browser) {
+            throw new Error(`Browser instance '${browserId}' not found`);
+        }
+
+        const client = browser.client;
+        
+        let result = {
+            success: false,
+            action: action,
+            browserId: browserId
+        };
+
+        switch (action) {
+            case 'setupHandler':
+                await this.setupDialogHandler(client, browserId, autoHandle, defaultResponse);
+                result.success = true;
+                result.autoHandling = autoHandle;
+                result.message = autoHandle ? 'Auto dialog handling enabled' : 'Dialog monitoring enabled';
+                break;
+                
+            case 'handle':
+                const handleResult = await this.handleDialog(browserId, accept, promptText);
+                result.success = true;
+                result.dialog = handleResult;
+                result.message = 'Dialog handled';
+                break;
+                
+            case 'accept':
+                const acceptResult = await this.handleDialog(browserId, true, promptText);
+                result.success = true;
+                result.dialog = acceptResult;
+                result.message = 'Dialog accepted';
+                break;
+                
+            case 'dismiss':
+                const dismissResult = await this.handleDialog(browserId, false);
+                result.success = true;
+                result.dialog = dismissResult;
+                result.message = 'Dialog dismissed';
+                break;
+                
+            case 'getInfo':
+                const dialogInfo = this.getDialogInfo(browserId);
+                result.success = true;
+                result.dialog = dialogInfo.dialog;
+                result.autoHandling = dialogInfo.autoHandling;
+                break;
+                
+            default:
+                throw new Error(`Unsupported dialog action: ${action}`);
+        }
+
+        return result;
+    }
+
+    /**
+     * Setup dialog handler with auto-handling capability
+     */
+    async setupDialogHandler(client, browserId, autoHandle, defaultResponse) {
+        // Enable Page domain for dialog events
+        await client.Page.enable();
+        
+        // Store auto-handler configuration
+        if (autoHandle) {
+            this.autoHandlers.set(browserId, {
+                enabled: true,
+                accept: defaultResponse.accept !== undefined ? defaultResponse.accept : true,
+                promptText: defaultResponse.promptText || ''
+            });
+        } else {
+            this.autoHandlers.delete(browserId);
+        }
+
+        // Set up dialog event listener
+        client.Page.javascriptDialogOpening((params) => {
+            const dialogInfo = {
+                type: params.type,
+                message: params.message,
+                defaultValue: params.defaultPrompt || '',
+                timestamp: new Date().toISOString(),
+                handled: false
+            };
+            
+            this.dialogStates.set(browserId, dialogInfo);
+            
+            // Auto-handle if configured
+            const autoHandler = this.autoHandlers.get(browserId);
+            if (autoHandler && autoHandler.enabled) {
+                setTimeout(async () => {
+                    try {
+                        await this.handleDialog(
+                            browserId, 
+                            autoHandler.accept, 
+                            params.type === 'prompt' ? autoHandler.promptText : undefined
+                        );
+                    } catch (error) {
+                        console.error(`[Dialog] Auto-handle failed for ${browserId}:`, error.message);
+                    }
+                }, 100); // Small delay to ensure dialog is fully loaded
+            }
+        });
+
+        client.Page.javascriptDialogClosed(() => {
+            const dialogState = this.dialogStates.get(browserId);
+            if (dialogState) {
+                dialogState.handled = true;
+                dialogState.closedAt = new Date().toISOString();
+            }
+        });
+    }
+
+    /**
+     * Handle an active dialog
+     */
+    async handleDialog(browserId, accept, promptText) {
+        const browser = browserService.getBrowserInstance(browserId);
+        if (!browser) {
+            throw new Error(`Browser instance '${browserId}' not found`);
+        }
+
+        const dialogState = this.dialogStates.get(browserId);
+        if (!dialogState) {
+            throw new Error('No active dialog found');
+        }
+
+        if (dialogState.handled) {
+            throw new Error('Dialog has already been handled');
+        }
+
+        const client = browser.client;
+        
+        try {
+            // Handle the dialog
+            await client.Page.handleJavaScriptDialog({
+                accept: accept,
+                promptText: dialogState.type === 'prompt' ? (promptText || '') : undefined
+            });
+            
+            // Update dialog state
+            dialogState.handled = true;
+            dialogState.response = accept ? 'accepted' : 'dismissed';
+            dialogState.promptText = promptText;
+            dialogState.handledAt = new Date().toISOString();
+            
+            return dialogState;
+        } catch (error) {
+            throw new Error(`Failed to handle dialog: ${error.message}`);
+        }
+    }
+
+    /**
+     * Get information about current dialog state
+     */
+    getDialogInfo(browserId) {
+        const dialogState = this.dialogStates.get(browserId);
+        const autoHandler = this.autoHandlers.get(browserId);
+        
+        return {
+            dialog: dialogState || null,
+            autoHandling: autoHandler?.enabled || false,
+            autoConfig: autoHandler || null
+        };
+    }
+
+    /**
+     * Wait for a dialog to appear
+     */
+    async waitForDialog(browserId, timeout = 10000) {
+        return new Promise((resolve, reject) => {
+            const timeoutId = setTimeout(() => {
+                reject(new Error(`Dialog wait timeout after ${timeout}ms`));
+            }, timeout);
+
+            const checkDialog = () => {
+                const dialogState = this.dialogStates.get(browserId);
+                if (dialogState && !dialogState.handled) {
+                    clearTimeout(timeoutId);
+                    resolve(dialogState);
+                } else {
+                    setTimeout(checkDialog, 100);
+                }
+            };
+
+            checkDialog();
+        });
+    }
+
+    /**
+     * Clear dialog state
+     */
+    clearDialogState(browserId) {
+        this.dialogStates.delete(browserId);
+    }
+
+    /**
+     * Get dialog history
+     */
+    getDialogHistory(browserId) {
+        // In a real implementation, you might store a history of dialogs
+        const currentDialog = this.dialogStates.get(browserId);
+        return currentDialog ? [currentDialog] : [];
+    }
+
+    /**
+     * Setup custom dialog responses for testing
+     */
+    setupTestDialogResponses(browserId, responses) {
+        // Store custom responses for different dialog types
+        this.autoHandlers.set(browserId, {
+            enabled: true,
+            customResponses: responses
+        });
+    }
+
+    /**
+     * Inject dialog trigger for testing
+     */
+    async triggerTestDialog(client, type = 'alert', message = 'Test dialog') {
+        const expressions = {
+            alert: `alert('${message}')`,
+            confirm: `confirm('${message}')`,
+            prompt: `prompt('${message}', 'default value')`
+        };
+
+        return await client.Runtime.evaluate({
+            expression: expressions[type] || expressions.alert
+        });
+    }
+}
+
+module.exports = BrowserDialogTool;

package/src/tools/browser/advanced/browser-evaluate.js

@@ -0,0 +1,337 @@
+const ToolBase = require('../../base/ToolBase');
+const browserService = require('../../../services/browserService');
+
+/**
+ * Enhanced Evaluate Tool - Execute JavaScript in browser context
+ * Inspired by Playwright MCP evaluate capabilities
+ */
+class BrowserEvaluateTool extends ToolBase {
+    static definition = {
+        name: "browser_evaluate",
+        description: "Execute JavaScript code in the browser context. Can execute on page or specific elements. Returns execution results and handles errors gracefully.",
+        input_schema: {
+            type: "object",
+            properties: {
+                browserId: { 
+                    type: "string", 
+                    description: "The ID of the browser instance" 
+                },
+                expression: {
+                    type: "string",
+                    description: "JavaScript expression or function to execute"
+                },
+                target: {
+                    type: "object",
+                    properties: {
+                        selector: { 
+                            type: "string", 
+                            description: "CSS selector of element to execute on (optional)" 
+                        }
+                    },
+                    description: "Target element for execution (if not provided, executes in page context)"
+                },
+                args: {
+                    type: "array",
+                    items: {},
+                    description: "Arguments to pass to the function (for function expressions)"
+                },
+                returnByValue: {
+                    type: "boolean",
+                    default: true,
+                    description: "Whether to return result by value or as object reference"
+                },
+                awaitPromise: {
+                    type: "boolean",
+                    default: true,
+                    description: "Whether to await promises in the result"
+                },
+                timeout: {
+                    type: "number",
+                    default: 30000,
+                    description: "Execution timeout in milliseconds"
+                }
+            },
+            required: ["browserId", "expression"]
+        },
+        output_schema: {
+            type: "object",
+            properties: {
+                success: { type: "boolean", description: "Whether the execution was successful" },
+                result: { description: "The result of the JavaScript execution" },
+                type: { type: "string", description: "Type of the returned result" },
+                error: { type: "string", description: "Error message if execution failed" },
+                executionTime: { type: "number", description: "Execution time in milliseconds" },
+                target: { type: "string", description: "CSS selector if targeting an element" },
+                browserId: { type: "string", description: "Browser instance ID" }
+            },
+            required: ["success", "browserId"]
+        }
+    };
+
+    async execute(parameters) {
+        const { 
+            browserId, 
+            expression, 
+            target, 
+            args = [], 
+            returnByValue = true, 
+            awaitPromise = true,
+            timeout = 30000
+        } = parameters;
+        
+        const browser = browserService.getBrowserInstance(browserId);
+        if (!browser) {
+            throw new Error(`Browser instance '${browserId}' not found`);
+        }
+
+        const client = browser.client;
+        const startTime = Date.now();
+        
+        let result = {
+            success: false,
+            browserId: browserId,
+            executionTime: 0
+        };
+
+        try {
+            if (target?.selector) {
+                // Execute on specific element
+                result = await this.executeOnElement(client, expression, target.selector, args, returnByValue, awaitPromise, timeout);
+                result.target = target.selector;
+            } else {
+                // Execute in page context
+                result = await this.executeInPage(client, expression, args, returnByValue, awaitPromise, timeout);
+            }
+            
+            result.success = true;
+            
+        } catch (error) {
+            result.success = false;
+            result.error = error.message;
+            
+            // Try to extract more meaningful error information
+            if (error.exceptionDetails) {
+                result.error = error.exceptionDetails.text || error.exceptionDetails.exception?.description || result.error;
+                result.lineNumber = error.exceptionDetails.lineNumber;
+                result.columnNumber = error.exceptionDetails.columnNumber;
+            }
+        }
+
+        result.executionTime = Date.now() - startTime;
+        result.browserId = browserId;
+        
+        return result;
+    }
+
+    /**
+     * Execute JavaScript in page context
+     */
+    async executeInPage(client, expression, args, returnByValue, awaitPromise, timeout) {
+        // Wrap expression in timeout handling
+        const wrappedExpression = this.wrapWithTimeout(expression, timeout);
+        
+        const evalResult = await client.Runtime.evaluate({
+            expression: wrappedExpression,
+            returnByValue: returnByValue,
+            awaitPromise: awaitPromise,
+            timeout: timeout
+        });
+
+        if (evalResult.exceptionDetails) {
+            throw evalResult.exceptionDetails;
+        }
+
+        return this.formatResult(evalResult.result);
+    }
+
+    /**
+     * Execute JavaScript on a specific element
+     */
+    async executeOnElement(client, expression, selector, args, returnByValue, awaitPromise, timeout) {
+        // First, get the element
+        const elementExpression = `
+            (() => {
+                const element = document.querySelector('${selector}');
+                if (!element) {
+                    throw new Error('Element not found with selector: ${selector}');
+                }
+                return element;
+            })()
+        `;
+
+        const elementResult = await client.Runtime.evaluate({
+            expression: elementExpression,
+            returnByValue: false
+        });
+
+        if (elementResult.exceptionDetails) {
+            throw new Error(`Failed to find element: ${elementResult.exceptionDetails.text}`);
+        }
+
+        // Now execute the expression on the element
+        const executeExpression = this.createElementExpression(expression, args);
+        const wrappedExpression = this.wrapWithTimeout(executeExpression, timeout);
+
+        const evalResult = await client.Runtime.callFunctionOn({
+            functionDeclaration: wrappedExpression,
+            objectId: elementResult.result.objectId,
+            arguments: args.map(arg => ({ value: arg })),
+            returnByValue: returnByValue,
+            awaitPromise: awaitPromise
+        });
+
+        if (evalResult.exceptionDetails) {
+            throw evalResult.exceptionDetails;
+        }
+
+        return this.formatResult(evalResult.result);
+    }
+
+    /**
+     * Create expression for element execution
+     */
+    createElementExpression(expression, args) {
+        // If expression is a function, use it directly
+        if (expression.trim().startsWith('function') || expression.includes('=>')) {
+            return `(${expression}).apply(this, arguments)`;
+        }
+        
+        // If it's a simple expression, wrap it in a function
+        return `function() { return ${expression}; }`;
+    }
+
+    /**
+     * Wrap expression with timeout handling
+     */
+    wrapWithTimeout(expression, timeout) {
+        return `
+            (async () => {
+                const timeoutPromise = new Promise((_, reject) => 
+                    setTimeout(() => reject(new Error('Execution timeout')), ${timeout})
+                );
+                
+                const executionPromise = (async () => {
+                    ${expression.includes('return') ? expression : `return (${expression})`}
+                })();
+                
+                return Promise.race([executionPromise, timeoutPromise]);
+            })()
+        `;
+    }
+
+    /**
+     * Format execution result
+     */
+    formatResult(result) {
+        if (!result) {
+            return { result: undefined, type: 'undefined' };
+        }
+
+        let formattedResult = {
+            type: result.type
+        };
+
+        switch (result.type) {
+            case 'object':
+                if (result.subtype === 'null') {
+                    formattedResult.result = null;
+                } else if (result.subtype === 'array') {
+                    formattedResult.result = result.value || result.description;
+                    formattedResult.subtype = 'array';
+                } else if (result.subtype === 'error') {
+                    formattedResult.result = result.description;
+                    formattedResult.subtype = 'error';
+                } else {
+                    formattedResult.result = result.value || result.description;
+                }
+                break;
+                
+            case 'function':
+                formattedResult.result = result.description;
+                break;
+                
+            case 'undefined':
+                formattedResult.result = undefined;
+                break;
+                
+            case 'string':
+            case 'number':
+            case 'boolean':
+                formattedResult.result = result.value;
+                break;
+                
+            default:
+                formattedResult.result = result.value !== undefined ? result.value : result.description;
+        }
+
+        return formattedResult;
+    }
+
+    /**
+     * Common JavaScript snippets for evaluation
+     */
+    static getCommonSnippets() {
+        return {
+            getPageInfo: `
+                ({
+                    title: document.title,
+                    url: window.location.href,
+                    readyState: document.readyState,
+                    elementCount: document.querySelectorAll('*').length,
+                    viewport: {
+                        width: window.innerWidth,
+                        height: window.innerHeight
+                    }
+                })
+            `,
+            
+            getElementInfo: `
+                function(element) {
+                    const rect = element.getBoundingClientRect();
+                    return {
+                        tagName: element.tagName,
+                        id: element.id,
+                        className: element.className,
+                        textContent: element.textContent?.substring(0, 100),
+                        bounds: {
+                            x: rect.x,
+                            y: rect.y,
+                            width: rect.width,
+                            height: rect.height
+                        },
+                        visible: rect.width > 0 && rect.height > 0,
+                        attributes: Array.from(element.attributes).reduce((acc, attr) => {
+                            acc[attr.name] = attr.value;
+                            return acc;
+                        }, {})
+                    };
+                }
+            `,
+            
+            scrollToElement: `
+                function(element) {
+                    element.scrollIntoView({ behavior: 'smooth', block: 'center' });
+                    return { scrolled: true, element: element.tagName };
+                }
+            `,
+            
+            getFormData: `
+                () => {
+                    const forms = Array.from(document.forms);
+                    return forms.map(form => ({
+                        action: form.action,
+                        method: form.method,
+                        fields: Array.from(form.elements).map(el => ({
+                            name: el.name,
+                            type: el.type,
+                            value: el.value,
+                            required: el.required
+                        }))
+                    }));
+                }
+            `
+        };
+    }
+}
+
+module.exports = BrowserEvaluateTool;