Skip to main content
Glama
naveenanimation20

LocatorLabs MCP Server

by naveenanimation20
OverviewSchemaRelated ServersScoreDiscussions
TypeScript
Local

LocatorLabs MCP Server

🎯 Intelligent Playwright locator generation powered by AI

An MCP (Model Context Protocol) server that provides smart locator generation for Playwright test automation.

Works directly in VS Code (with GitHub Copilot), Cursor, Windsurf, Cline, and Claude Desktop. No extra apps needed - just your favorite IDE!

npm version

⚡ One-Click Install

✨ Features

Feature

Description

🎯

Get Locators

Get all possible locators for any element with reliability rankings

📊

Analyze Page

Scan pages and identify all interactive elements

🏗️

Generate POM

Auto-generate Page Object classes (TypeScript/JavaScript/Python)

✅

Run Tests

Execute Playwright tests and get pass/fail results

📝

Generate Tests

Create executable test scripts

🚀 Quick Start

For VS Code (v1.99+ with GitHub Copilot)

One-Line Install (Mac/Linux):

code --add-mcp '{"name":"locatorlabs","command":"npx","args":["-y","locatorlabs-mcp"]}'

One-Line Install (Windows PowerShell):

code --add-mcp '{\"name\":\"locatorlabs\",\"command\":\"npx\",\"args\":[\"-y\",\"locatorlabs-mcp\"]}'

Or Manual Setup:

  1. Open Command Palette (Cmd+Shift+P / Ctrl+Shift+P)

  2. Type: MCP: Add Server

  3. Select: Command (stdio)

  4. Command: npx

  5. Args: -y locatorlabs-mcp

Using with GitHub Copilot:

  1. Enable Agent Mode: Settings → Search chat.agent.enabled → Enable

  2. Open Copilot Chat (Ctrl+Cmd+I / Ctrl+Alt+I)

  3. Switch to Agent mode (dropdown at top)

  4. Chat: "Get locators for login button on https://saucedemo.com"

For Claude Desktop

Step 1: Open config file

  • Mac: ~/Library/Application Support/Claude/claude_desktop_config.json

  • Windows: %APPDATA%\Claude\claude_desktop_config.json

Step 2: Add this configuration:

{ "mcpServers": { "locatorlabs": { "command": "npx", "args": ["-y", "locatorlabs-mcp"] } } }

Step 3: Restart Claude Desktop

For Cursor IDE

One-Line Install:

cursor --add-mcp '{"name":"locatorlabs","command":"npx","args":["-y","locatorlabs-mcp"]}'

Or Manual: Go to Cursor Settings → MCP → Add new MCP Server

  • Name: locatorlabs

  • Command: npx -y locatorlabs-mcp

For VS Code + Cline Extension

Add to Cline MCP settings:

{ "mcpServers": { "locatorlabs": { "command": "npx", "args": ["-y", "locatorlabs-mcp"] } } }

📖 Usage Examples

Just chat naturally:

Get Locators for an Element

"Get me all locators for the login button on https://www.saucedemo.com"

Response:

Type

Locator

Reliability

testId

getByTestId('login-button')

98%

role

getByRole('button', { name: 'Login' })

95%

id

locator('#login-button')

90%

Analyze Entire Page

"Analyze all form elements on https://www.saucedemo.com"

Generate Page Object Model

"Generate a TypeScript Page Object for https://www.saucedemo.com and call it LoginPage"

Run a Test

"Run a test that logs into saucedemo.com with standard_user and secret_sauce, then verify Products page appears"

Response:

✅ Test PASSED (3.2s) - Navigate to login page ✅ - Enter username ✅ - Enter password ✅ - Click login ✅ - Verify Products visible ✅

Generate Test Script

"Generate a Python test script for the saucedemo login flow"

🛠️ Available Tools

Tool

Description

get_locators

Get all possible locators for a specific element

analyze_page

List all interactive elements on a page

generate_page_object

Create POM class (TypeScript/JavaScript/Python)

run_test

Execute tests in real browser, get pass/fail

generate_test

Generate executable test scripts

🎯 Supported Test Actions

Action

Description

navigate

Go to URL

click

Click element

fill

Enter text

clear

Clear input field

check

/

uncheck

Toggle checkbox

select

Select dropdown option

hover

Mouse hover

press

Keyboard key press

assert_visible

Verify element visible

assert_hidden

Verify element hidden

assert_text

Verify text content

assert_value

Verify input value

assert_url

Verify page URL

assert_title

Verify page title

wait

Wait for time

wait_for_element

Wait for element

screenshot

Capture screenshot

🏆 Locator Priority

LocatorLabs ranks locators by reliability:

  1. data-testid (98%) - Best, explicitly for testing

  2. Role + Name (95%) - Playwright recommended

  3. Label (90%) - Accessible

  4. ID (90%) - Stable if meaningful

  5. Placeholder (85%) - Good for inputs

  6. Text (75%) - May change

  7. CSS (60%) - Can be brittle

  8. XPath (40%) - Avoid unless necessary

🔄 LocatorLabs vs Playwright MCP

Feature

Playwright MCP

LocatorLabs MCP

Get all locators for element

❌

✅

Locator reliability ranking

❌

✅

Generate Page Object Model

❌

✅

Run tests with pass/fail

❌

✅

Browser automation

✅

✅

Device emulation

✅

❌

They work great together! Use Playwright MCP for navigation/scraping, LocatorLabs MCP for locators/POMs/tests.

📋 Requirements

  • Node.js 18+

  • Playwright browsers (auto-installed on first run)

🔧 Troubleshooting

Playwright browsers not installed

npx playwright install chromium

Permission issues on Mac

chmod +x ~/.npm/_npx/*/node_modules/.bin/locatorlabs-mcp

View logs (Claude Desktop)

tail -f ~/Library/Logs/Claude/mcp*.log

Auto-approve tools in VS Code

Add to settings.json:

{ "chat.tools.autoApprove": true }

🤝 Contributing

Contributions welcome! Please open an issue or PR on GitHub.

📺 Author

Naveen AutomationLabs

📄 License

MIT

Made with ❤️ for the test automation community

This server cannot be installed

-
security - not tested
F
license - not found
-
quality - not tested

How are these scores calculated?

Resources

New MCP Servers

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/naveenanimation20/locatorlabs-mcp'

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