Can I use this for automated QA testing?

Absolutely. It is specifically designed to verify, validate, and test frontend UI behavior, and it can take screenshots for visual verification of your test results.

Do I need to know CSS selectors to use this skill?

No. This skill uses vision-driven automation based on screenshots, allowing you to describe elements in natural language (e.g., 'click the blue login button') rather than using code-based selectors.

Is the browser session lost after every command?

No. When using the default Puppeteer mode, the browser process persists in the background across CLI calls, ensuring you don't lose your session or page state between steps.

What models are required for this skill to work?

This skill requires models with strong visual grounding capabilities, such as Gemini 1.5 Pro/Flash, Qwen 2.5-VL, or Doubao Seed 2.0. You must configure your API keys in the environment variables.

Can this skill interact with my existing browser sessions?

Yes. By using CDP (Chrome DevTools Protocol) or Bridge mode, the skill can connect to your active Chrome browser, allowing it to work with sites where you are already logged in.

Vision Browser Automation

Name: Vision Browser Automation
Author: web-infra-dev

byweb-infra-dev

•

153

•

브라우저 자동화

Automates web browsing, data extraction, and UI testing using AI-powered vision that operates directly from screenshots without requiring DOM selectors.

The Vision Browser Automation skill integrates Midscene.js into Claude Code, enabling sophisticated web interactions through visual analysis. Unlike traditional automation tools that rely on brittle CSS selectors or XPaths, this skill uses AI to 'see' and interact with page elements just like a human would. It supports three distinct modes: headless Puppeteer for isolated tasks, CDP for controlling your existing Chrome instance, and Bridge mode via a browser extension. Whether you need to scrape complex data, automate form filling, or perform visual QA on a new frontend build, this skill provides a robust, natural language interface for multi-step web workflows.

주요 기능

01153 GitHub stars

02Automated data extraction and structured scraping from dynamic websites

03Persistent browser sessions that maintain state across multiple CLI calls

04Vision-driven interaction using screenshots instead of brittle DOM selectors

05Natural language 'act' command for complex, multi-step web workflows

06Flexible connection modes including Puppeteer, CDP, and Bridge Extension

사용 사례

01Performing end-to-end visual QA and functional testing on web applications

02Automating repetitive web tasks like form submissions or account setups

03Extracting data from complex websites where traditional scraping methods fail

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add web-infra-dev/midscene-skills browser

For use in Claude.ai and ChatGPT

주요 기능

01153 GitHub stars

02Automated data extraction and structured scraping from dynamic websites

03Persistent browser sessions that maintain state across multiple CLI calls

04Vision-driven interaction using screenshots instead of brittle DOM selectors

05Natural language 'act' command for complex, multi-step web workflows

06Flexible connection modes including Puppeteer, CDP, and Bridge Extension

사용 사례

01Performing end-to-end visual QA and functional testing on web applications

02Automating repetitive web tasks like form submissions or account setups

03Extracting data from complex websites where traditional scraping methods fail