@wong2kim/wmux 1.1.0 → 1.1.2

package/dist/mcp/mcp/playwright/tools/interaction.js

@@ -0,0 +1,387 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.registerInteractionTools = registerInteractionTools;
+const zod_1 = require("zod");
+const PlaywrightEngine_1 = require("../PlaywrightEngine");
+const snapshot_1 = require("../snapshot");
+const dom_intelligence_1 = require("../dom-intelligence");
+const human_typing_1 = require("../human-typing");
+// Optional surfaceId schema reused across tools
+const optionalSurfaceId = zod_1.z
+    .string()
+    .optional()
+    .describe('Target a specific surface by ID. Omit to use the active surface.');
+const REF_NOT_FOUND_HINT = 'Element with ref={ref} not found. Run browser_snapshot to get current refs.';
+function refNotFound(ref) {
+    return REF_NOT_FOUND_HINT.replace('{ref}', ref);
+}
+/**
+ * Register interaction-related MCP tools on the given server.
+ *
+ * Tools:
+ *  - browser_click            — click or double-click an element
+ *  - browser_type             — type text into an element
+ *  - browser_fill             — fill multiple form fields at once
+ *  - browser_press_key        — press a keyboard key
+ *  - browser_hover            — hover over an element
+ *  - browser_drag             — drag from source to target element
+ *  - browser_select           — select option(s) in a <select>
+ *  - browser_scroll_into_view — scroll element into viewport
+ */
+function registerInteractionTools(server) {
+    const engine = PlaywrightEngine_1.PlaywrightEngine.getInstance();
+    // -----------------------------------------------------------------------
+    // browser_click
+    // -----------------------------------------------------------------------
+    server.tool('browser_click', 'Click an element identified by its ref number from the accessibility snapshot, or by a smartRef from browser_smart_snapshot.', {
+        ref: zod_1.z.string().optional().describe('Element ref number from browser_snapshot'),
+        smartRef: zod_1.z
+            .number()
+            .optional()
+            .describe('Element ref number from browser_smart_snapshot (dom-intelligence). If provided, takes priority over ref.'),
+        double: zod_1.z
+            .boolean()
+            .optional()
+            .describe('If true, perform a double-click instead of a single click.'),
+        surfaceId: optionalSurfaceId,
+    }, async ({ ref, smartRef, double, surfaceId }) => {
+        try {
+            const page = await engine.getPage(surfaceId);
+            if (!page) {
+                throw new Error('No browser page available. Call browser_open first.');
+            }
+            if (smartRef !== undefined) {
+                // Use dom-intelligence ref resolution
+                const selector = (0, dom_intelligence_1.getLocatorByRef)(smartRef);
+                if (!selector) {
+                    throw new Error(`Element with smartRef=${smartRef} not found. Run browser_smart_snapshot to get current refs.`);
+                }
+                const locator = page.locator(selector);
+                if (double) {
+                    await locator.dblclick();
+                }
+                else {
+                    await locator.click();
+                }
+                return {
+                    content: [
+                        {
+                            type: 'text',
+                            text: `Clicked${double ? ' (double)' : ''} element smartRef=${smartRef}`,
+                        },
+                    ],
+                };
+            }
+            if (!ref) {
+                throw new Error('Either ref or smartRef must be provided.');
+            }
+            const el = await (0, snapshot_1.resolveRef)(page, ref);
+            if (!el) {
+                throw new Error(refNotFound(ref));
+            }
+            if (double) {
+                await el.dblclick();
+            }
+            else {
+                await el.click();
+            }
+            return {
+                content: [
+                    {
+                        type: 'text',
+                        text: `Clicked${double ? ' (double)' : ''} element ref=${ref}`,
+                    },
+                ],
+            };
+        }
+        catch (error) {
+            const message = error instanceof Error ? error.message : String(error);
+            return {
+                content: [{ type: 'text', text: message }],
+                isError: true,
+            };
+        }
+    });
+    // -----------------------------------------------------------------------
+    // browser_type
+    // -----------------------------------------------------------------------
+    server.tool('browser_type', 'Type text into an element identified by its ref number.', {
+        ref: zod_1.z.string().describe('Element ref number from browser_snapshot'),
+        text: zod_1.z.string().describe('Text to type into the element'),
+        submit: zod_1.z
+            .boolean()
+            .optional()
+            .describe('If true, press Enter after typing.'),
+        humanlike: zod_1.z
+            .boolean()
+            .optional()
+            .describe('If true, type with randomised human-like delays.'),
+        surfaceId: optionalSurfaceId,
+    }, async ({ ref, text, submit, humanlike, surfaceId }) => {
+        try {
+            const page = await engine.getPage(surfaceId);
+            if (!page) {
+                throw new Error('No browser page available. Call browser_open first.');
+            }
+            const el = await (0, snapshot_1.resolveRef)(page, ref);
+            if (!el) {
+                throw new Error(refNotFound(ref));
+            }
+            if (humanlike) {
+                // Focus the element first, then use human-like typing via keyboard
+                await el.click();
+                await (0, human_typing_1.typeHumanlike)(page, '', text);
+            }
+            else {
+                await el.fill(text);
+            }
+            if (submit) {
+                await page.keyboard.press('Enter');
+            }
+            return {
+                content: [
+                    {
+                        type: 'text',
+                        text: `Typed "${text}" into element ref=${ref}${submit ? ' and submitted' : ''}`,
+                    },
+                ],
+            };
+        }
+        catch (error) {
+            const message = error instanceof Error ? error.message : String(error);
+            return {
+                content: [{ type: 'text', text: message }],
+                isError: true,
+            };
+        }
+    });
+    // -----------------------------------------------------------------------
+    // browser_fill
+    // -----------------------------------------------------------------------
+    server.tool('browser_fill', 'Fill multiple form fields at once. Each field is identified by a ref number.', {
+        fields: zod_1.z
+            .array(zod_1.z.object({
+            ref: zod_1.z.string().describe('Element ref number'),
+            value: zod_1.z.string().describe('Value to fill'),
+        }))
+            .describe('Array of {ref, value} pairs to fill'),
+        surfaceId: optionalSurfaceId,
+    }, async ({ fields, surfaceId }) => {
+        try {
+            const page = await engine.getPage(surfaceId);
+            if (!page) {
+                throw new Error('No browser page available. Call browser_open first.');
+            }
+            let filled = 0;
+            const errors = [];
+            for (const field of fields) {
+                const el = await (0, snapshot_1.resolveRef)(page, field.ref);
+                if (!el) {
+                    errors.push(refNotFound(field.ref));
+                    continue;
+                }
+                await el.fill(field.value);
+                filled++;
+            }
+            let resultText = `Filled ${filled}/${fields.length} field(s).`;
+            if (errors.length > 0) {
+                resultText += '\nErrors:\n' + errors.join('\n');
+            }
+            return {
+                content: [{ type: 'text', text: resultText }],
+                ...(errors.length > 0 && filled === 0 ? { isError: true } : {}),
+            };
+        }
+        catch (error) {
+            const message = error instanceof Error ? error.message : String(error);
+            return {
+                content: [{ type: 'text', text: message }],
+                isError: true,
+            };
+        }
+    });
+    // -----------------------------------------------------------------------
+    // browser_press_key
+    // -----------------------------------------------------------------------
+    server.tool('browser_press_key', 'Press a keyboard key (e.g. Enter, Tab, Escape, ArrowDown, Control+a).', {
+        key: zod_1.z
+            .string()
+            .describe('Key to press. Examples: Enter, Tab, Escape, ArrowDown, Control+a, Meta+c'),
+        surfaceId: optionalSurfaceId,
+    }, async ({ key, surfaceId }) => {
+        try {
+            const page = await engine.getPage(surfaceId);
+            if (!page) {
+                throw new Error('No browser page available. Call browser_open first.');
+            }
+            await page.keyboard.press(key);
+            return {
+                content: [{ type: 'text', text: `Pressed key: ${key}` }],
+            };
+        }
+        catch (error) {
+            const message = error instanceof Error ? error.message : String(error);
+            return {
+                content: [{ type: 'text', text: message }],
+                isError: true,
+            };
+        }
+    });
+    // -----------------------------------------------------------------------
+    // browser_hover
+    // -----------------------------------------------------------------------
+    server.tool('browser_hover', 'Hover over an element identified by its ref number.', {
+        ref: zod_1.z.string().describe('Element ref number from browser_snapshot'),
+        surfaceId: optionalSurfaceId,
+    }, async ({ ref, surfaceId }) => {
+        try {
+            const page = await engine.getPage(surfaceId);
+            if (!page) {
+                throw new Error('No browser page available. Call browser_open first.');
+            }
+            const el = await (0, snapshot_1.resolveRef)(page, ref);
+            if (!el) {
+                throw new Error(refNotFound(ref));
+            }
+            await el.hover();
+            return {
+                content: [
+                    { type: 'text', text: `Hovered over element ref=${ref}` },
+                ],
+            };
+        }
+        catch (error) {
+            const message = error instanceof Error ? error.message : String(error);
+            return {
+                content: [{ type: 'text', text: message }],
+                isError: true,
+            };
+        }
+    });
+    // -----------------------------------------------------------------------
+    // browser_drag
+    // -----------------------------------------------------------------------
+    server.tool('browser_drag', 'Drag an element from sourceRef to targetRef.', {
+        sourceRef: zod_1.z
+            .string()
+            .describe('Ref number of the element to drag from'),
+        targetRef: zod_1.z.string().describe('Ref number of the element to drop onto'),
+        surfaceId: optionalSurfaceId,
+    }, async ({ sourceRef, targetRef, surfaceId }) => {
+        try {
+            const page = await engine.getPage(surfaceId);
+            if (!page) {
+                throw new Error('No browser page available. Call browser_open first.');
+            }
+            const sourceEl = await (0, snapshot_1.resolveRef)(page, sourceRef);
+            if (!sourceEl) {
+                throw new Error(refNotFound(sourceRef));
+            }
+            const targetEl = await (0, snapshot_1.resolveRef)(page, targetRef);
+            if (!targetEl) {
+                throw new Error(refNotFound(targetRef));
+            }
+            // Get bounding boxes for source and target
+            const sourceBox = await sourceEl.boundingBox();
+            const targetBox = await targetEl.boundingBox();
+            if (!sourceBox || !targetBox) {
+                throw new Error('Could not determine bounding box for source or target element.');
+            }
+            // Perform drag from center of source to center of target
+            const sourceX = sourceBox.x + sourceBox.width / 2;
+            const sourceY = sourceBox.y + sourceBox.height / 2;
+            const targetX = targetBox.x + targetBox.width / 2;
+            const targetY = targetBox.y + targetBox.height / 2;
+            await page.mouse.move(sourceX, sourceY);
+            await page.mouse.down();
+            await page.mouse.move(targetX, targetY, { steps: 10 });
+            await page.mouse.up();
+            return {
+                content: [
+                    {
+                        type: 'text',
+                        text: `Dragged element ref=${sourceRef} to ref=${targetRef}`,
+                    },
+                ],
+            };
+        }
+        catch (error) {
+            const message = error instanceof Error ? error.message : String(error);
+            return {
+                content: [{ type: 'text', text: message }],
+                isError: true,
+            };
+        }
+    });
+    // -----------------------------------------------------------------------
+    // browser_select
+    // -----------------------------------------------------------------------
+    server.tool('browser_select', 'Select option(s) in a <select> element by value.', {
+        ref: zod_1.z.string().describe('Element ref number of the <select>'),
+        values: zod_1.z
+            .array(zod_1.z.string())
+            .describe('Array of option values to select'),
+        surfaceId: optionalSurfaceId,
+    }, async ({ ref, values, surfaceId }) => {
+        try {
+            const page = await engine.getPage(surfaceId);
+            if (!page) {
+                throw new Error('No browser page available. Call browser_open first.');
+            }
+            const el = await (0, snapshot_1.resolveRef)(page, ref);
+            if (!el) {
+                throw new Error(refNotFound(ref));
+            }
+            await el.selectOption(values);
+            return {
+                content: [
+                    {
+                        type: 'text',
+                        text: `Selected value(s) [${values.join(', ')}] in element ref=${ref}`,
+                    },
+                ],
+            };
+        }
+        catch (error) {
+            const message = error instanceof Error ? error.message : String(error);
+            return {
+                content: [{ type: 'text', text: message }],
+                isError: true,
+            };
+        }
+    });
+    // -----------------------------------------------------------------------
+    // browser_scroll_into_view
+    // -----------------------------------------------------------------------
+    server.tool('browser_scroll_into_view', 'Scroll an element into the visible viewport.', {
+        ref: zod_1.z.string().describe('Element ref number from browser_snapshot'),
+        surfaceId: optionalSurfaceId,
+    }, async ({ ref, surfaceId }) => {
+        try {
+            const page = await engine.getPage(surfaceId);
+            if (!page) {
+                throw new Error('No browser page available. Call browser_open first.');
+            }
+            const el = await (0, snapshot_1.resolveRef)(page, ref);
+            if (!el) {
+                throw new Error(refNotFound(ref));
+            }
+            await el.scrollIntoViewIfNeeded();
+            return {
+                content: [
+                    {
+                        type: 'text',
+                        text: `Scrolled element ref=${ref} into view`,
+                    },
+                ],
+            };
+        }
+        catch (error) {
+            const message = error instanceof Error ? error.message : String(error);
+            return {
+                content: [{ type: 'text', text: message }],
+                isError: true,
+            };
+        }
+    });
+}

