Skip to main content
Glama

Server Configuration

Describes the environment variables required to run the server.

NameRequiredDescriptionDefault
FIGMA_TOKENNoFigma Personal Access Token for design tools.
ENABLED_TOOLSNoComma-separated list of tool groups to enable (e.g., 'core,interaction,inspection'). If not set, all tools are enabled.

Capabilities

Features and capabilities supported by this server

CapabilityDetails
tools
{}

Tools

Functions exposed to the LLM to take actions

NameDescription
pingA

Simple ping-pong tool for testing. Returns 'pong' with optional message.

openBrowserB

Open browser and navigate to URL. Window persists for further interactions.

clickA

Click element by APOM ID (preferred) or CSS selector. Handles React/Vue/Angular events, waits for navigation.

typeA

Type text into input by APOM ID (preferred) or CSS selector. Updates React/Vue/Angular state automatically.

getComputedCssA

Get computed CSS styles for element. For layout debugging and responsive design.

getBoxModelB

Get element box model: dimensions, positioning, margins, padding, borders.

screenshotA

Capture element image (5-10k tokens), or full viewport when no id/selector is given. Use analyzePage for form data/validation (8-10k tokens).

saveScreenshotA

Save screenshot to file without returning in context. Auto-scales and compresses. Use maxWidth: null and format: 'png' for original quality.

scrollToA

Scroll to element. For lazy loading and visibility testing.

waitForElementA

Wait for element to appear. For dynamic content and lazy-loaded elements.

executeScriptA

⚠️ LAST RESORT tool - use ONLY when ALL specialized tools failed. NEVER use for: clicking (use click), typing (use type), scrolling (use scrollTo), reading page elements (use analyzePage), finding elements (use findElementsByText), fetching API data (use listNetworkRequests + getNetworkRequest). May break React/Vue/Angular synthetic events. ALWAYS try specialized tools first.

getConsoleLogsA

Get browser console messages. For debugging JS errors and tracking behavior.

listNetworkRequestsA

List network requests (method, URL, status). Use getNetworkRequest for details. Supports pagination.

getNetworkRequestA

Get network request details (headers, payload, response). Use requestId from listNetworkRequests.

filterNetworkRequestsA

Filter network requests by URL pattern. Returns matching requests with full details.

hoverA

Hover over element by APOM ID or CSS selector. For hover effects, tooltips, :hover states.

pressKeyA

Press keyboard key on focused element or page. For form submission (Enter), closing dialogs (Escape), navigation (Tab, Arrow keys), shortcuts (Ctrl+A).

selectOptionA

Select dropdown option by APOM ID or CSS selector. Specify value, text, or index.

executeModelActionA

Universal tool to execute any model-specific action on element.

This tool works with element models (Strategy Pattern) and can execute any action defined by the model. Use analyzePage() first to see element's model and available actions in the 'models' map.

Models: TxtInp (text input), Sel (select), Btn (button), Chk (checkbox), Radio (radio), TxtArea (textarea), Link (link), Range (range), DatePicker (custom date picker), DateInp (HTML5 date), FileInp (file), ColorInp (color).

Examples:

  • executeModelAction({id: "input_20", action: "type", params: {text: "hello"}})

  • executeModelAction({id: "select_5", action: "selectOption", params: {value: "US"}})

  • executeModelAction({id: "datepicker_3", action: "SetDate", params: {date: "2024-03-15"}})

  • executeModelAction({id: "checkbox_7", action: "check"})

dragA

Drag element in any direction. For maps, charts, SVG, canvas, sliders. Use mode='synthetic' for JS libraries (frappe-gantt, jQuery UI). Use scrollHorizontal for scrollbars.

scrollHorizontalA

Scroll element horizontally by pixels or to end. For tables, carousels, scrollable containers.

setStylesA

Apply inline CSS to element. For live editing and prototyping.

setViewportA

Change viewport dimensions. Test responsive layouts across screen sizes.

getViewportA

Get viewport size and pixel ratio. For responsive design testing.

navigateToB

Navigate to new URL. Reuses browser instance.

listFramesA

List all frames (main + iframes) on the current page with url/name/isMain, plus the currently active frame. Use to discover cross-origin iframes (e.g. app.example.com), then switchFrame into one.

switchFrameA

Set the active frame so click/type/hover/analyzePage/find/executeScript/waitForElement run INSIDE it — required to automate cross-origin iframes (resolved via CDP, bypassing Same-Origin Policy). Call with no args to reset to the main frame. Auto-resets on navigateTo.

getFigmaFrameC

Export Figma frame as PNG. Requires API token and file/node IDs.

compareFigmaToElementB

Compare Figma design with browser element. Pixel-perfect validation.

getFigmaSpecsB

Extract design specs from Figma: colors, fonts, dimensions, spacing.

parseFigmaUrlA

