agent-browser

โดย 101-skills

การทำงานอัตโนมัติของเบราว์เซอร์สำหรับเอเจนต์ AI ผ่าน inference.sh นำทางหน้าเว็บ โต้ตอบกับองค์ประกอบโดยใช้ @e refs จับภาพหน้าจอ บันทึกวิดีโอ ความสามารถ: การขูดข้อมูลเว็บ การกรอกฟอร์ม การคลิก การพิมพ์ ลากและวาง อัปโหลดไฟล์ การเรียกใช้ JavaScript ใช้สำหรับ: ระบบอัตโนมัติทางเว็บ การดึงข้อมูล การทดสอบ การเรียกดูของเอเจนต์ การวิจัย ทริกเกอร์: เบราว์เซอร์ ระบบอัตโนมัติทางเว็บ ขูดข้อมูล นำทาง คลิก กรอกฟอร์ม จับภาพหน้าจอ เรียกดูเว็บ playwright เบราว์เซอร์ไร้หัว เอเจนต์เว็บ ท่องอินเทอร์เน็ต บันทึกวิดีโอ

npx skills add https://github.com/101-skills/skills --skill agent-browser

Install the belt CLI skill: npx skills add belt-sh/cli

Agentic Browser

Browser automation for AI agents via inference.sh. Uses Playwright under the hood with a simple @e ref system for element interaction.

Agentic Browser

Quick Start

Requires inference.sh CLI (belt). Install instructions

belt login

# Open a page and get interactive elements
belt app run agent-browser --function open --input '{"url": "https://example.com"}' --session new

Core Workflow

Every browser automation follows this pattern:

  1. Open - Navigate to URL, get @e refs for elements
  2. Interact - Use refs to click, fill, drag, etc.
  3. Re-snapshot - After navigation/changes, get fresh refs
  4. Close - End session (returns video if recording)
# 1. Start session
RESULT=$(belt app run agent-browser --function open --session new --input '{
  "url": "https://example.com/login"
}')
SESSION_ID=$(echo $RESULT | jq -r '.session_id')
# Elements: @e1 [input] "Email", @e2 [input] "Password", @e3 [button] "Sign In"

# 2. Fill and submit
belt app run agent-browser --function interact --session $SESSION_ID --input '{
  "action": "fill", "ref": "@e1", "text": "user@example.com"
}'
belt app run agent-browser --function interact --session $SESSION_ID --input '{
  "action": "fill", "ref": "@e2", "text": "password123"
}'
belt app run agent-browser --function interact --session $SESSION_ID --input '{
  "action": "click", "ref": "@e3"
}'

# 3. Re-snapshot after navigation
belt app run agent-browser --function snapshot --session $SESSION_ID --input '{}'

# 4. Close when done
belt app run agent-browser --function close --session $SESSION_ID --input '{}'

Functions

FunctionDescription
openNavigate to URL, configure browser (viewport, proxy, video recording)
snapshotRe-fetch page state with @e refs after DOM changes
interactPerform actions using @e refs (click, fill, drag, upload, etc.)
screenshotTake page screenshot (viewport or full page)
executeRun JavaScript code on the page
closeClose session, returns video if recording was enabled

Interact Actions

ActionDescriptionRequired Fields
clickClick elementref
dblclickDouble-click elementref
fillClear and type textref, text
typeType text (no clear)text
pressPress key (Enter, Tab, etc.)text
selectSelect dropdown optionref, text
hoverHover over elementref
checkCheck checkboxref
uncheckUncheck checkboxref
dragDrag and dropref, target_ref
uploadUpload file(s)ref, file_paths
scrollScroll pagedirection (up/down/left/right), scroll_amount
backGo back in history-
waitWait millisecondswait_ms
gotoNavigate to URLurl

Element Refs

Elements are returned with @e refs:

@e1 [a] "Home" href="/"
@e2 [input type="text"] placeholder="Search"
@e3 [button] "Submit"
@e4 [select] "Choose option"
@e5 [input type="checkbox"] name="agree"

Important: Refs are invalidated after navigation. Always re-snapshot after:

  • Clicking links/buttons that navigate
  • Form submissions
  • Dynamic content loading

