Back to Skills

vitest-midscene-e2e

Enhances Vitest with Midscene for AI-powered UI testing across Web (Playwright), Android (ADB), and iOS (WDA). Scaffolds new projects, converts existing projects, and creates/updates/debugs/runs E2E tests using natural-language UI interactions. Triggers: write test, add test, create test, update test, fix test, debug test, run test, e2e test, midscene test, new project, convert project, init project, 写测试, 加测试, 创建测试, 更新测试, 修复测试, 调试测试, 运行测试, 新建工程, 转化工程.

283stars22forksUpdated 8/4/2026

Security Assessment

Safe(92/100)
Security Score92/100

About vitest-midscene-e2e

vitest-midscene-e2e enhances the Vitest test framework with Midscene to build AI-powered, natural-language end-to-end UI tests across Web (Playwright Chromium), Android (ADB and scrcpy), and iOS (WebDriverAgent). It solves the brittleness of selector-based E2E tests: instead of decomposing a user flow into fragile taps and inputs, the tester passes plain-language intent to Midscene's agent, which plans and executes the interaction. The skill can scaffold new test projects, convert existing ones, and create, update, debug, and run tests, with bilingual (English and Chinese) trigger phrases.

The workflow starts by cloning a canonical boilerplate via a bundled script, then comparing the current project against it and filling in only what is missing for the platforms the user needs, without overwriting existing configs, and copying a .env.example to .env for the user to populate. Its central rule is that user-described UI steps must be implemented with the primary aiAct API rather than fine-grained aiTap/aiInput/aiAssert calls, letting the AI handle planning, assertions, data extraction, and waiting. It documents platform-specific agent classes that share the same AI methods, phase-splitting long prompts by page or stage boundaries, prompt-driven file uploads constrained to a fileChooserAllowedDir (explicitly discouraging the project root or home directory), an aiActionContext system-prompt option for setting tester expertise, common locator mistakes to avoid, and a troubleshooting reference for failures.

The target users are developers and QA engineers writing cross-platform E2E tests who want resilient, natural-language automation over Web, Android, and iOS. Running it requires configured environment variables (including AI model credentials for Midscene) and platform toolchains such as Playwright, ADB, or WebDriverAgent. The skill runs a clone script and drives test execution but is scoped to legitimate testing workflows, and it advises narrowing file-upload directories rather than exposing broad paths.

FAQ

Which platforms does it support?

Web via Playwright Chromium, Android via ADB and scrcpy, and iOS via WebDriverAgent. On Web you get both ctx.agent and ctx.page; on Android and iOS you get ctx.agent only. All three agents share the same AI methods.

How do I write a test step?

Pass the user's intent as natural language to aiAct, the primary API, rather than decomposing it into aiTap, aiInput, or aiAssert. aiAct also handles assertions, data extraction, and waiting; deprecated aiAction should be replaced with aiAct.

What setup is required?

Clone the boilerplate with the provided script, install dependencies, and configure a .env (copied from .env.example) with the required variables, including AI model credentials for Midscene. You also need the relevant platform toolchain (Playwright, ADB/scrcpy, or WebDriverAgent).

How are file uploads handled safely?

When an aiAct prompt uploads files, you pass fileChooserAllowedDir set to the smallest directory containing that test's fixtures. The skill explicitly says not to use the project root or a home directory.

What if a prompt covers many steps?

Split it into separate aiAct calls by page or stage boundary so the AI does not lose context mid-flow, while ensuring all phases together match the original intent. A troubleshooting reference covers debugging failures.

All Files

3 files
SKILL.md7.0 KB
View
scripts/clone-boilerplate.sh1.2 KB
View
references/troubleshooting.md2.2 KB
View

Install vitest-midscene-e2e

Download and extract the skill files to your .claude/skills/ directory.

Quick Setup:

  1. Copy the skill folder to .claude/skills/
  2. Claude will automatically detect and use the skill