Skip to content
Automation
Skill

/browser-automation

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.

From plugin
firefox-devtools-mcp
3405 skills2 agents
Install
$ npx -y skills add mozilla/firefox-devtools-mcp --skill browser-automation --agent claude-code

How it fires

How this skill gets triggered: by you, by Claude, or both.

  • Fires itselfAuto-invocation. Claude auto-loads it when your prompt matches the work.Auto-invocation is when the right skill fires by itself at the right moment, driven by a FLOW.md router and a hook, instead of you invoking it by name. It is the difference between a skill being installed and a skill actually getting used.Read the full definition →
  • You can call itInvoke it directly when you want it.
  • Slash command/browser-automation

Context preview

The summary Claude sees to decide when to auto-load this skill.

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.

SKILL.md

browser-automation.SKILL.md
name: browser-automation
description: 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.

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 | `navigate_page`, `navigate_history` | | See DOM | `take_snapshot` | | Click | `click_by_uid` | | Hover | `hover_by_uid` | | Type | `fill_by_uid`, `fill_form_by_uid` | | Drag | `drag_by_uid_to_uid` | | Dialogs | `accept_dialog`, `dismiss_dialog` | | Screenshot | `screenshot_page`, `screenshot_by_uid` | | Debug | `list_console_messages`, `list_network_requests` | | Profile | `profiler_start`, `profiler_stop` |

Guidelines

  • **Check existing session first**: Call `list_pages` before navigating — reuse the running Firefox session rather than starting fresh
  • **Always snapshot first**: UIDs only exist after `take_snapshot`
  • **Re-snapshot after DOM changes**: UIDs become stale after interactions
  • **Screenshots**: in Cowork (system prompt has an outputs folder host path), call `screenshot_page saveTo="<host-outputs-path>/screenshot.png"` then call `present_files` with that path. Otherwise call `screenshot_page` without `saveTo` and include the returned image directly in your reply — the user cannot see tool call outputs.
  • **Check for errors**: Use `list_console_messages level="error"` to catch JS issues
  • **Firefox only**: This MCP controls Firefox, not Chrome or Safari
  • **Reconfiguring Firefox**: to use a specific binary, profile, or headless mode, call `restart_firefox` with the relevant options (`firefoxPath`, `profilePath`, `headless`)
Read more
Ships withfirefox-devtools-mcp

Model Context Protocol server for automating Firefox via WebDriver BiDi (through Selenium WebDriver). Works with Claude Code, Claude Desktop, Cursor, Cline and other MCP clients.

Get the whole plugin
Stats
341
Stars
51
Forks
Active
Maintenance
TypeScript
Language
5d ago
Last commit
10mo ago
Created

Repo: mozilla/firefox-devtools-mcp