Skip to main content
Glama

browser_select_option

Automate selecting options in dropdowns on web pages using structured accessibility snapshots with Playwright, enabling precise interaction without visual models or screenshots.

Instructions

Select an option in a dropdown

Input Schema

TableJSON Schema
NameRequiredDescriptionDefault
elementYesHuman-readable element description used to obtain permission to interact with the element
refYesExact target element reference from the page snapshot
valuesYesArray of values to select in the dropdown. This can be a single value or multiple values.

Implementation Reference

  • The handler function that executes the 'browser_select_option' tool logic. It retrieves the page snapshot, resolves the element locator, generates corresponding Playwright code snippet, and defines an action to select the specified options in the dropdown.
    handle: async (context, params) => { const snapshot = context.currentTabOrDie().snapshotOrDie(); const locator = snapshot.refLocator(params); const code = [ `// Select options [${params.values.join(', ')}] in ${params.element}`, `await page.${await generateLocator(locator)}.selectOption(${javascript.formatObject(params.values)});` ]; return { code, action: () => locator.selectOption(params.values).then(() => {}), captureSnapshot: true, waitForNetwork: true, }; },
  • Zod schema definition for the input parameters of 'browser_select_option' tool (selectOptionSchema extending elementSchema with 'values' array) and the tool's schema including name, title, description, inputSchema, and type.
    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.'), }); const selectOption = defineTool({ capability: 'core', schema: { name: 'browser_select_option', title: 'Select option', description: 'Select an option in a dropdown', inputSchema: selectOptionSchema, type: 'destructive', },
  • src/tools.ts:35-50 (registration)
    Registration of the 'browser_select_option' tool by importing and spreading the tools from './tools/snapshot.js' into the snapshotTools array used for tool registration.
    export const snapshotTools: Tool<any>[] = [ ...common(true), ...console, ...dialogs(true), ...files(true), ...install, ...keyboard(true), ...navigate(true), ...network, ...pdf, ...screenshot, ...snapshot, ...tabs(true), ...testing, ...wait(true), ];
  • Module-level export of the selectOption tool (browser_select_option) as part of the default array from snapshot.ts, which is then imported and registered in src/tools.ts.
    export default [ snapshot, click, drag, hover, type, selectOption, ];

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/Angeluis001/playwright-mcp'

If you have feedback or need assistance with the MCP directory API, please join our Discord server