core

Core agent-browser usage guide. Read this before running any agent-browser commands. Covers the snapshot-and-ref workflow, navigating pages, interacting with elements (click, fill, type, select), extracting text and data, taking screenshots, managing tabs, handling forms and auth, waiting for content, running multiple browser sessions in parallel, and troubleshooting common failures. Use when the user asks to interact with a website, fill a form, click something, extract data, take a screenshot, log into a site, test a web app, or automate any browser task.

Install
npx skills add 'https://github.com/vercel-labs/agent-browser/tree/main/skill-data/core'
Download bundle ↓
main · aff6125Scanned 2026-09-17

Contributors

GitHub-linked commit authors for this SKILL.md at the saved revision. Co-authors and history before file renames are not included.

File history ↗
View on GitHub
← Back to SKILL.md
#!/bin/bash# Template: Authenticated Session Workflow# Purpose: Login once, save state, reuse for subsequent runs# Usage: ./authenticated-session.sh <login-url> [state-file]## RECOMMENDED: Use the auth vault instead of this template:#   echo "<pass>" | agent-browser auth save myapp --url <login-url> --username <user> --password-stdin#   agent-browser auth login myapp# The auth vault stores credentials securely and the LLM never sees passwords.## Environment variables:#   APP_USERNAME - Login username/email#   APP_PASSWORD - Login password## Two modes:#   1. Discovery mode (default): Shows form structure so you can identify refs#   2. Login mode: Performs actual login after you update the refs## Setup steps:#   1. Run once to see form structure (discovery mode)#   2. Update refs in LOGIN FLOW section below#   3. Set APP_USERNAME and APP_PASSWORD#   4. Delete the DISCOVERY section set -euo pipefail LOGIN_URL="${1:?Usage: $0 <login-url> [state-file]}"STATE_FILE="${2:-./auth-state.json}" echo "Authentication workflow: $LOGIN_URL" # ================================================================# SAVED STATE: Skip login if valid saved state exists# ================================================================if [[ -f "$STATE_FILE" ]]; then    echo "Loading saved state from $STATE_FILE..."    if agent-browser --state "$STATE_FILE" open "$LOGIN_URL" 2>/dev/null; then        agent-browser wait --load load         CURRENT_URL=$(agent-browser get url)        if [[ "$CURRENT_URL" != *"login"* ]] && [[ "$CURRENT_URL" != *"signin"* ]]; then            echo "Session restored successfully"            agent-browser snapshot -i            exit 0        fi        echo "Session expired, performing fresh login..."        agent-browser close 2>/dev/null || true    else        echo "Failed to load state, re-authenticating..."    fi    rm -f "$STATE_FILE"fi # ================================================================# DISCOVERY MODE: Shows form structure (delete after setup)# ================================================================echo "Opening login page..."agent-browser open "$LOGIN_URL"agent-browser wait --load domcontentloadedagent-browser wait --fn "(() => { const usable = (el) => { const style = getComputedStyle(el); return !el.disabled && !el.readOnly && style.display !== 'none' && style.visibility !== 'hidden' && el.getClientRects().length > 0; }; const username = Array.from(document.querySelectorAll('input[type=email], input[type=text], input[autocomplete=username], input[name*=email i], input[name*=user i], input[name*=login i]')).some(usable); const password = Array.from(document.querySelectorAll('input[type=password]')).some(usable); return username && password; })()" echo ""echo "Login form structure:"echo "---"agent-browser snapshot -iecho "---"echo ""echo "Next steps:"echo "  1. Note the refs: username=@e?, password=@e?, submit=@e?"echo "  2. Update the LOGIN FLOW section below with your refs"echo "  3. Set: export APP_USERNAME='...' APP_PASSWORD='...'"echo "  4. Delete this DISCOVERY MODE section"echo ""agent-browser closeexit 0 # ================================================================# LOGIN FLOW: Uncomment and customize after discovery# ================================================================# : "${APP_USERNAME:?Set APP_USERNAME environment variable}"# : "${APP_PASSWORD:?Set APP_PASSWORD environment variable}"## agent-browser open "$LOGIN_URL"# agent-browser wait --load domcontentloaded# agent-browser wait --fn "(() => { const usable = (el) => { const style = getComputedStyle(el); return !el.disabled && !el.readOnly && style.display !== 'none' && style.visibility !== 'hidden' && el.getClientRects().length > 0; }; const username = Array.from(document.querySelectorAll('input[type=email], input[type=text], input[autocomplete=username], input[name*=email i], input[name*=user i], input[name*=login i]')).some(usable); const password = Array.from(document.querySelectorAll('input[type=password]')).some(usable); return username && password; })()"# agent-browser snapshot -i## # Fill credentials (update refs to match your form)# agent-browser fill @e1 "$APP_USERNAME"# agent-browser fill @e2 "$APP_PASSWORD"# agent-browser click @e3# Replace this with the app-specific post-login wait, for example:# agent-browser wait --url "**/dashboard"# agent-browser wait --text "Welcome"## # Verify login succeeded# FINAL_URL=$(agent-browser get url)# if [[ "$FINAL_URL" == *"login"* ]] || [[ "$FINAL_URL" == *"signin"* ]]; then#     echo "Login failed - still on login page"#     agent-browser screenshot /tmp/login-failed.png#     agent-browser close#     exit 1# fi## # Save state for future runs# echo "Saving state to $STATE_FILE"# agent-browser state save "$STATE_FILE"# echo "Login successful"# agent-browser snapshot -i