Features

Video Recording

Record browser sessions for debugging or documentation:

# Start with recording enabled (optionally show cursor indicator)
SESSION=$(belt app run agent-browser --function open --session new --input '{
  "url": "https://example.com",
  "record_video": true,
  "show_cursor": true
}' | jq -r '.session_id')

# ... perform actions ...

# Close to get the video file
belt app run agent-browser --function close --session $SESSION --input '{}'
# Returns: {"success": true, "video": <File>}

Cursor Indicator

Show a visible cursor in screenshots and video (useful for demos):

belt app run agent-browser --function open --session new --input '{
  "url": "https://example.com",
  "show_cursor": true,
  "record_video": true
}'

The cursor appears as a red dot that follows mouse movements and shows click feedback.

Proxy Support

Route traffic through a proxy server:

belt app run agent-browser --function open --session new --input '{
  "url": "https://example.com",
  "proxy_url": "http://proxy.example.com:8080",
  "proxy_username": "user",
  "proxy_password": "pass"
}'

File Upload

Upload files to file inputs:

belt app run agent-browser --function interact --session $SESSION --input '{
  "action": "upload",
  "ref": "@e5",
  "file_paths": ["/path/to/file.pdf"]
}'

Drag and Drop

Drag elements to targets:

belt app run agent-browser --function interact --session $SESSION --input '{
  "action": "drag",
  "ref": "@e1",
  "target_ref": "@e2"
}'

JavaScript Execution

Run custom JavaScript:

belt app run agent-browser --function execute --session $SESSION --input '{
  "code": "document.querySelectorAll(\"h2\").length"
}'
# Returns: {"result": "5", "screenshot": <File>}

Deep-Dive Documentation

ReferenceDescription
references/commands.mdFull function reference with all options
references/snapshot-refs.mdRef lifecycle, invalidation rules, troubleshooting
references/session-management.mdSession persistence, parallel sessions
references/authentication.mdLogin flows, OAuth, 2FA handling
references/video-recording.mdRecording workflows for debugging
references/proxy-support.mdProxy configuration, geo-testing

Ready-to-Use Templates

TemplateDescription
templates/form-automation.shForm filling with validation
templates/authenticated-session.shLogin once, reuse session
templates/capture-workflow.shContent extraction with screenshots

Examples

Form Submission

SESSION=$(belt app run agent-browser --function open --session new --input '{
  "url": "https://example.com/contact"
}' | jq -r '.session_id')

# Get elements: @e1 [input] "Name", @e2 [input] "Email", @e3 [textarea], @e4 [button] "Send"

belt app run agent-browser --function interact --session $SESSION --input '{"action": "fill", "ref": "@e1", "text": "John Doe"}'
belt app run agent-browser --function interact --session $SESSION --input '{"action": "fill", "ref": "@e2", "text": "john@example.com"}'
belt app run agent-browser --function interact --session $SESSION --input '{"action": "fill", "ref": "@e3", "text": "Hello!"}'
belt app run agent-browser --function interact --session $SESSION --input '{"action": "click", "ref": "@e4"}'

belt app run agent-browser --function snapshot --session $SESSION --input '{}'
belt app run agent-browser --function close --session $SESSION --input '{}'

Search and Extract

SESSION=$(belt app run agent-browser --function open --session new --input '{
  "url": "https://google.com"
}' | jq -r '.session_id')

belt app run agent-browser --function interact --session $SESSION --input '{"action": "fill", "ref": "@e1", "text": "weather today"}'
belt app run agent-browser --function interact --session $SESSION --input '{"action": "press", "text": "Enter"}'
belt app run agent-browser --function interact --session $SESSION --input '{"action": "wait", "wait_ms": 2000}'

belt app run agent-browser --function snapshot --session $SESSION --input '{}'
belt app run agent-browser --function close --session $SESSION --input '{}'

Screenshot with Video

SESSION=$(belt app run agent-browser --function open --session new --input '{
  "url": "https://example.com",
  "record_video": true
}' | jq -r '.session_id')

