QA Selector Picker

Pick elements and generate robust selectors for QA workflows.

🎯 QA Selector Picker - The Ultimate Element Selector Tool for Test Automation Tired of writing brittle selectors that break with every UI change? QA Selector Picker helps you generate stable, maintainable selectors in seconds! ✨ KEY FEATURES: 🔍 Smart Element Picking - Click any element on any webpage - Visual highlighting shows exactly what you're selecting - Works on all websites 📝 Multiple Selector Formats - CSS Selectors - XPath (Relative) - Playwright Locators (getByTestId, getByRole, getByLabel, etc.) - Cypress Commands (cy.get, cy.contains) - WebdriverIO Selectors 🧠 Intelligent Selector Quality Analysis - Confidence score for each selector - Quality badges: RECOMMENDED, OK, or RISKY - Warnings for brittle selectors (nth-of-type, auto-generated classes) 💡 Actionable Suggestions - Get recommendations to improve selector stability - Tips to add data-testid, aria-label, or other stable attributes - Refactor alternatives with better stability scores 🔄 Refactor Recommendations - See alternative selectors ranked by stability - Compare CSS vs XPath options - Choose the best selector for your test suite ## 🚀 AI-Powered Test Automation Transform your manual selector picking into full automation scripts instantly! ### ✨ Key Features Update (v2.0.0) **1. AI Script Generation** - Automatically generate complete test scripts based on your picked elements. - Uses advanced AI (DeepSeek) to understand context and create logical test scenarios. - **Smart Analysis:** The AI acts as a Senior QA Engineer, analyzing your selectors to suggest meaningful test cases (e.g., successful login, error handling). **2. Multi-Framework Support** - Generate code for your favorite framework: - 🎭 **Playwright** (`test.describe`, `page.locator`) - 🌲 **Cypress** (`describe`, `cy.xpath`) - 🤖 **WebdriverIO** (`describe`, `await $`) **3. Enterprise-Grade Security** - New **Cloudflare Gateway Integration**: Your API requests are now routed through a secure server-side worker. - **No API Keys** are exposed in the client-side extension code, ensuring maximum security and compliance. **4. Enhanced Selector Picking** - **Disabled Elements Support**: Now you can easily pick disabled buttons or inputs! We've upgraded our picker engine to handle elements that block standard click events. - **Improved Accuracy**: Better handling of dynamic classes and complex DOM structures. --- ### 🛡️ Privacy & Security - We do **not** collect your browsing data. - AI features are optional and only activate when you click "Generate Script". - Only the specific selectors you pick are sent to the AI service for script generation. ### 📦 How to Use 1. **Pick Elements**: Use the picker to select elements on the page (Login fields, buttons, etc.). 2. **Review**: Check the generated CSS/XPath selectors. 3. **Generate Script**: - Scroll down to the AI section. - Select your framework (Playwright, Cypress, or WebdriverIO). - Click **Generate Script**. - Copy the code and paste it into your test file! Update now to experience the future of test automation! 🚀