package/dist/mcp/mcp/playwright/tools/navigation.js

@@ -0,0 +1,183 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.registerNavigationTools = registerNavigationTools;
+const zod_1 = require("zod");
+const PlaywrightEngine_1 = require("../PlaywrightEngine");
+// Optional surfaceId schema reused across tools
+const optionalSurfaceId = zod_1.z
+    .string()
+    .optional()
+    .describe('Target a specific surface by ID. Omit to use the active surface.');
+/**
+ * Register navigation-related MCP tools on the given server.
+ *
+ * Tools:
+ *  - browser_navigate      — navigate to a URL
+ *  - browser_navigate_back — go back in history
+ *  - browser_tabs          — list / new / select / close tabs
+ */
+function registerNavigationTools(server) {
+    const engine = PlaywrightEngine_1.PlaywrightEngine.getInstance();
+    // -----------------------------------------------------------------------
+    // browser_navigate
+    // -----------------------------------------------------------------------
+    server.tool('browser_navigate', 'Navigate the browser page to a URL. Returns the final URL after navigation.', {
+        url: zod_1.z.string().describe('The URL to navigate to'),
+        surfaceId: optionalSurfaceId,
+    }, async ({ url, surfaceId }) => {
+        try {
+            const page = await engine.getPage(surfaceId);
+            if (!page) {
+                throw new Error('No browser page available. Call browser_open first.');
+            }
+            await page.goto(url, { waitUntil: 'domcontentloaded' });
+            const finalUrl = page.url();
+            return {
+                content: [{ type: 'text', text: `Navigated to ${finalUrl}` }],
+            };
+        }
+        catch (error) {
+            const message = error instanceof Error ? error.message : String(error);
+            return {
+                content: [{ type: 'text', text: message }],
+                isError: true,
+            };
+        }
+    });
+    // -----------------------------------------------------------------------
+    // browser_navigate_back
+    // -----------------------------------------------------------------------
+    server.tool('browser_navigate_back', 'Go back in browser history. Returns the current URL after going back.', {
+        surfaceId: optionalSurfaceId,
+    }, async ({ surfaceId }) => {
+        try {
+            const page = await engine.getPage(surfaceId);
+            if (!page) {
+                throw new Error('No browser page available. Call browser_open first.');
+            }
+            await page.goBack();
+            const currentUrl = page.url();
+            return {
+                content: [{ type: 'text', text: `Navigated back to ${currentUrl}` }],
+            };
+        }
+        catch (error) {
+            const message = error instanceof Error ? error.message : String(error);
+            return {
+                content: [{ type: 'text', text: message }],
+                isError: true,
+            };
+        }
+    });
+    // -----------------------------------------------------------------------
+    // browser_tabs
+    // -----------------------------------------------------------------------
+    server.tool('browser_tabs', 'Manage browser tabs: list all tabs, open a new tab, select a tab, or close a tab.', {
+        action: zod_1.z
+            .enum(['list', 'new', 'select', 'close'])
+            .optional()
+            .describe('Action to perform. Defaults to "list".'),
+        tabId: zod_1.z
+            .number()
+            .optional()
+            .describe('Tab index (0-based) for "select" or "close" actions.'),
+        url: zod_1.z
+            .string()
+            .optional()
+            .describe('URL to open when action is "new".'),
+    }, async ({ action, tabId, url }) => {
+        try {
+            const browser = await engine.getBrowser();
+            if (!browser) {
+                throw new Error('No browser connected. Call browser_open first.');
+            }
+            const resolvedAction = action ?? 'list';
+            // Collect all pages across all contexts
+            const contexts = browser.contexts();
+            const allPages = contexts.flatMap((ctx) => ctx.pages());
+            switch (resolvedAction) {
+                case 'list': {
+                    const tabList = allPages.map((p, i) => ({
+                        tabId: i,
+                        url: p.url(),
+                        title: '', // title requires async; filled below
+                    }));
+                    // Populate titles
+                    for (let i = 0; i < allPages.length; i++) {
+                        try {
+                            tabList[i].title = await allPages[i].title();
+                        }
+                        catch {
+                            tabList[i].title = '(unknown)';
+                        }
+                    }
+                    return {
+                        content: [
+                            {
+                                type: 'text',
+                                text: JSON.stringify(tabList, null, 2),
+                            },
+                        ],
+                    };
+                }
+                case 'new': {
+                    // Use the first context, or fail
+                    const context = contexts[0];
+                    if (!context) {
+                        throw new Error('No browser context available.');
+                    }
+                    const newPage = await context.newPage();
+                    if (url) {
+                        await newPage.goto(url, { waitUntil: 'domcontentloaded' });
+                    }
+                    return {
+                        content: [
+                            {
+                                type: 'text',
+                                text: `Opened new tab (index ${allPages.length}) at ${newPage.url()}`,
+                            },
+                        ],
+                    };
+                }
+                case 'select': {
+                    if (tabId === undefined || tabId < 0 || tabId >= allPages.length) {
+                        throw new Error(`Invalid tabId=${tabId}. Available tabs: 0-${allPages.length - 1}`);
+                    }
+                    await allPages[tabId].bringToFront();
+                    return {
+                        content: [
+                            {
+                                type: 'text',
+                                text: `Selected tab ${tabId}: ${allPages[tabId].url()}`,
+                            },
+                        ],
+                    };
+                }
+                case 'close': {
+                    if (tabId === undefined || tabId < 0 || tabId >= allPages.length) {
+                        throw new Error(`Invalid tabId=${tabId}. Available tabs: 0-${allPages.length - 1}`);
+                    }
+                    const closedUrl = allPages[tabId].url();
+                    await allPages[tabId].close();
+                    return {
+                        content: [
+                            {
+                                type: 'text',
+                                text: `Closed tab ${tabId}: ${closedUrl}`,
+                            },
+                        ],
+                    };
+                }
+                default:
+                    throw new Error(`Unknown action: ${resolvedAction}`);
+            }
+        }
+        catch (error) {
+            const message = error instanceof Error ? error.message : String(error);
+            return {
+                content: [{ type: 'text', text: message }],
+                isError: true,
+            };
+        }
+    });
+}