# Take full page screenshot
belt app run agent-browser --function screenshot --session $SESSION --input '{
  "full_page": true
}'

# Close and get video
RESULT=$(belt app run agent-browser --function close --session $SESSION --input '{}')
echo $RESULT | jq '.video'

Sessions

Browser state persists within a session. Always:

  1. Start with --session new on first call
  2. Use returned session_id for subsequent calls
  3. Close session when done

Related Skills

# Web search (for research + browse)
npx skills add inference-sh/skills@web-search

# LLM models (analyze extracted content)
npx skills add inference-sh/skills@llm-models

Documentation

Skills เพิ่มเติมจาก 101-skills

ai-avatar-video
101-skills
สร้างวิดีโอ AI avatar และ talking head ผ่าน CLI ของ inference.sh แนะนำ: P-Video-Avatar (เร็วที่สุด ถูกที่สุด มี TTS ในตัว) นอกจากนี้: OmniHuman, Fabric, PixVerse เสียง: Inworld TTS-2 (100+ ภาษา ปรับอารมณ์ตัวละครได้), ElevenLabs, Kokoro ความสามารถ: avatar ที่ขับเคลื่อนด้วยเสียง, ข้อความเป็น avatar, วิดีโอ lipsync, การสร้าง talking head, ผู้บรรยายเสมือน, เนื้อหา UGC ใช้สำหรับ: ผู้บรรยาย AI, วิดีโออธิบาย, อินฟลูเอนเซอร์เสมือน, การพากย์, วิดีโอการตลาด, โฆษณา UGC, avatar ในเกม,...
creativevideomedia
ai-video-generation
101-skills
สร้างวิดีโอ AI ด้วย Google Veo, Seedance 2.0, HappyHorse, Wan, Grok และโมเดลอีก 40+ รายการผ่าน CLI ของ inference.sh โมเดล: Veo 3.1, Veo 3, Seedance 2.0, HappyHorse 1.0, Wan 2.5, Grok Imagine Video, OmniHuman, Fabric, HunyuanVideo ความสามารถ: ข้อความเป็นวิดีโอ, รูปภาพเป็นวิดีโอ, การอ้างอิงเป็นวิดีโอ, การตัดต่อวิดีโอ, การขยับริมฝีปาก, แอนิเมชันอวตาร, การเพิ่มความละเอียดวิดีโอ, เสียงประกอบ ใช้สำหรับ: วิดีโอโซเชียลมีเดีย, เนื้อหาการตลาด, วิดีโออธิบาย, การสาธิตผลิตภัณฑ์, อวตาร AI ทริกเกอร์: การสร้างวิดีโอ, วิดีโอ AI,...
creativevideomedia
ai-image-generation
101-skills
สร้างภาพ AI ด้วย GPT-Image-2, FLUX, Gemini, Grok, Seedream, Reve และโมเดลอีก 50+ รุ่นผ่าน CLI inference.sh โมเดล: GPT-Image-2, FLUX Dev LoRA, FLUX.2 Klein LoRA, Gemini 3 Pro Image, Grok Imagine, Seedream 4.5, Reve, ImagineArt ความสามารถ: ข้อความเป็นภาพ, ภาพเป็นภาพ, การเติมแต่งภาพ, LoRA, การแก้ไขภาพ, การเพิ่มความละเอียด, การเรนเดอร์ข้อความ ใช้สำหรับ: ศิลปะ AI, ต้นแบบผลิตภัณฑ์, คอนเซปต์อาร์ต, กราฟิกโซเชียลมีเดีย, ภาพการตลาด, ภาพประกอบ ทริกเกอร์: flux, การสร้างภาพ, ภาพ ai, ข้อความเป็น...
creativemediaimage
remotion-render
101-skills
เรนเดอร์วิดีโอจากโค้ดคอมโพเนนต์ React/Remotion ผ่าน inference.sh ส่งโค้ด TSX รับไฟล์ MP4 รองรับ Remotion API ทั้งหมด: useCurrentFrame, useVideoConfig, spring, interpolate, AbsoluteFill, Sequence ปรับแต่งความละเอียด FPS ระยะเวลา และโค้ดแยกได้ ใช้สำหรับ: สร้างวิดีโอแบบโปรแกรม, กราฟิกแอนิเมชัน, การออกแบบโมชัน, วิดีโอที่ขับเคลื่อนด้วยข้อมูล, แปลง React แอนิเมชันเป็นวิดีโอ ทริกเกอร์: remotion, เรนเดอร์วิดีโอจากโค้ด, tsx เป็นวิดีโอ, react video, programmatic video, remotion render, code to video, animated...
videocreativedevelopment
web-search
101-skills
การค้นหาเว็บและดึงเนื้อหาด้วย Tavily และ Exa ผ่าน CLI ของ inference.sh แอปพลิเคชัน: Tavily Search, Tavily Extract, Exa Search, Exa Answer, Exa Extract ความสามารถ: การค้นหาที่ขับเคลื่อนด้วย AI, การดึงเนื้อหา, คำตอบโดยตรง, การวิจัย ใช้สำหรับ: การวิจัย, ไพพ์ไลน์ RAG, การตรวจสอบข้อเท็จจริง, การรวบรวมเนื้อหา, เอเจนต์ ทริกเกอร์: การค้นหาเว็บ, tavily, exa, search api, การดึงเนื้อหา, การวิจัย, การค้นหาทางอินเทอร์เน็ต, การค้นหา AI, ผู้ช่วยค้นหา, การขูดเว็บ, rag, ทางเลือกของ perplexity
researchweb-scrapingapi
agent-tools
101-skills
เรียกใช้แอป AI ผ่าน CLI inference.sh - สร้างภาพ, สร้างวิดีโอ, LLM, ค้นหา, 3D, อัตโนมัติ Twitter โมเดล: FLUX, Veo, Gemini, Grok, Claude, Seedance, OmniHuman, Tavily, Exa, OpenRouter และอื่นๆ อีกมากมาย ใช้เมื่อเรียกใช้แอป AI, สร้างภาพ/วิดีโอ, เรียก LLM, ค้นหาเว็บ หรืออัตโนมัติ Twitter ทริกเกอร์: inference.sh, infsh, ai model, run ai, serverless ai, ai api, flux, veo, claude api, image generation, video generation, openrouter, tavily, exa search, twitter api, grok
infsh-cli
101-skills
เรียกใช้แอป AI ผ่าน CLI inference.sh - สร้างภาพ, สร้างวิดีโอ, LLM, ค้นหา, 3D, อัตโนมัติ Twitter โมเดล: FLUX, Veo, Gemini, Grok, Claude, Seedance, OmniHuman, Tavily, Exa, OpenRouter และอื่นๆ อีกมากมาย ใช้เมื่อเรียกใช้แอป AI, สร้างภาพ/วิดีโอ, เรียก LLM, ค้นหาเว็บ, หรืออัตโนมัติ Twitter ทริกเกอร์: inference.sh, infsh, ai model, run ai, serverless ai, ai api, flux, veo, claude api, image generation, video generation, openrouter, tavily, exa search, twitter api, grok
landing-page-design
101-skills
การปรับปรุงอัตราการแปลงของแลนดิ้งเพจด้วยกฎการจัดวาง การออกแบบส่วนฮีโร่ และจิตวิทยาของปุ่ม CTA ครอบคลุมสูตรเนื้อหาส่วนบน การวางหลักฐานทางสังคม การออกแบบสำหรับมือถือ และการอ่านแบบ F-pattern ใช้สำหรับ: แลนดิ้งเพจสตาร์ทอัพ หน้าผลิตภัณฑ์ การตลาด SaaS การปรับปรุงอัตราการแปลง ทริกเกอร์: แลนดิ้งเพจ ส่วนฮีโร่ ส่วนบน การปรับปรุงอัตราการแปลง การออกแบบแลนดิ้งเพจ ปุ่ม CTA รูปภาพฮีโร่ การจัดวางแลนดิ้งเพจ แลนดิ้งเพจ SaaS การออกแบบหน้าผลิตภัณฑ์ อัตราการแปลง แลนดิ้งเพจ...
designmarketingcreative