Parse Figma URL to extract fileKey and nodeId.

listFigmaPagesA

Get file structure: all pages and frames. Use first to discover file contents.

searchFigmaFramesA

Search frames/components by name. Case-insensitive across all pages.

getFigmaComponentsB

Get all components from file (Design System). For extracting design system.

getFigmaStylesA

Get all styles: color, text, effect, grid. For extracting design tokens.

getFigmaColorPaletteA

Extract color palette. Returns unique colors with hex, rgba, usage count.

convertFigmaToCodeA

Convert Figma design to React/Tailwind code. Fetches node structure and rendered image, returns simplified design data with AI instructions for generating clean, semantic code. Focuses on React components with Tailwind CSS styling.

smartFindElementA

Find elements with natural language. Returns ranked candidates. Prefer analyzePage for better performance.

analyzePageA

PRIMARY tool for reading page state. Returns APOM tree: {tree, metadata, groups}. Compact format (default): containers as "tag_id":[children] keys, interactive elements as {id, tag, type, position, metadata} without selectors. Use element IDs (e.g., button_45, input_20) with click/type tools. Selectors registered internally for resolution. Use refresh:true after clicks. Efficient: 8-10k tokens vs screenshot 15-25k. Legend: clickTarget format is "tag:id" (e.g., "kp-chats-list-item:container_58") - use the id part for clicking. No clickTarget = element handles its own click.

getElementDetailsA

Get detailed information about element by its APOM ID. Returns full element details including bounds, CSS selector, position, attributes, and computed styles. Can also analyze children elements tree structure. Use this when analyzePage output was simplified and you need complete information about specific element or analyze specific sections in detail.

findElementsByTextA

Find elements by visible text content and get their selectors. Use this INSTEAD of executeScript when you need to find elements. Returns working selectors that can be used with click/type tools. Can optionally perform actions directly.

selectFromGroupA

Select option(s) from radio or checkbox group by name attribute. For radio groups: selects one option. For checkbox groups: supports multi-select with modes (set/add/remove/toggle). Use 'name' to identify the group, and 'value'/'text' to select by value or label. See groups in analyzePage output for available options.

enableRecorderB

Check ChromeTools Extension connection for scenario recording. Use Chrome Extension popup (CT icon) for recording.

startRecordingA

Start recording user actions. Follows active tab automatically. Use stopRecording to finish.

stopRecordingA

Stop recording and return recorded actions. Does not save the scenario - use this to review actions before saving with saveScenario.

getRecorderStateA

Get current recorder state: isRecording, isPaused, action count, current tab

saveScenarioA

Save recorded actions as a scenario. Call this after stopRecording to persist the scenario to disk.

executeScenarioB

Execute scenario by name with dependency resolution. Use projectId to disambiguate duplicate names.

listScenariosB

List all scenarios with metadata.

searchScenariosC

Search scenarios by text or tags.

getScenarioInfoA

Get scenario details: actions, parameters, dependencies.

deleteScenarioC

Delete scenario and secrets.

exportScenarioAsCodeA

Export scenario as test code for NEW file. Supports Page Object integration: 'generate-integrated' generates POM + test using it, 'use-existing' generates test using existing POM file. Use appendScenarioToFile for existing files.

appendScenarioToFileA

Append scenario as test code to EXISTING file. Supports Page Object integration: 'generate-integrated' generates POM + test using it, 'use-existing' generates test using existing POM file. Use exportScenarioAsCode for new files.

generatePageObjectA

Generate Page Object Model (POM) class from current page analysis. Analyzes page structure, extracts interactive elements (inputs, buttons, links), groups them by sections (header, nav, form, etc.), and generates framework-specific code. Supports Playwright (TypeScript/Python) and Selenium (Python/Java). Auto-generates smart element names and helper methods.

listTabsA

List all open browser tabs with their URLs, titles, and active status. Use this to see all tabs opened manually or via window.open/target='_blank'. Returns tab index for use with switchTab.

switchTabA

Switch active browser tab by index or URL pattern. After switch, all subsequent commands will target the new active tab. Use listTabs first to see available tabs.

loadSwaggerA

Load and parse OpenAPI/Swagger spec from URL or local file. Returns structured summary: endpoints, schemas, auth types, base URL. Supports both OpenAPI 2.0 (Swagger) and 3.x, JSON and YAML formats. Use this first to understand an API before generating models or client code.

generateApiModelsA

Generate typed data models from OpenAPI/Swagger spec. Creates TypeScript interfaces/types or Python dataclasses/pydantic/TypedDict from API schemas. Handles $ref resolution, enums, allOf/oneOf, nested objects. Use after loadSwagger to generate model files.

Prompts

Interactive templates invoked by user choice

NameDescription

No prompts

Resources

Contextual data attached and managed by the client

NameDescription

No resources

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/docentovich/chrometools-mcp'

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