@playwright/mcp 0.0.29 → 0.0.31

package/lib/tools/files.js

@@ -15,8 +15,8 @@
  */
 import { z } from 'zod';
 import { defineTool } from './tool.js';
-const uploadFile = captureSnapshot => defineTool({
-    capability: 'files',
+const uploadFile = defineTool({
+    capability: 'core',
     schema: {
         name: 'browser_file_upload',
         title: 'Upload files',
@@ -40,12 +40,12 @@ const uploadFile = captureSnapshot => defineTool({
         return {
             code,
             action,
-            captureSnapshot,
+            captureSnapshot: true,
             waitForNetwork: true,
         };
     },
     clearsModalState: 'fileChooser',
 });
-export default (captureSnapshot) => [
-    uploadFile(captureSnapshot),
+export default [
+    uploadFile,
 ];

package/lib/tools/install.js

@@ -19,7 +19,7 @@ import { z } from 'zod';
 import { defineTool } from './tool.js';
 import { fileURLToPath } from 'node:url';
 const install = defineTool({
-    capability: 'install',
+    capability: 'core-install',
     schema: {
         name: 'browser_install',
         title: 'Install the browser specified in the config',

package/lib/tools/keyboard.js

@@ -15,7 +15,10 @@
  */
 import { z } from 'zod';
 import { defineTool } from './tool.js';
-const pressKey = captureSnapshot => defineTool({
+import { elementSchema } from './snapshot.js';
+import { generateLocator } from './utils.js';
+import * as javascript from '../javascript.js';
+const pressKey = defineTool({
     capability: 'core',
     schema: {
         name: 'browser_press_key',
@@ -36,11 +39,54 @@ const pressKey = captureSnapshot => defineTool({
         return {
             code,
             action,
-            captureSnapshot,
+            captureSnapshot: true,
             waitForNetwork: true
         };
     },
 });
-export default (captureSnapshot) => [
-    pressKey(captureSnapshot),
+const typeSchema = elementSchema.extend({
+    text: z.string().describe('Text to type into the element'),
+    submit: z.boolean().optional().describe('Whether to submit entered text (press Enter after)'),
+    slowly: z.boolean().optional().describe('Whether to type one character at a time. Useful for triggering key handlers in the page. By default entire text is filled in at once.'),
+});
+const type = defineTool({
+    capability: 'core',
+    schema: {
+        name: 'browser_type',
+        title: 'Type text',
+        description: 'Type text into editable element',
+        inputSchema: typeSchema,
+        type: 'destructive',
+    },
+    handle: async (context, params) => {
+        const snapshot = context.currentTabOrDie().snapshotOrDie();
+        const locator = snapshot.refLocator(params);
+        const code = [];
+        const steps = [];
+        if (params.slowly) {
+            code.push(`// Press "${params.text}" sequentially into "${params.element}"`);
+            code.push(`await page.${await generateLocator(locator)}.pressSequentially(${javascript.quote(params.text)});`);
+            steps.push(() => locator.pressSequentially(params.text));
+        }
+        else {
+            code.push(`// Fill "${params.text}" into "${params.element}"`);
+            code.push(`await page.${await generateLocator(locator)}.fill(${javascript.quote(params.text)});`);
+            steps.push(() => locator.fill(params.text));
+        }
+        if (params.submit) {
+            code.push(`// Submit text`);
+            code.push(`await page.${await generateLocator(locator)}.press('Enter');`);
+            steps.push(() => locator.press('Enter'));
+        }
+        return {
+            code,
+            action: () => steps.reduce((acc, step) => acc.then(step), Promise.resolve()),
+            captureSnapshot: true,
+            waitForNetwork: true,
+        };
+    },
+});
+export default [
+    pressKey,
+    type,
 ];

package/lib/tools/{vision.js → mouse.js}

@@ -15,43 +15,13 @@
  */
 import { z } from 'zod';
 import { defineTool } from './tool.js';
-import * as javascript from '../javascript.js';
 const elementSchema = z.object({
     element: z.string().describe('Human-readable element description used to obtain permission to interact with the element'),
 });
-const screenshot = defineTool({
-    capability: 'core',
+const mouseMove = defineTool({
+    capability: 'vision',
     schema: {
-        name: 'browser_screen_capture',
-        title: 'Take a screenshot',
-        description: 'Take a screenshot of the current page',
-        inputSchema: z.object({}),
-        type: 'readOnly',
-    },
-    handle: async (context) => {
-        const tab = await context.ensureTab();
-        const options = { type: 'jpeg', quality: 50, scale: 'css' };
-        const code = [
-            `// Take a screenshot of the current page`,
-            `await page.screenshot(${javascript.formatObject(options)});`,
-        ];
-        const action = () => tab.page.screenshot(options).then(buffer => {
-            return {
-                content: [{ type: 'image', data: buffer.toString('base64'), mimeType: 'image/jpeg' }],
-            };
-        });
-        return {
-            code,
-            action,
-            captureSnapshot: false,
-            waitForNetwork: false
-        };
-    },
-});
-const moveMouse = defineTool({
-    capability: 'core',
-    schema: {
-        name: 'browser_screen_move_mouse',
+        name: 'browser_mouse_move_xy',
         title: 'Move mouse',
         description: 'Move mouse to a given position',
         inputSchema: elementSchema.extend({
@@ -75,12 +45,12 @@ const moveMouse = defineTool({
         };
     },
 });
-const click = defineTool({
-    capability: 'core',
+const mouseClick = defineTool({
+    capability: 'vision',
     schema: {
-        name: 'browser_screen_click',
+        name: 'browser_mouse_click_xy',
         title: 'Click',
-        description: 'Click left mouse button',
+        description: 'Click left mouse button at a given position',
         inputSchema: elementSchema.extend({
             x: z.number().describe('X coordinate'),
             y: z.number().describe('Y coordinate'),
@@ -108,12 +78,12 @@ const click = defineTool({
         };
     },
 });
-const drag = defineTool({
-    capability: 'core',
+const mouseDrag = defineTool({
+    capability: 'vision',
     schema: {
-        name: 'browser_screen_drag',
+        name: 'browser_mouse_drag_xy',
         title: 'Drag mouse',
-        description: 'Drag left mouse button',
+        description: 'Drag left mouse button to a given position',
         inputSchema: elementSchema.extend({
             startX: z.number().describe('Start X coordinate'),
             startY: z.number().describe('Start Y coordinate'),
@@ -145,45 +115,8 @@ const drag = defineTool({
         };
     },
 });
-const type = defineTool({
-    capability: 'core',
-    schema: {
-        name: 'browser_screen_type',
-        title: 'Type text',
-        description: 'Type text',
-        inputSchema: z.object({
-            text: z.string().describe('Text to type into the element'),
-            submit: z.boolean().optional().describe('Whether to submit entered text (press Enter after)'),
-        }),
-        type: 'destructive',
-    },
-    handle: async (context, params) => {
-        const tab = context.currentTabOrDie();
-        const code = [
-            `// Type ${params.text}`,
-            `await page.keyboard.type('${params.text}');`,
-        ];
-        const action = async () => {
-            await tab.page.keyboard.type(params.text);
-            if (params.submit)
-                await tab.page.keyboard.press('Enter');
-        };
-        if (params.submit) {
-            code.push(`// Submit text`);
-            code.push(`await page.keyboard.press('Enter');`);
-        }
-        return {
-            code,
-            action,
-            captureSnapshot: false,
-            waitForNetwork: true,
-        };
-    },
-});
 export default [
-    screenshot,
-    moveMouse,
-    click,
-    drag,
-    type,
+    mouseMove,
+    mouseClick,
+    mouseDrag,
 ];

package/lib/tools/navigate.js

@@ -15,7 +15,7 @@
  */
 import { z } from 'zod';
 import { defineTool } from './tool.js';
-const navigate = captureSnapshot => defineTool({
+const navigate = defineTool({
     capability: 'core',
     schema: {
         name: 'browser_navigate',
@@ -35,13 +35,13 @@ const navigate = captureSnapshot => defineTool({
         ];
         return {
             code,
-            captureSnapshot,
+            captureSnapshot: true,
             waitForNetwork: false,
         };
     },
 });
-const goBack = captureSnapshot => defineTool({
-    capability: 'history',
+const goBack = defineTool({
+    capability: 'core',
     schema: {
         name: 'browser_navigate_back',
         title: 'Go back',
@@ -58,13 +58,13 @@ const goBack = captureSnapshot => defineTool({
         ];
         return {
             code,
-            captureSnapshot,
+            captureSnapshot: true,
             waitForNetwork: false,
         };
     },
 });
-const goForward = captureSnapshot => defineTool({
-    capability: 'history',
+const goForward = defineTool({
+    capability: 'core',
     schema: {
         name: 'browser_navigate_forward',
         title: 'Go forward',
@@ -81,13 +81,13 @@ const goForward = captureSnapshot => defineTool({
         ];
         return {
             code,
-            captureSnapshot,
+            captureSnapshot: true,
             waitForNetwork: false,
         };
     },
 });
-export default (captureSnapshot) => [
-    navigate(captureSnapshot),
-    goBack(captureSnapshot),
-    goForward(captureSnapshot),
+export default [
+    navigate,
+    goBack,
+    goForward,
 ];

package/lib/tools/screenshot.js

@@ -67,7 +67,7 @@ const screenshot = defineTool({
         return {
             code,
             action,
-            captureSnapshot: true,
+            captureSnapshot: false,
             waitForNetwork: false,
         };
     }

package/lib/tools/snapshot.js

@@ -35,29 +35,40 @@ const snapshot = defineTool({
         };
     },
 });
-const elementSchema = z.object({
+export const elementSchema = z.object({
     element: z.string().describe('Human-readable element description used to obtain permission to interact with the element'),
     ref: z.string().describe('Exact target element reference from the page snapshot'),
 });
+const clickSchema = elementSchema.extend({
+    doubleClick: z.boolean().optional().describe('Whether to perform a double click instead of a single click'),
+    button: z.enum(['left', 'right', 'middle']).optional().describe('Button to click, defaults to left'),
+});
 const click = defineTool({
     capability: 'core',
     schema: {
         name: 'browser_click',
         title: 'Click',
         description: 'Perform click on a web page',
-        inputSchema: elementSchema,
+        inputSchema: clickSchema,
         type: 'destructive',
     },
     handle: async (context, params) => {
         const tab = context.currentTabOrDie();
         const locator = tab.snapshotOrDie().refLocator(params);
-        const code = [
-            `// Click ${params.element}`,
-            `await page.${await generateLocator(locator)}.click();`
-        ];
+        const button = params.button;
+        const buttonAttr = button ? `{ button: '${button}' }` : '';
+        const code = [];
+        if (params.doubleClick) {
+            code.push(`// Double click ${params.element}`);
+            code.push(`await page.${await generateLocator(locator)}.dblclick(${buttonAttr});`);
+        }
+        else {
+            code.push(`// Click ${params.element}`);
+            code.push(`await page.${await generateLocator(locator)}.click(${buttonAttr});`);
+        }
         return {
             code,
-            action: () => locator.click(),
+            action: () => params.doubleClick ? locator.dblclick({ button }) : locator.click({ button }),
             captureSnapshot: true,
             waitForNetwork: true,
         };
@@ -117,48 +128,6 @@ const hover = defineTool({
         };
     },
 });
-const typeSchema = elementSchema.extend({
-    text: z.string().describe('Text to type into the element'),
-    submit: z.boolean().optional().describe('Whether to submit entered text (press Enter after)'),
-    slowly: z.boolean().optional().describe('Whether to type one character at a time. Useful for triggering key handlers in the page. By default entire text is filled in at once.'),
-});
-const type = defineTool({
-    capability: 'core',
-    schema: {
-        name: 'browser_type',
-        title: 'Type text',
-        description: 'Type text into editable element',
-        inputSchema: typeSchema,
-        type: 'destructive',
-    },
-    handle: async (context, params) => {
-        const snapshot = context.currentTabOrDie().snapshotOrDie();
-        const locator = snapshot.refLocator(params);
-        const code = [];
-        const steps = [];
-        if (params.slowly) {
-            code.push(`// Press "${params.text}" sequentially into "${params.element}"`);
-            code.push(`await page.${await generateLocator(locator)}.pressSequentially(${javascript.quote(params.text)});`);
-            steps.push(() => locator.pressSequentially(params.text));
-        }
-        else {
-            code.push(`// Fill "${params.text}" into "${params.element}"`);
-            code.push(`await page.${await generateLocator(locator)}.fill(${javascript.quote(params.text)});`);
-            steps.push(() => locator.fill(params.text));
-        }
-        if (params.submit) {
-            code.push(`// Submit text`);
-            code.push(`await page.${await generateLocator(locator)}.press('Enter');`);
-            steps.push(() => locator.press('Enter'));
-        }
-        return {
-            code,
-            action: () => steps.reduce((acc, step) => acc.then(step), Promise.resolve()),
-            captureSnapshot: true,
-            waitForNetwork: true,
-        };
-    },
-});
 const selectOptionSchema = elementSchema.extend({
     values: z.array(z.string()).describe('Array of values to select in the dropdown. This can be a single value or multiple values.'),
 });
@@ -191,6 +160,5 @@ export default [
     click,
     drag,
     hover,
-    type,
     selectOption,
 ];

package/lib/tools/tabs.js

@@ -16,7 +16,7 @@
 import { z } from 'zod';
 import { defineTool } from './tool.js';
 const listTabs = defineTool({
-    capability: 'tabs',
+    capability: 'core-tabs',
     schema: {
         name: 'browser_tab_list',
         title: 'List tabs',
@@ -39,8 +39,8 @@ const listTabs = defineTool({
         };
     },
 });
-const selectTab = captureSnapshot => defineTool({
-    capability: 'tabs',
+const selectTab = defineTool({
+    capability: 'core-tabs',
     schema: {
         name: 'browser_tab_select',
         title: 'Select a tab',
@@ -57,13 +57,13 @@ const selectTab = captureSnapshot => defineTool({
         ];
         return {
             code,
-            captureSnapshot,
+            captureSnapshot: true,
             waitForNetwork: false
         };
     },
 });
-const newTab = captureSnapshot => defineTool({
-    capability: 'tabs',
+const newTab = defineTool({
+    capability: 'core-tabs',
     schema: {
         name: 'browser_tab_new',
         title: 'Open a new tab',
@@ -82,13 +82,13 @@ const newTab = captureSnapshot => defineTool({
         ];
         return {
             code,
-            captureSnapshot,
+            captureSnapshot: true,
             waitForNetwork: false
         };
     },
 });
-const closeTab = captureSnapshot => defineTool({
-    capability: 'tabs',
+const closeTab = defineTool({
+    capability: 'core-tabs',
     schema: {
         name: 'browser_tab_close',
         title: 'Close a tab',
@@ -105,14 +105,14 @@ const closeTab = captureSnapshot => defineTool({
         ];
         return {
             code,
-            captureSnapshot,
+            captureSnapshot: true,
             waitForNetwork: false
         };
     },
 });
-export default (captureSnapshot) => [
+export default [
     listTabs,
-    newTab(captureSnapshot),
-    selectTab(captureSnapshot),
-    closeTab(captureSnapshot),
+    newTab,
+    selectTab,
+    closeTab,
 ];

package/lib/tools/utils.js

@@ -13,6 +13,8 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+// @ts-ignore
+import { asLocator } from 'playwright-core/lib/utils';
 export async function waitForCompletion(context, tab, callback) {
     const requests = new Set();
     let frameNavigated = false;
@@ -66,7 +68,13 @@ export function sanitizeForFilePath(s) {
     return sanitize(s.substring(0, separator)) + '.' + sanitize(s.substring(separator + 1));
 }
 export async function generateLocator(locator) {
-    return locator._generateLocatorString();
+    try {
+        const { resolvedSelector } = await locator._resolveSelector();
+        return asLocator('javascript', resolvedSelector);
+    }
+    catch (e) {
+        throw new Error('Ref not found, likely because element was removed. Use browser_snapshot to see what elements are currently on the page.');
+    }
 }
 export async function callOnPageNoTrace(page, callback) {
     return await page._wrapApiCall(() => callback(page), { internal: true });

package/lib/tools/wait.js

@@ -15,8 +15,8 @@
  */
 import { z } from 'zod';
 import { defineTool } from './tool.js';
-const wait = captureSnapshot => defineTool({
-    capability: 'wait',
+const wait = defineTool({
+    capability: 'core',
     schema: {
         name: 'browser_wait_for',
         title: 'Wait for',
@@ -34,7 +34,7 @@ const wait = captureSnapshot => defineTool({
         const code = [];
         if (params.time) {
             code.push(`await new Promise(f => setTimeout(f, ${params.time} * 1000));`);
-            await new Promise(f => setTimeout(f, Math.min(10000, params.time * 1000)));
+            await new Promise(f => setTimeout(f, Math.min(30000, params.time * 1000)));
         }
         const tab = context.currentTabOrDie();
         const locator = params.text ? tab.page.getByText(params.text).first() : undefined;
@@ -49,11 +49,11 @@ const wait = captureSnapshot => defineTool({
         }
         return {
             code,
-            captureSnapshot,
+            captureSnapshot: true,
             waitForNetwork: false,
         };
     },
 });
-export default (captureSnapshot) => [
-    wait(captureSnapshot),
+export default [
+    wait,
 ];

package/lib/tools.js

@@ -16,6 +16,7 @@
 import common from './tools/common.js';
 import console from './tools/console.js';
 import dialogs from './tools/dialogs.js';
+import evaluate from './tools/evaluate.js';
 import files from './tools/files.js';
 import install from './tools/install.js';
 import keyboard from './tools/keyboard.js';
@@ -25,37 +26,22 @@ import pdf from './tools/pdf.js';
 import snapshot from './tools/snapshot.js';
 import tabs from './tools/tabs.js';
 import screenshot from './tools/screenshot.js';
-import testing from './tools/testing.js';
-import vision from './tools/vision.js';
 import wait from './tools/wait.js';
-export const snapshotTools = [
-    ...common(true),
+import mouse from './tools/mouse.js';
+export const allTools = [
+    ...common,
     ...console,
-    ...dialogs(true),
-    ...files(true),
+    ...dialogs,
+    ...evaluate,
+    ...files,
     ...install,
-    ...keyboard(true),
-    ...navigate(true),
+    ...keyboard,
+    ...navigate,
     ...network,
+    ...mouse,
     ...pdf,
     ...screenshot,
     ...snapshot,
-    ...tabs(true),
-    ...testing,
-    ...wait(true),
-];
-export const visionTools = [
-    ...common(false),
-    ...console,
-    ...dialogs(false),
-    ...files(false),
-    ...install,
-    ...keyboard(false),
-    ...navigate(false),
-    ...network,
-    ...pdf,
-    ...tabs(false),
-    ...testing,
-    ...vision,
-    ...wait(false),
+    ...tabs,
+    ...wait,
 ];