القائمة
Interactive web tasks, browser login, click, scroll, form interaction, authenticated sessions, Playwright MCP (project)
التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.
استنادا إلى تصنيف SOC المهني
brief, summary, daily, weekly, end of day, EOD, digest, morning, recap, meeting prep, what's due, status update, review
Query and summarize Claude Code terminal session history
Email, inbox, Outlook, Microsoft 365, mail, messages, fetch emails, search emails, draft, reply, email processing (project)
fact, decision, architecture, knowledge, permanent, remember forever, always know, decisions, outcomes, lessons learned
GitHub CLI, docker commands, git operations, curl, native CLI tools, gh issue, gh pr, container, repository, API calls (project)
Create and manage Overleaf LaTeX documents. Use when transcribing handwritten work to LaTeX, creating academic documents, homework solutions, problem sets, or any LaTeX/Overleaf operations. Handles PDF/image to LaTeX conversion. Homework transcription workflow.
| name | browser-automation |
| description | Interactive web tasks, browser login, click, scroll, form interaction, authenticated sessions, Playwright MCP (project) |
Use the Playwright MCP server for interactive web tasks that require login, clicking, scrolling, or form interaction.
When to use Browser Automation:
When NOT to use Browser (use these instead):
| Need | Tool | Why |
|---|---|---|
| Search the web | WebSearch | Fast, no browser needed |
| Read a public URL | WebFetch | Simpler, converts HTML to markdown |
| Login to a site | Playwright Browser | Handles auth, cookies, sessions |
| Click a button | Playwright Browser | Interactive elements |
| Fill a form | Playwright Browser | Form fields, validation |
| Scroll to load | Playwright Browser | Dynamic/infinite scroll |
| Screenshot dashboard | Playwright Browser | Authenticated page |
| API endpoint | curl | Direct HTTP, no browser |
"What's the latest React documentation?"
→ Use WebSearch
"Summarize this blog post: https://example.com/post"
→ Use WebFetch
"Find documentation on Python asyncio"
→ Use WebSearch
"Check my Twitter mentions"
→ Use browser_navigate to twitter.com, then browser_snapshot
"Scroll through my LinkedIn feed"
→ Use browser_navigate, then browser_evaluate with scroll
"Fill out this form and submit"
→ Use browser_fill_form or browser_type + browser_click
"Take a screenshot of my dashboard"
→ Use browser_navigate + browser_take_screenshot
"Click the export button on this SaaS tool"
→ Use browser_snapshot to find ref, then browser_click
| Tool | Purpose | When to Use |
|---|---|---|
browser_navigate | Go to URL | Start any session |
browser_snapshot | Get accessibility tree | Before clicking (find element refs) |
browser_click | Click element | Buttons, links, interactive elements |
browser_type | Type into field | Text inputs, search boxes |
browser_fill_form | Fill multiple fields | Login forms, multi-field forms |
browser_take_screenshot | Capture image | Visual documentation |
browser_evaluate | Run JavaScript | Scroll, complex interactions |
browser_press_key | Press keyboard key | Enter, Escape, arrows |
browser_hover | Hover over element | Reveal tooltips, dropdowns |
browser_select_option | Select dropdown | Dropdown menus |
browser_wait_for | Wait for text/time | Content loading |
browser_tabs | Manage tabs | Multiple pages |
browser_close | Close browser | End session |
1. browser_navigate → url: "https://site.com/login"
2. browser_snapshot → find form field refs
3. browser_fill_form → username, password fields
4. browser_click → submit button (ref from snapshot)
5. browser_wait_for → text: "Dashboard" (or success indicator)
1. Login workflow (above)
2. browser_navigate → target page
3. browser_snapshot → get page content as accessibility tree
4. Process the content
1. browser_navigate → page with infinite scroll
2. browser_evaluate → function: "async (page) => { window.scrollTo(0, document.body.scrollHeight); }"
3. browser_wait_for → time: 2 (seconds for content to load)
4. browser_snapshot → get loaded content
5. Repeat 2-4 as needed
1. browser_navigate → form page
2. browser_snapshot → find field refs
3. browser_fill_form → fields: [
{name: "Email", type: "textbox", ref: "R123", value: "email@example.com"},
{name: "Phone", type: "textbox", ref: "R124", value: "555-1234"}
]
4. browser_click → submit button ref
5. browser_wait_for → confirmation text
The Playwright MCP can maintain logged-in sessions across Claude Code restarts:
# Setup with persistent browser profile
claude mcp add playwright -- npx @playwright/mcp@latest --user-data-dir ~/.playwright-data/pcp-browser
Benefits:
| Method | Output | Use For |
|---|---|---|
browser_snapshot | Accessibility tree (text) | Finding elements, extracting text, action refs |
browser_take_screenshot | Image file | Visual documentation, debugging |
Rule: Use browser_snapshot for actions, browser_take_screenshot for visuals.
| User Request | What To Do |
|---|---|
| "Check my Twitter mentions" | Navigate to twitter.com/notifications, snapshot |
| "Log in to X and check Y" | Login workflow, then navigate + snapshot |
| "Scroll through my feed" | Navigate, evaluate scroll, wait, snapshot |
| "Fill out this form" | Navigate, snapshot for refs, fill_form, click submit |
| "Screenshot my dashboard" | Navigate, wait for load, take_screenshot |
| "Click the button that says X" | Snapshot to find ref, click with ref |
| "What's on this page?" | If public: WebFetch. If login: browser + snapshot |
Browser not installed:
Error: Browser not found
→ Use browser_install tool
Element not found:
Error: Element ref not found
→ Run browser_snapshot first to get current refs
Login expired:
Content shows login page instead of expected content
→ Re-authenticate or use persistent user-data-dir
Browser automation works with PCP capabilities:
Extract → Capture: Get content via browser, capture to vault
content = browser_snapshot()
smart_capture(f"From Twitter feed: {content}")
Browser → Email: Draft email based on browser data
data = browser_get_form_data()
create_draft(to="x@y.com", subject="Form data", body=data)
Browser → Knowledge: Store permanent facts found in browser
price = extract_from_browser()
add_knowledge(f"Widget price is {price}", category="fact")