@wordbricks/playwright-mcp 0.1.6 → 0.1.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/lib/context.js CHANGED
@@ -21,6 +21,7 @@ import { buildHookRegistry } from './hooks/registry.js';
21
21
  import { setEventStore, createEventStore } from './hooks/events.js';
22
22
  import { setupNetworkTracking } from './hooks/networkSetup.js';
23
23
  import { outputFile } from './config.js';
24
+ import * as codegen from './utils/codegen.js';
24
25
  const testDebug = debug('pw:mcp:test');
25
26
  export class Context {
26
27
  tools;
@@ -184,6 +185,14 @@ export class Context {
184
185
  }
185
186
  return result;
186
187
  }
188
+ lookupSecret(secretName) {
189
+ // if (!this.config.secrets?.[secretName])
190
+ return { value: secretName, code: codegen.quote(secretName) };
191
+ // return {
192
+ // value: this.config.secrets[secretName]!,
193
+ // code: `process.env['${secretName}']`,
194
+ // };
195
+ }
187
196
  }
188
197
  export class InputRecorder {
189
198
  _context;
@@ -15,6 +15,7 @@ export const hookNameSchema = z.enum([
15
15
  export const toolNameSchema = z.enum([
16
16
  'browser_click',
17
17
  'browser_extract_framework_state',
18
+ 'browser_fill_form',
18
19
  'browser_get_snapshot',
19
20
  // 'browser_get_visible_html',
20
21
  'browser_navigate',
@@ -26,6 +27,7 @@ export const toolNameSchema = z.enum([
26
27
  'browser_reload',
27
28
  'browser_repl',
28
29
  'browser_scroll',
30
+ 'browser_type',
29
31
  'browser_wait',
30
32
  ]);
31
33
  export const EventTypeSchema = z.enum([
package/lib/mcp/tool.js CHANGED
@@ -14,16 +14,25 @@
14
14
  * limitations under the License.
15
15
  */
16
16
  import { zodToJsonSchema } from 'zod-to-json-schema';
17
- export function toMcpTool(tool) {
17
+ import { z } from 'zod';
18
+ const typesWithIntent = ['action', 'assertion', 'input'];
19
+ export function toMcpTool(tool, options) {
20
+ const inputSchema = options?.addIntent && typesWithIntent.includes(tool.type) ? tool.inputSchema.extend({
21
+ intent: z.string().describe('The intent of the call, for example the test step description plan idea')
22
+ }) : tool.inputSchema;
23
+ const readOnly = tool.type === 'readOnly' || tool.type === 'assertion';
18
24
  return {
19
25
  name: tool.name,
20
26
  description: tool.description,
21
- inputSchema: zodToJsonSchema(tool.inputSchema, { strictUnions: true }),
27
+ inputSchema: zodToJsonSchema(inputSchema, { strictUnions: true }),
22
28
  annotations: {
23
29
  title: tool.title,
24
- readOnlyHint: tool.type === 'readOnly',
25
- destructiveHint: tool.type === 'destructive',
30
+ readOnlyHint: readOnly,
31
+ destructiveHint: !readOnly,
26
32
  openWorldHint: true,
27
33
  },
28
34
  };
29
35
  }
36
+ export function defineToolSchema(tool) {
37
+ return tool;
38
+ }
package/lib/program.js CHANGED
@@ -20,7 +20,6 @@ import { commaSeparatedList, resolveCLIConfig, semicolonSeparatedList } from './
20
20
  import { packageJSON } from './utils/package.js';
21
21
  import { Context } from './context.js';
22
22
  import { contextFactory } from './browserContextFactory.js';
23
- import { runLoopTools } from './loopTools/main.js';
24
23
  import { ProxyBackend } from './mcp/proxyBackend.js';
25
24
  import { BrowserServerBackend } from './browserServerBackend.js';
26
25
  import { ExtensionContextFactory } from './extension/extensionContextFactory.js';
@@ -71,10 +70,6 @@ program
71
70
  await mcpTransport.start(serverBackendFactory, config.server);
72
71
  return;
73
72
  }
74
- if (options.loopTools) {
75
- await runLoopTools(config);
76
- return;
77
- }
78
73
  const browserContextFactory = contextFactory(config);
79
74
  const providers = [mcpProviderForBrowserContextFactory(config, browserContextFactory)];
80
75
  if (options.connectTool)
package/lib/response.js CHANGED
@@ -62,9 +62,9 @@ export class Response {
62
62
  images() {
63
63
  return this._images;
64
64
  }
65
- setIncludeSnapshot() {
66
- // Disabled: Page state logging not needed
67
- // this._includeSnapshot = true;
65
+ // NOTE Wordbricks Disabled: Page state logging not needed
66
+ setIncludeSnapshot(full) {
67
+ // this._includeSnapshot = full ?? 'incremental';
68
68
  }
69
69
  setIncludeTabs() {
70
70
  this._includeTabs = true;
@@ -15,7 +15,7 @@
15
15
  */
16
16
  import { z } from 'zod';
17
17
  import { defineTabTool } from './tool.js';
18
- const handleDialog = defineTabTool({
18
+ export const handleDialog = defineTabTool({
19
19
  capability: 'core',
20
20
  schema: {
21
21
  name: 'browser_handle_dialog',
@@ -25,7 +25,7 @@ const handleDialog = defineTabTool({
25
25
  accept: z.boolean().describe('Whether to accept the dialog.'),
26
26
  promptText: z.string().optional().describe('The text of the prompt in case of a prompt dialog.'),
27
27
  }),
28
- type: 'destructive',
28
+ type: 'action',
29
29
  },
30
30
  handle: async (tab, params, response) => {
31
31
  response.setIncludeSnapshot();
@@ -29,7 +29,7 @@ const evaluate = defineTabTool({
29
29
  title: 'Evaluate JavaScript',
30
30
  description: 'Evaluate JavaScript expression on page or element',
31
31
  inputSchema: evaluateSchema,
32
- type: 'destructive',
32
+ type: 'action',
33
33
  },
34
34
  handle: async (tab, params, response) => {
35
35
  response.setIncludeSnapshot();
@@ -15,16 +15,16 @@
15
15
  */
16
16
  import { z } from 'zod';
17
17
  import { defineTabTool } from './tool.js';
18
- const uploadFile = defineTabTool({
18
+ export const uploadFile = defineTabTool({
19
19
  capability: 'core',
20
20
  schema: {
21
21
  name: 'browser_file_upload',
22
22
  title: 'Upload files',
23
23
  description: 'Upload one or multiple files',
24
24
  inputSchema: z.object({
25
- paths: z.array(z.string()).describe('The absolute paths to the files to upload. Can be a single file or multiple files.'),
25
+ paths: z.array(z.string()).optional().describe('The absolute paths to the files to upload. Can be single file or multiple files. If omitted, file chooser is cancelled.'),
26
26
  }),
27
- type: 'destructive',
27
+ type: 'action',
28
28
  },
29
29
  handle: async (tab, params, response) => {
30
30
  response.setIncludeSnapshot();
@@ -34,7 +34,8 @@ const uploadFile = defineTabTool({
34
34
  response.addCode(`await fileChooser.setFiles(${JSON.stringify(params.paths)})`);
35
35
  tab.clearModalState(modalState);
36
36
  await tab.waitForCompletion(async () => {
37
- await modalState.fileChooser.setFiles(params.paths);
37
+ if (params.paths)
38
+ await modalState.fileChooser.setFiles(params.paths);
38
39
  });
39
40
  },
40
41
  clearsModalState: 'fileChooser',
@@ -0,0 +1,57 @@
1
+ /**
2
+ * Copyright (c) Microsoft Corporation.
3
+ *
4
+ * Licensed under the Apache License, Version 2.0 (the "License");
5
+ * you may not use this file except in compliance with the License.
6
+ * You may obtain a copy of the License at
7
+ *
8
+ * http://www.apache.org/licenses/LICENSE-2.0
9
+ *
10
+ * Unless required by applicable law or agreed to in writing, software
11
+ * distributed under the License is distributed on an "AS IS" BASIS,
12
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13
+ * See the License for the specific language governing permissions and
14
+ * limitations under the License.
15
+ */
16
+ import { z } from 'zod';
17
+ import { defineTabTool } from './tool.js';
18
+ import * as codegen from '../utils/codegen.js';
19
+ import { generateLocator } from './utils.js';
20
+ const fillForm = defineTabTool({
21
+ capability: 'core',
22
+ schema: {
23
+ name: 'browser_fill_form',
24
+ title: 'Fill form',
25
+ description: 'Fill multiple form fields',
26
+ inputSchema: z.object({
27
+ fields: z.array(z.object({
28
+ name: z.string().describe('Human-readable field name'),
29
+ type: z.enum(['textbox', 'checkbox', 'radio', 'combobox', 'slider']).describe('Type of the field'),
30
+ ref: z.string().describe('Exact target field reference from the page snapshot'),
31
+ value: z.string().describe('Value to fill in the field. If the field is a checkbox, the value should be `true` or `false`. If the field is a combobox, the value should be the text of the option.'),
32
+ })).describe('Fields to fill in'),
33
+ }),
34
+ type: 'input',
35
+ },
36
+ handle: async (tab, params, response) => {
37
+ for (const field of params.fields) {
38
+ const locator = await tab.refLocator({ element: field.name, ref: field.ref });
39
+ if (field.type === 'textbox' || field.type === 'slider') {
40
+ const secret = tab.context.lookupSecret(field.value);
41
+ await locator.fill(secret.value);
42
+ response.addCode(`await page.${await generateLocator(locator)}.fill(${secret.code});`);
43
+ }
44
+ else if (field.type === 'checkbox' || field.type === 'radio') {
45
+ await locator.setChecked(field.value === 'true');
46
+ response.addCode(`await page.${await generateLocator(locator)}.setChecked(${field.value});`);
47
+ }
48
+ else if (field.type === 'combobox') {
49
+ await locator.selectOption({ label: field.value });
50
+ response.addCode(`await page.${await generateLocator(locator)}.selectOption(${codegen.quote(field.value)});`);
51
+ }
52
+ }
53
+ },
54
+ });
55
+ export default [
56
+ fillForm,
57
+ ];
@@ -15,7 +15,6 @@
15
15
  */
16
16
  import { fork } from 'child_process';
17
17
  import path from 'path';
18
- import { fileURLToPath } from 'url';
19
18
  import { z } from 'zod';
20
19
  import { defineTool } from './tool.js';
21
20
  const install = defineTool({
@@ -25,12 +24,11 @@ const install = defineTool({
25
24
  title: 'Install the browser specified in the config',
26
25
  description: 'Install the browser specified in the config. Call this if you get an error about the browser not being installed.',
27
26
  inputSchema: z.object({}),
28
- type: 'destructive',
27
+ type: 'action',
29
28
  },
30
29
  handle: async (context, params, response) => {
31
30
  const channel = context.config.browser?.launchOptions?.channel ?? context.config.browser?.browserName ?? 'chrome';
32
- const cliUrl = import.meta.resolve('playwright/package.json');
33
- const cliPath = path.join(fileURLToPath(cliUrl), '..', 'cli.js');
31
+ const cliPath = path.join(require.resolve('playwright/package.json'), '../cli.js');
34
32
  const child = fork(cliPath, ['install', channel], {
35
33
  stdio: 'pipe',
36
34
  });
@@ -27,7 +27,7 @@ const pressKey = defineTabTool({
27
27
  inputSchema: z.object({
28
28
  key: z.string().describe('Name of the key to press or a character to generate, such as `ArrowLeft` or `a`'),
29
29
  }),
30
- type: 'destructive',
30
+ type: 'input',
31
31
  },
32
32
  handle: async (tab, params, response) => {
33
33
  response.setIncludeSnapshot();
@@ -50,7 +50,7 @@ const type = defineTabTool({
50
50
  title: 'Type text',
51
51
  description: 'Type text into editable element',
52
52
  inputSchema: typeSchema,
53
- type: 'destructive',
53
+ type: 'input',
54
54
  },
55
55
  handle: async (tab, params, response) => {
56
56
  const locator = await tab.refLocator(params);
@@ -48,7 +48,7 @@ const mouseClick = defineTabTool({
48
48
  x: z.number().describe('X coordinate'),
49
49
  y: z.number().describe('Y coordinate'),
50
50
  }),
51
- type: 'destructive',
51
+ type: 'input',
52
52
  },
53
53
  handle: async (tab, params, response) => {
54
54
  response.setIncludeSnapshot();
@@ -75,7 +75,7 @@ const mouseDrag = defineTabTool({
75
75
  endX: z.number().describe('End X coordinate'),
76
76
  endY: z.number().describe('End Y coordinate'),
77
77
  }),
78
- type: 'destructive',
78
+ type: 'input',
79
79
  },
80
80
  handle: async (tab, params, response) => {
81
81
  response.setIncludeSnapshot();
@@ -24,7 +24,7 @@ const navigate = defineTool({
24
24
  inputSchema: z.object({
25
25
  url: z.string().describe('The URL to navigate to'),
26
26
  }),
27
- type: 'destructive',
27
+ type: 'action',
28
28
  },
29
29
  handle: async (context, params, response) => {
30
30
  const tab = await context.ensureTab();
package/lib/tools/repl.js CHANGED
@@ -220,7 +220,7 @@ const repl = defineTabTool({
220
220
  title: 'Browser REPL',
221
221
  description: 'DevTools-like browser REPL. Per-tab state persists across calls (const/let/functions); supports top-level await. Survives SPA nav; resets on full reload or when switching tabs. Helpers available via window.mcp: JSON5, JSONPath, _, GraphQLClient, gql, graphqlRequest. No need for wrapping in IIFE.',
222
222
  inputSchema: replSchema,
223
- type: 'destructive',
223
+ type: 'action',
224
224
  },
225
225
  handle: async (tab, params, response) => {
226
226
  const page = tab.page;
@@ -56,7 +56,7 @@ const scrollWheel = defineTabTool({
56
56
  title: 'Scroll page',
57
57
  description: 'Scroll the page using mouse wheel with human-like behavior',
58
58
  inputSchema: scrollSchema,
59
- type: 'destructive',
59
+ type: 'readOnly',
60
60
  },
61
61
  handle: async (tab, params, response) => {
62
62
  const requestedDeltaY = params.amount || 0;
@@ -28,7 +28,7 @@ const snapshot = defineTool({
28
28
  },
29
29
  handle: async (context, params, response) => {
30
30
  await context.ensureTab();
31
- response.setIncludeSnapshot();
31
+ response.setIncludeSnapshot('full');
32
32
  },
33
33
  });
34
34
  export const elementSchema = z.object({
@@ -38,6 +38,7 @@ export const elementSchema = z.object({
38
38
  const clickSchema = elementSchema.extend({
39
39
  doubleClick: z.boolean().optional().describe('Whether to perform a double click instead of a single click'),
40
40
  button: z.enum(['left', 'right', 'middle']).optional().describe('Button to click, defaults to left'),
41
+ modifiers: z.array(z.enum(['Alt', 'Control', 'ControlOrMeta', 'Meta', 'Shift'])).optional().describe('Modifier keys to press'),
41
42
  });
42
43
  const click = defineTabTool({
43
44
  capability: 'core',
@@ -46,22 +47,26 @@ const click = defineTabTool({
46
47
  title: 'Click',
47
48
  description: 'Perform click on a web page',
48
49
  inputSchema: clickSchema,
49
- type: 'destructive',
50
+ type: 'input',
50
51
  },
51
52
  handle: async (tab, params, response) => {
52
53
  response.setIncludeSnapshot();
53
54
  const locator = await tab.refLocator(params);
54
- const button = params.button;
55
- const buttonAttr = button ? `{ button: '${button}' }` : '';
55
+ const options = {
56
+ button: params.button,
57
+ modifiers: params.modifiers,
58
+ };
59
+ const formatted = javascript.formatObject(options, ' ', 'oneline');
60
+ const optionsAttr = formatted !== '{}' ? formatted : '';
56
61
  if (params.doubleClick)
57
- response.addCode(`await page.${await generateLocator(locator)}.dblclick(${buttonAttr});`);
62
+ response.addCode(`await page.${await generateLocator(locator)}.dblclick(${optionsAttr});`);
58
63
  else
59
- response.addCode(`await page.${await generateLocator(locator)}.click(${buttonAttr});`);
64
+ response.addCode(`await page.${await generateLocator(locator)}.click(${optionsAttr});`);
60
65
  await tab.waitForCompletion(async () => {
61
66
  if (params.doubleClick)
62
- await locator.dblclick({ button });
67
+ await locator.dblclick(options);
63
68
  else
64
- await locator.click({ button });
69
+ await locator.click(options);
65
70
  });
66
71
  },
67
72
  });
@@ -77,7 +82,7 @@ const drag = defineTabTool({
77
82
  endElement: z.string().describe('Human-readable target element description used to obtain the permission to interact with the element'),
78
83
  endRef: z.string().describe('Exact target element reference from the page snapshot'),
79
84
  }),
80
- type: 'destructive',
85
+ type: 'input',
81
86
  },
82
87
  handle: async (tab, params, response) => {
83
88
  response.setIncludeSnapshot();
@@ -119,7 +124,7 @@ const selectOption = defineTabTool({
119
124
  title: 'Select option',
120
125
  description: 'Select an option in a dropdown',
121
126
  inputSchema: selectOptionSchema,
122
- type: 'destructive',
127
+ type: 'input',
123
128
  },
124
129
  handle: async (tab, params, response) => {
125
130
  response.setIncludeSnapshot();
package/lib/tools/tabs.js CHANGED
@@ -15,73 +15,45 @@
15
15
  */
16
16
  import { z } from 'zod';
17
17
  import { defineTool } from './tool.js';
18
- const listTabs = defineTool({
18
+ const browserTabs = defineTool({
19
19
  capability: 'core-tabs',
20
20
  schema: {
21
- name: 'browser_tab_list',
22
- title: 'List tabs',
23
- description: 'List browser tabs',
24
- inputSchema: z.object({}),
25
- type: 'readOnly',
26
- },
27
- handle: async (context, params, response) => {
28
- await context.ensureTab();
29
- response.setIncludeTabs();
30
- },
31
- });
32
- const selectTab = defineTool({
33
- capability: 'core-tabs',
34
- schema: {
35
- name: 'browser_tab_select',
36
- title: 'Select a tab',
37
- description: 'Select a tab by index',
38
- inputSchema: z.object({
39
- index: z.number().describe('The index of the tab to select'),
40
- }),
41
- type: 'readOnly',
42
- },
43
- handle: async (context, params, response) => {
44
- await context.selectTab(params.index);
45
- response.setIncludeSnapshot();
46
- },
47
- });
48
- const newTab = defineTool({
49
- capability: 'core-tabs',
50
- schema: {
51
- name: 'browser_tab_new',
52
- title: 'Open a new tab',
53
- description: 'Open a new tab',
54
- inputSchema: z.object({
55
- url: z.string().optional().describe('The URL to navigate to in the new tab. If not provided, the new tab will be blank.'),
56
- }),
57
- type: 'readOnly',
58
- },
59
- handle: async (context, params, response) => {
60
- const tab = await context.newTab();
61
- if (params.url)
62
- await tab.navigate(params.url);
63
- response.setIncludeSnapshot();
64
- },
65
- });
66
- const closeTab = defineTool({
67
- capability: 'core-tabs',
68
- schema: {
69
- name: 'browser_tab_close',
70
- title: 'Close a tab',
71
- description: 'Close a tab',
21
+ name: 'browser_tabs',
22
+ title: 'Manage tabs',
23
+ description: 'List, create, close, or select a browser tab.',
72
24
  inputSchema: z.object({
73
- index: z.number().optional().describe('The index of the tab to close. Closes current tab if not provided.'),
25
+ action: z.enum(['list', 'new', 'close', 'select']).describe('Operation to perform'),
26
+ index: z.number().optional().describe('Tab index, used for close/select. If omitted for close, current tab is closed.'),
74
27
  }),
75
- type: 'destructive',
28
+ type: 'action',
76
29
  },
77
30
  handle: async (context, params, response) => {
78
- await context.closeTab(params.index);
79
- response.setIncludeSnapshot();
31
+ switch (params.action) {
32
+ case 'list': {
33
+ await context.ensureTab();
34
+ response.setIncludeTabs();
35
+ return;
36
+ }
37
+ case 'new': {
38
+ await context.newTab();
39
+ response.setIncludeTabs();
40
+ return;
41
+ }
42
+ case 'close': {
43
+ await context.closeTab(params.index);
44
+ response.setIncludeSnapshot('full');
45
+ return;
46
+ }
47
+ case 'select': {
48
+ if (params.index === undefined)
49
+ throw new Error('Tab index is required');
50
+ await context.selectTab(params.index);
51
+ response.setIncludeSnapshot('full');
52
+ return;
53
+ }
54
+ }
80
55
  },
81
56
  });
82
57
  export default [
83
- listTabs,
84
- newTab,
85
- selectTab,
86
- closeTab,
58
+ browserTabs,
87
59
  ];
package/lib/tools/tool.js CHANGED
@@ -20,7 +20,7 @@ export function defineTabTool(tool) {
20
20
  return {
21
21
  ...tool,
22
22
  handle: async (context, params, response) => {
23
- const tab = context.currentTabOrDie();
23
+ const tab = await context.ensureTab();
24
24
  const modalStates = tab.modalStates().map(state => state.type);
25
25
  if (tool.clearsModalState && !modalStates.includes(tool.clearsModalState))
26
26
  response.addError(`Error: The tool "${tool.schema.name}" can only be used when there is related modal state present.\n` + tab.modalStatesMarkdown().join('\n'));
@@ -31,7 +31,7 @@ export function escapeWithQuotes(text, char = '\'') {
31
31
  export function quote(text) {
32
32
  return escapeWithQuotes(text, '\'');
33
33
  }
34
- export function formatObject(value, indent = ' ') {
34
+ export function formatObject(value, indent = ' ', mode = 'multiline') {
35
35
  if (typeof value === 'string')
36
36
  return quote(value);
37
37
  if (Array.isArray(value))
@@ -43,7 +43,9 @@ export function formatObject(value, indent = ' ') {
43
43
  const tokens = [];
44
44
  for (const key of keys)
45
45
  tokens.push(`${key}: ${formatObject(value[key])}`);
46
- return `{\n${indent}${tokens.join(`,\n${indent}`)}\n}`;
46
+ if (mode === 'multiline')
47
+ return `{\n${tokens.join(`,\n${indent}`)}\n}`;
48
+ return `{ ${tokens.join(', ')} }`;
47
49
  }
48
50
  return String(value);
49
51
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wordbricks/playwright-mcp",
3
- "version": "0.1.6",
3
+ "version": "0.1.7",
4
4
  "description": "Playwright Tools for MCP",
5
5
  "type": "module",
6
6
  "repository": {
@@ -60,8 +60,8 @@
60
60
  "lodash": "^4.17.21",
61
61
  "mime": "^4.0.7",
62
62
  "ms": "^2.1.3",
63
- "playwright": "1.55.0-alpha-2025-08-12",
64
- "playwright-core": "1.55.0-alpha-2025-08-12",
63
+ "playwright": "npm:rebrowser-playwright@1.56.1",
64
+ "playwright-core": "npm:rebrowser-playwright@1.56.1",
65
65
  "raw-body": "^3.0.0",
66
66
  "typescript-parsec": "0.3.4",
67
67
  "ws": "^8.18.1",
@@ -72,7 +72,7 @@
72
72
  "@anthropic-ai/sdk": "^0.57.0",
73
73
  "@eslint/eslintrc": "^3.2.0",
74
74
  "@eslint/js": "^9.19.0",
75
- "@playwright/test": "1.55.0-alpha-2025-08-12",
75
+ "@playwright/test": "1.56.1",
76
76
  "@stylistic/eslint-plugin": "^3.0.1",
77
77
  "@tomjs/unzip-crx": "1.1.3",
78
78
  "@types/chrome": "^0.0.315",
@@ -1,66 +0,0 @@
1
- /**
2
- * Copyright (c) Microsoft Corporation.
3
- *
4
- * Licensed under the Apache License, Version 2.0 (the "License");
5
- * you may not use this file except in compliance with the License.
6
- * You may obtain a copy of the License at
7
- *
8
- * http://www.apache.org/licenses/LICENSE-2.0
9
- *
10
- * Unless required by applicable law or agreed to in writing, software
11
- * distributed under the License is distributed on an "AS IS" BASIS,
12
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13
- * See the License for the specific language governing permissions and
14
- * limitations under the License.
15
- */
16
- import { Client } from '@modelcontextprotocol/sdk/client/index.js';
17
- import { contextFactory } from '../browserContextFactory.js';
18
- import { BrowserServerBackend } from '../browserServerBackend.js';
19
- import { Context as BrowserContext } from '../context.js';
20
- import { runTask } from '../loop/loop.js';
21
- import { OpenAIDelegate } from '../loop/loopOpenAI.js';
22
- import { ClaudeDelegate } from '../loop/loopClaude.js';
23
- import { InProcessTransport } from '../mcp/inProcessTransport.js';
24
- import * as mcpServer from '../mcp/server.js';
25
- export class Context {
26
- config;
27
- _client;
28
- _delegate;
29
- constructor(config, client) {
30
- this.config = config;
31
- this._client = client;
32
- if (process.env.OPENAI_API_KEY)
33
- this._delegate = new OpenAIDelegate();
34
- else if (process.env.ANTHROPIC_API_KEY)
35
- this._delegate = new ClaudeDelegate();
36
- else
37
- throw new Error('No LLM API key found. Please set OPENAI_API_KEY or ANTHROPIC_API_KEY environment variable.');
38
- }
39
- static async create(config) {
40
- const client = new Client({ name: 'Playwright Proxy', version: '1.0.0' });
41
- const browserContextFactory = contextFactory(config);
42
- const server = mcpServer.createServer(new BrowserServerBackend(config, browserContextFactory), false);
43
- await client.connect(new InProcessTransport(server));
44
- await client.ping();
45
- return new Context(config, client);
46
- }
47
- async runTask(task, oneShot = false) {
48
- const messages = await runTask(this._delegate, this._client, task, oneShot);
49
- const lines = [];
50
- // Skip the first message, which is the user's task.
51
- for (const message of messages.slice(1)) {
52
- // Trim out all page snapshots.
53
- if (!message.content.trim())
54
- continue;
55
- const index = oneShot ? -1 : message.content.indexOf('### Page state');
56
- const trimmedContent = index === -1 ? message.content : message.content.substring(0, index);
57
- lines.push(`[${message.role}]:`, trimmedContent);
58
- }
59
- return {
60
- content: [{ type: 'text', text: lines.join('\n') }],
61
- };
62
- }
63
- async close() {
64
- await BrowserContext.disposeAll();
65
- }
66
- }
@@ -1,51 +0,0 @@
1
- /**
2
- * Copyright (c) Microsoft Corporation.
3
- *
4
- * Licensed under the Apache License, Version 2.0 (the "License");
5
- * you may not use this file except in compliance with the License.
6
- * You may obtain a copy of the License at
7
- *
8
- * http://www.apache.org/licenses/LICENSE-2.0
9
- *
10
- * Unless required by applicable law or agreed to in writing, software
11
- * distributed under the License is distributed on an "AS IS" BASIS,
12
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13
- * See the License for the specific language governing permissions and
14
- * limitations under the License.
15
- */
16
- import dotenv from 'dotenv';
17
- import * as mcpTransport from '../mcp/transport.js';
18
- import { packageJSON } from '../utils/package.js';
19
- import { Context } from './context.js';
20
- import { perform } from './perform.js';
21
- import { snapshot } from './snapshot.js';
22
- import { toMcpTool } from '../mcp/tool.js';
23
- export async function runLoopTools(config) {
24
- dotenv.config();
25
- const serverBackendFactory = () => new LoopToolsServerBackend(config);
26
- await mcpTransport.start(serverBackendFactory, config.server);
27
- }
28
- class LoopToolsServerBackend {
29
- name = 'Playwright';
30
- version = packageJSON.version;
31
- _config;
32
- _context;
33
- _tools = [perform, snapshot];
34
- constructor(config) {
35
- this._config = config;
36
- }
37
- async initialize() {
38
- this._context = await Context.create(this._config);
39
- }
40
- async listTools() {
41
- return this._tools.map(tool => toMcpTool(tool.schema));
42
- }
43
- async callTool(name, args) {
44
- const tool = this._tools.find(tool => tool.schema.name === name);
45
- const parsedArguments = tool.schema.inputSchema.parse(args || {});
46
- return await tool.handle(this._context, parsedArguments);
47
- }
48
- serverClosed() {
49
- void this._context.close();
50
- }
51
- }
@@ -1,32 +0,0 @@
1
- /**
2
- * Copyright (c) Microsoft Corporation.
3
- *
4
- * Licensed under the Apache License, Version 2.0 (the "License");
5
- * you may not use this file except in compliance with the License.
6
- * You may obtain a copy of the License at
7
- *
8
- * http://www.apache.org/licenses/LICENSE-2.0
9
- *
10
- * Unless required by applicable law or agreed to in writing, software
11
- * distributed under the License is distributed on an "AS IS" BASIS,
12
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13
- * See the License for the specific language governing permissions and
14
- * limitations under the License.
15
- */
16
- import { z } from 'zod';
17
- import { defineTool } from './tool.js';
18
- const performSchema = z.object({
19
- task: z.string().describe('The task to perform with the browser'),
20
- });
21
- export const perform = defineTool({
22
- schema: {
23
- name: 'browser_perform',
24
- title: 'Perform a task with the browser',
25
- description: 'Perform a task with the browser. It can click, type, export, capture screenshot, drag, hover, select options, etc.',
26
- inputSchema: performSchema,
27
- type: 'destructive',
28
- },
29
- handle: async (context, params) => {
30
- return await context.runTask(params.task);
31
- },
32
- });
@@ -1,29 +0,0 @@
1
- /**
2
- * Copyright (c) Microsoft Corporation.
3
- *
4
- * Licensed under the Apache License, Version 2.0 (the "License");
5
- * you may not use this file except in compliance with the License.
6
- * You may obtain a copy of the License at
7
- *
8
- * http://www.apache.org/licenses/LICENSE-2.0
9
- *
10
- * Unless required by applicable law or agreed to in writing, software
11
- * distributed under the License is distributed on an "AS IS" BASIS,
12
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13
- * See the License for the specific language governing permissions and
14
- * limitations under the License.
15
- */
16
- import { z } from 'zod';
17
- import { defineTool } from './tool.js';
18
- export const snapshot = defineTool({
19
- schema: {
20
- name: 'browser_snapshot',
21
- title: 'Take a snapshot of the browser',
22
- description: 'Take a snapshot of the browser to read what is on the page.',
23
- inputSchema: z.object({}),
24
- type: 'readOnly',
25
- },
26
- handle: async (context, params) => {
27
- return await context.runTask('Capture browser snapshot', true);
28
- },
29
- });
@@ -1,18 +0,0 @@
1
- /**
2
- * Copyright (c) Microsoft Corporation.
3
- *
4
- * Licensed under the Apache License, Version 2.0 (the "License");
5
- * you may not use this file except in compliance with the License.
6
- * You may obtain a copy of the License at
7
- *
8
- * http://www.apache.org/licenses/LICENSE-2.0
9
- *
10
- * Unless required by applicable law or agreed to in writing, software
11
- * distributed under the License is distributed on an "AS IS" BASIS,
12
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13
- * See the License for the specific language governing permissions and
14
- * limitations under the License.
15
- */
16
- export function defineTool(tool) {
17
- return tool;
18
- }