agent-browser

작성자: qu-skills

inference.sh를 통한 AI 에이전트용 브라우저 자동화. @e 참조를 사용하여 웹 페이지 탐색, 요소와 상호작용, 스크린샷 촬영, 비디오 녹화. 기능: 웹 스크래핑, 양식 작성, 클릭, 타이핑, 드래그 앤 드롭, 파일 업로드, JavaScript 실행. 용도: 웹 자동화, 데이터 추출, 테스트, 에이전트 브라우징, 연구. 트리거: 브라우저, 웹 자동화, 스크래핑, 탐색, 클릭, 양식 작성, 스크린샷, 웹 브라우징, Playwright, 헤드리스 브라우저, 웹 에이전트, 인터넷 서핑, 비디오 녹화

npx skills add https://github.com/qu-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

qu-skills의 다른 스킬

ai-video-generation
qu-skills
inference.sh CLI를 통해 Google Veo, Seedance 2.0, HappyHorse, Wan, Grok 및 40개 이상의 모델로 AI 비디오를 생성합니다. 모델: Veo 3.1, Veo 3, Seedance 2.0, HappyHorse 1.0, Wan 2.5, Grok Imagine Video, OmniHuman, Fabric, HunyuanVideo. 기능: 텍스트-비디오, 이미지-비디오, 참조-비디오, 비디오 편집, 립싱크, 아바타 애니메이션, 비디오 업스케일링, 폴리 사운드. 사용처: 소셜 미디어 비디오, 마케팅 콘텐츠, 설명 비디오, 제품 데모, AI 아바타. 트리거: 비디오 생성, AI 비디오,...
videocreativemedia
remotion-render
qu-skills
React/Remotion 컴포넌트 코드를 inference.sh를 통해 비디오로 렌더링합니다. TSX 코드를 전달하면 MP4를 받을 수 있습니다. useCurrentFrame, useVideoConfig, spring, interpolate, AbsoluteFill, Sequence 등 모든 Remotion API를 지원합니다. 해상도, FPS, 지속 시간, 코덱을 설정할 수 있습니다. 사용 사례: 프로그래매틱 비디오 생성, 애니메이션 그래픽, 모션 디자인, 데이터 기반 비디오, React 애니메이션을 비디오로 변환. 트리거: remotion, 코드에서 비디오 렌더링, tsx를 비디오로, react 비디오, 프로그래매틱 비디오, remotion 렌더, 코드를 비디오로, 애니메이션...
developmentvideocreative
ai-image-generation
qu-skills
GPT-Image-2, FLUX, Gemini, Grok, Seedream, Reve 및 inference.sh CLI를 통해 50개 이상의 모델로 AI 이미지를 생성합니다. 모델: 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
ai-avatar-video
qu-skills
inference.sh CLI를 통해 AI 아바타 및 토킹 헤드 영상을 생성합니다. 권장: P-Video-Avatar (가장 빠르고 저렴하며 TTS 내장). 추가: OmniHuman, Fabric, PixVerse. 오디오: Inworld TTS-2 (100개 이상 언어, 캐릭터 감정 조절), ElevenLabs, Kokoro. 기능: 오디오 기반 아바타, 텍스트-투-아바타, 립싱크 영상, 토킹 헤드 생성, 가상 프레젠터, UGC 콘텐츠. 용도: AI 프레젠터, 설명 영상, 가상 인플루언서, 더빙, 마케팅 영상, UGC 광고, 게이밍 아바타,...
videocreativemedia
twitter-automation
qu-skills
inference.sh CLI를 통해 게시, 참여, 사용자 관리로 Twitter/X를 자동화합니다. 앱: x/post-tweet, x/post-create (미디어 포함), x/post-like, x/post-retweet, x/dm-send, x/user-follow. 기능: 트윗 게시, 콘텐츠 예약, 게시물 좋아요, 리트윗, DM 전송, 사용자 팔로우, 프로필 조회. 사용처: 소셜 미디어 자동화, 콘텐츠 예약, 참여 봇, 오디언스 성장, X API. 트리거: twitter api, x api, tweet automation, post to twitter, twitter bot, social media automation, x...
api
web-search
qu-skills
Tavily와 Exa를 통해 inference.sh CLI로 웹 검색 및 콘텐츠 추출. 앱: Tavily Search, Tavily Extract, Exa Search, Exa Answer, Exa Extract. 기능: AI 기반 검색, 콘텐츠 추출, 직접 답변, 리서치. 용도: 리서치, RAG 파이프라인, 사실 확인, 콘텐츠 수집, 에이전트. 트리거: 웹 검색, tavily, exa, search api, 콘텐츠 추출, 리서치, 인터넷 검색, ai 검색, 검색 어시스턴트, 웹 스크래핑, rag, perplexity 대안
researchweb-scrapingapi
agent-tools
qu-skills
inference.sh CLI를 통해 250개 이상의 AI 앱 실행 - 이미지 생성, 비디오 제작, 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
developmentapicreative
python-executor
qu-skills
Execute Python code in a safe sandboxed environment via [inference.sh](https://inference.sh). Pre-installed: NumPy, Pandas, Matplotlib, requests, BeautifulSoup, Selenium, Playwright, MoviePy, Pillow, OpenCV, trimesh, and 100+ more libraries. Use for: data processing, web scraping, image manipulation, video creation, 3D model processing, PDF generation, API calls, automation scripts. Triggers: python, execute code, run script, web scraping, data analysis, image processing, video editing, 3D...
developmentdata-analysisweb-scraping