askill
browser-devtools-cli

browser-devtools-cliSafety 90Repository

Automates browser interactions using Playwright for web testing, debugging, and automation. Use when the user needs to navigate websites, take screenshots, fill forms, click elements, extract page content (HTML/text), audit accessibility (ARIA/AX tree), measure Web Vitals performance, monitor console logs and HTTP requests, mock API responses, execute JavaScript in browser, inspect React components, or compare UI with Figma designs.

7 stars
1.2k downloads
Updated 2/8/2026

Package Files

Loading files...
SKILL.md

Browser DevTools CLI

Command-line interface for browser automation, debugging, and testing using Playwright.

Installation

npm install -g browser-devtools-mcp

Quick Start

# Navigate to a URL
browser-devtools-cli navigation go-to --url "https://example.com"

# Take a screenshot
browser-devtools-cli content take-screenshot --name "homepage"

# Get page content as text
browser-devtools-cli content get-as-text

Global Options

OptionDescriptionDefault
--port <number>Daemon server port2020
--session-id <string>Session ID for browser state persistenceauto
--jsonOutput results as JSON (recommended for AI)false
--quietSuppress log messagesfalse
--verboseEnable debug outputfalse
--timeout <ms>Operation timeout30000
--headlessRun browser in headless modetrue
--no-headlessRun browser with visible window-
--persistentPreserve cookies/localStoragefalse
--no-persistentClear state on session end-
--user-data-dir <path>Browser user data directoryOS temp
--use-system-browserUse system Chromefalse
--browser-path <path>Custom browser pathauto

AI Agent Recommended Options:

# JSON output for parsing, quiet mode for clean output, session for state persistence
browser-devtools-cli --json --quiet --session-id "my-session" <command>

Tool Domains

The CLI provides tools organized by domain:

DomainDescriptionReference
navigationPage navigation (go-to, back, forward, reload)
contentContent extraction (screenshot, PDF, HTML, text)
interactionUser interactions (click, fill, hover, scroll)
a11yAccessibility snapshots (ARIA, AX tree)
o11yObservability (Web Vitals, console, HTTP, traces)
runJavaScript execution (browser, sandbox)
stubHTTP mocking (intercept, mock, clear)
syncSynchronization (wait for network idle)
reactReact DevTools integration
figmaFigma design comparison

CLI Management Commands

Daemon Management

browser-devtools-cli daemon status      # Check daemon status
browser-devtools-cli daemon info        # Show daemon info (version, uptime, sessions)
browser-devtools-cli daemon start       # Start daemon
browser-devtools-cli daemon stop        # Stop daemon
browser-devtools-cli daemon restart     # Restart daemon

Session Management

browser-devtools-cli session list                  # List active sessions
browser-devtools-cli session info <session-id>     # Show session details
browser-devtools-cli session delete <session-id>   # Delete a session

Tool Discovery

browser-devtools-cli tools list              # List all available tools
browser-devtools-cli tools search <query>    # Search tools by name or description
browser-devtools-cli tools info <tool-name>  # Show tool details and parameters

Configuration

browser-devtools-cli config    # Show current configuration

Updates

browser-devtools-cli update --check   # Check for updates
browser-devtools-cli update           # Check and install updates

Examples

Basic Navigation and Screenshot

# Navigate to URL
browser-devtools-cli navigation go-to --url "https://example.com"

# Take screenshot
browser-devtools-cli content take-screenshot --name "homepage"

# Get page text
browser-devtools-cli content get-as-text

Form Automation

# Use same session for state persistence
SESSION="--session-id login-test"

# Navigate to login page
browser-devtools-cli $SESSION navigation go-to --url "https://app.example.com/login"

# Fill form fields
browser-devtools-cli $SESSION interaction fill --selector "#email" --value "user@example.com"
browser-devtools-cli $SESSION interaction fill --selector "#password" --value "password123"

# Submit form
browser-devtools-cli $SESSION interaction click --selector "button[type=submit]"

# Wait for navigation
browser-devtools-cli $SESSION sync wait-for-network-idle

# Capture result
browser-devtools-cli $SESSION content take-screenshot --name "dashboard"

Performance Analysis

# Navigate
browser-devtools-cli navigation go-to --url "https://example.com"

# Get Web Vitals metrics
browser-devtools-cli --json o11y get-web-vitals

# Check console for errors
browser-devtools-cli --json o11y get-console-messages --types error,warn

# Analyze HTTP requests
browser-devtools-cli --json o11y get-http-requests

Accessibility Audit

# Navigate
browser-devtools-cli navigation go-to --url "https://example.com"

# Get ARIA snapshot
browser-devtools-cli a11y take-aria-snapshot

# Get detailed AX tree
browser-devtools-cli --json a11y take-ax-tree-snapshot --roles button,link,textbox

API Mocking

# Mock API response
browser-devtools-cli stub mock-http-response \
  --url-pattern "**/api/users" \
  --body '[{"id": 1, "name": "Test User"}]'

# Navigate and test
browser-devtools-cli navigation go-to --url "https://app.example.com"

# Clear mocks
browser-devtools-cli stub clear --all

Shell Script for CI/CD

#!/bin/bash
set -e

CLI="browser-devtools-cli --json --quiet --session-id ci-test-$$"

# Navigate
$CLI navigation go-to --url "https://example.com"

# Wait for load
$CLI sync wait-for-network-idle

# Take screenshot
$CLI content take-screenshot --name "ci-test"

# Get Web Vitals
VITALS=$($CLI o11y get-web-vitals)
echo "Web Vitals: $VITALS"

# Check for console errors
ERRORS=$($CLI o11y get-console-messages --types error)
if [ "$ERRORS" != "[]" ]; then
  echo "Console errors found: $ERRORS"
  exit 1
fi

# Cleanup
$CLI session delete "ci-test-$$"

Interactive Mode (Human Users)

For manual exploration, an interactive REPL mode is available:

browser-devtools-cli interactive
browser-devtools-cli --no-headless interactive   # With visible browser
CommandDescription
helpShow available commands
exit, quitExit interactive mode
<domain> <tool>Execute a tool

Shell Completions

# Generate and install completions
echo 'eval "$(browser-devtools-cli completion bash)"' >> ~/.bashrc
echo 'eval "$(browser-devtools-cli completion zsh)"' >> ~/.zshrc

Install

Download ZIP
Requires askill CLI v1.0+

AI Quality Score

95/100Analyzed 2/10/2026

An exceptionally well-documented skill for a browser automation CLI. It provides comprehensive coverage of installation, configuration, domain-specific commands, and complex usage scenarios like CI/CD integration and API mocking.

90
95
95
95
98

Metadata

Licenseunknown
Version-
Updated2/8/2026
PublisherNeverSight

Tags

apici-cdobservabilitytesting