This is vision-driven browser automation that works from screenshots instead of the DOM, powered by Midscene.js. It runs in headless Puppeteer by default, but can also connect to your existing Chrome via CDP or a browser extension to preserve login sessions. The skill handles clicks, form fills, scrolling, and multi-step workflows by analyzing what's actually visible on screen. One thing to know: it requires a vision model (Gemini, Qwen, Doubao) configured via environment variables, and commands run one at a time since each step involves AI inference on screenshots. Use this when you need to scrape data, test UI, or automate web tasks without wrestling with selectors or accessibility trees.

skills.sh installs
5.4K
GitHub stars
321
last updated
Aug 21, 2026

Install

$ npx -y skills add web-infra-dev/midscene-skills --skill browser-automation --agent claude-code

Installs into .claude/skills of the current project.

Files

Browser Automation

CRITICAL RULES — VIOLATIONS WILL BREAK THE WORKFLOW:

  1. Never run midscene commands in the background. Each command must run synchronously so you can read its output (especially screenshots) before deciding the next action. Background execution breaks the screenshot-analyze-act loop.
  2. Run only one midscene command at a time. Wait for the previous command to finish, read the screenshot, then decide the next action. Never chain multiple commands together.
  3. Allow enough time for each command to complete. Midscene commands involve AI inference and screen interaction, which can take longer than typical shell commands. A typical command needs about 1 minute; complex act commands may need even longer.
  4. Always report task results before finishing. After completing the automation task, you MUST proactively summarize the results to the user — including key data found, actions completed, screenshots taken, and any relevant findings. Never silently end after the last automation step; the user expects a complete response in a single interaction.

Sponsors

Details

Repository
github.com/web-infra-dev/midscene-skills
Categories
Frontend Development, Testing & QA, DevOps & CI/CD, Debugging, Automation & Workflows, Design & UI/UX
First seen
May 16, 2026

More from web-infra-dev/midscene-skills

All 8
1samber avatarcrxjssamber/cc-skillsCRXJS Chrome extension development — true HMR for popup, options, content scripts, side panels, manifest-driven builds, dynamic content script imports (`?script5.1Kskills.sh installs
2medusajs avatarstorefront-best-practicesmedusajs/medusa-agent-skillsALWAYS use this skill when working on ecommerce storefronts, online stores, shopping sites. Use for ANY storefront component including checkout pages, cart, pay5Kskills.sh installs
3composiohq avatarartifacts-buildercomposiohq/awesome-claude-skillsSuite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for4.8Kskills.sh installs
4tw93 avataruitw93/wazaProduces distinctive, production-grade UI for pages, components, visual interfaces, typography, and screenshot-driven polish. Use when users ask in any language4.7Kskills.sh installs
5grafana avatarapp-observabilitygrafana/skillsGet RED metrics + service maps + frontend RUM + AI/LLM monitoring out of Grafana Cloud — Application Observability (`traces_spanmetrics_*` from OTel traces, p504.7Kskills.sh installs
6cosscom avatarcosscosscom/cossHelps implement coss UI components correctly. Use when building UIs with coss primitives (buttons, dialogs, selects, forms, menus, tabs, inputs, toasts, etc.), 4.7Kskills.sh installs