← ClaudeAtlas

browser-automationlisted

This skill should be used when the user asks about browser automation, testing web pages, extracting content, filling forms, taking screenshots, or monitoring console/network activity. Activates for E2E testing, form automation, browsing tasks, or debugging web applications.
mozilla/firefox-devtools-mcp · ★ 393 · AI & Automation · score 80
Install: claude install-skill mozilla/firefox-devtools-mcp
When the user asks about browser automation, use Firefox DevTools MCP to control a real Firefox browser. ## Before Starting Always call `list_pages` first. This checks whether Firefox is already running and which pages are open. Do not assume Firefox needs to be restarted or that you need to navigate from scratch — reuse the existing session whenever possible. ## When to Use This Skill Activate this skill when the user: - Wants to automate browser interactions ("Fill out this form", "Click the login button") - Needs E2E testing ("Test the checkout flow", "Verify the login works") - Wants to browse or extract content ("Get all links on this page", "Extract prices") - Needs screenshots ("Screenshot this page", "Capture the error state") - Wants to debug ("Check for JS errors", "Show failed network requests") - Needs to profile performance ("Profile this page load") ## Core Workflow ### Step 1: Navigate and Snapshot ``` navigate_page url="https://example.com" take_snapshot ``` The snapshot returns a DOM representation with UIDs (e.g., `e42`) for each interactive element. ### Step 2: Interact with Elements Use UIDs from the snapshot: ``` fill_by_uid uid="e5" text="user@example.com" click_by_uid uid="e8" ``` ### Step 3: Re-snapshot After Changes DOM changes invalidate UIDs. Always re-snapshot after: - Page navigation - Form submissions - Dynamic content loads ``` take_snapshot # Get fresh UIDs ``` ## Quick Reference | Task | Tools | |------|-------| | Navigate |