Organic Navigation
Navigate like a real user - browse, login, complete authentication flows. No more static page snapshots or forced immediate captures.
The World's First AI-Powered Selector Generator with Organic Navigation
Generate professional-grade selectors with intelligent toggle mode and AI optimization. Navigate freely, login, browse multiple pages, then capture selectors with 95% confidence.
$ npm install -g bestlocator
$ best-locator pick-toggle https://app.com
🔴 Navigate freely (CTRL+S to start)
🟢 Selector mode ON (click to capture)
Red: Navigate freely
Green: Capture mode
Revolutionary Features
Traditional selector generators are broken. Best Locator changes everything with AI-powered intelligence.
Intelligent Toggle Mode
CTRL+S to turn ON selector mode, CTRL+D to turn OFF. Capture elements at the exact moment when they're in the right context.
Professional Selectors
Prioritizes data-test, data-testid, aria-label and testing-specific attributes. Avoids fragile CSS classes and temporary IDs.
Multi-page Capture
Collect selectors from different pages in a single session. Perfect for onboarding flows, e-commerce checkouts, and multi-step processes.
Universal Framework Support
Generate code for Playwright, Selenium, and Cypress in JavaScript, TypeScript, Python, Java, and C#.
AI-Powered Enhancement
Integrates with OpenAI and Ollama to provide intelligent selector suggestions and optimizations. AI analyzes your page structure to recommend the most robust selectors.
95% Confidence Rating
Advanced validation and scoring system ensures selectors are unique, stable, and maintainable. Industry-leading reliability.
How Toggle Mode Works
The breakthrough feature that makes Best Locator unique
1
Navigate Freely
Browse your app normally - login, navigate between pages, interact with elements. Red indicator shows you're in navigation mode.
2
Press CTRL+S
Turn ON selector mode when you're ready to capture. Green indicator shows clicks will now generate selectors instead of triggering actions.
3
Click Elements
Click on elements you want to capture. Each click generates a professional selector with confidence rating and framework-specific code.
4
Press CTRL+D
Turn OFF selector mode to navigate to other pages or sections. Toggle ON/OFF as many times as needed in a single session.
5
Press ESC
Finish the session and get all captured selectors with combined test snippets. All code is automatically copied to clipboard.
Universal Framework & Language Support
One tool, multiple frameworks and languages. Generate code for your entire tech stack.
🎭 Testing Frameworks
Playwright
Selenium
Cypress
💻 Programming Languages
JavaScript
TypeScript
Python
Java
C#
🤖 AI Providers
OpenAI
Ollama
Framework Support Matrix
| Framework | JavaScript | TypeScript | Python | Java | C# |
|---|---|---|---|---|---|
| Playwright | ✅ | ✅ | ✅ | ✅ | ✅ |
| Selenium | ✅ | ✅ | ✅ | ✅ | ✅ |
| Cypress | ✅ | ✅ | ❌ | ❌ | ❌ |
Generate Code for Any Framework
Playwright (TypeScript)
# Generate TypeScript code for Playwright
best-locator pick https://app.com playwright typescript
# Output:
await page.locator('[data-test="username"]')
await page.locator('[data-testid="submit-btn"]')
Selenium (Python)
# Generate Python code for Selenium
best-locator pick https://app.com selenium python
# Output:
driver.find_element(By.CSS_SELECTOR, '[data-test="username"]')
driver.find_element(By.CSS_SELECTOR, '[data-testid="submit-btn"]')
Professional Selector Priority
Best Locator follows industry best practices for selector generation
| Priority | Selector Type | Confidence | Example |
|---|---|---|---|
| 1st | data-test |
95% | [data-test="username"] |
| 1st | data-testid |
95% | [data-testid="submit-btn"] |
| 2nd | data-cy |
90% | [data-cy="login-form"] |
| 3rd | aria-label |
85% | [aria-label="Close dialog"] |
| 4th | role |
80% | [role="button"] |
| 5th | name |
75% | [name="email"] |
| 6th | id |
70% | #username |
| 7th | text |
60% | text="Sign In" |
Traditional Approach vs. Best Locator
See why traditional selector generators fail and how Best Locator solves it
Traditional Generators
The broken approach: Immediate capture on static pages with unreliable selectors
# Typical output from traditional tools
await page.locator('#user-name-input-field-123')
await page.locator('.MuiButton-containedPrimary-456')
await page.locator('div:nth-child(3) > input:nth-child(2)')
await page.locator('#dynamic-generated-id-789')
❌ Forced immediate capture - No time to navigate or authenticate
❌ Static page snapshots - Can't handle login flows or dynamic content
❌ CSS-dependent selectors - Break when styling changes
❌ Generated IDs - Change with every deployment
❌ Brittle XPath - Fragile to DOM structure changes
❌ No context awareness - Elements captured without proper state
Best Locator
The professional approach: Organic navigation with testing-specific attributes
# Professional output from Best Locator
await page.locator('[data-test="username"]')
await page.locator('[data-testid="login-button"]')
await page.locator('[aria-label="Submit form"]')
await page.locator('[data-test="user-profile"]')
✅ Organic navigation - Browse naturally, login, navigate multiple pages
✅ Intelligent toggle mode - CTRL+S/CTRL+D for precise control
✅ AI-powered optimization - OpenAI & Ollama integration for intelligent suggestions
✅ Testing-first selectors - Prioritizes data-test, aria-* attributes
✅ 95% confidence rating - Industry-leading reliability
✅ Multi-page sessions - Capture from different pages in one session
✅ Context-aware capture - Elements captured in their proper state
Start Generating Professional Selectors
Join developers and QA engineers who have revolutionized their testing workflow
npm install -g bestlocator