ios-device-automation — Claude Code skill: drive iOS from screenshots
This skill controls an iPhone or iPad through Midscene CLI, reading screenshots to decide the next tap. Useful when you need to check an app on a real device.
npx skills add web-infra-dev/midscene-skills --skill ios-device-automation -a claude-code
npx skills add web-infra-dev/midscene-skills --skill ios-automation -a claude-codeWhat ios-device-automation does
The skill hands the agent a set of npx -y @midscene/ios@1 commands: connect, take_screenshot, act, assert and runwdarequest. Everything runs off screenshots, so no DOM and no accessibility labels are needed — if an element is visible, it can be touched. A single act call covers tapping, typing, scrolling, dragging, two-finger zoom and system navigation like Home or the app switcher.
Device control goes through WebDriverAgent. When WDA is already running and the session was created outside Midscene, pass --wda-host, --wda-port and --session-id, then repeat those options on later commands. Do not run these commands in the background or chain several at once: the screenshot-analyze-act loop depends on reading each result first. One command takes roughly a minute, and a complex act can take longer, so a CI job with a tight per-step timeout is a bad fit.
Before the first run you need MIDSCENE_MODEL_API_KEY, MIDSCENE_MODEL_NAME, MIDSCENE_MODEL_BASE_URL and MIDSCENE_MODEL_FAMILY as environment variables or in a .env file in the working directory. The model has to be good at visual grounding. The examples use Gemini-3-Flash, Qwen 3.5, Doubao Seed 2.0 Lite, Zhipu GLM-4.6V and Gemini-3-Pro.
What it helps with
- walk a purchase flow on an iPhone and confirm the confirmation screen appears
- read the connected Wi-Fi network name from Settings without tapping by hand
- check a screen layout on an iPad where there is no DOM to query
- grab a screenshot of the current app state and reason about it
- run a QA check on a screen and fail with a readable message when the condition does not hold
Example prompts for the agent
- connect to the iPhone, open Settings, go to Wi-Fi and tell me which network it is on
- type hello world in the search field and press Enter
- assert that a login button is visible on screen
How to install ios-device-automation
1Skills CLI (Vercel)
npx skills add web-infra-dev/midscene-skills --skill ios-device-automation -a claude-codenpx skills add web-infra-dev/midscene-skills --skill ios-automation -a claude-code2Manually: put the files in place
~/.claude/skills/ios-automation/SKILL.mdCopy the whole skill folder; for one project use .claude/skills/ios-automation/
1Skills CLI (Vercel)
npx skills add web-infra-dev/midscene-skills --skill ios-automation -a codex2Manually: put the files in place
.agents/skills/ios-automation/SKILL.mdFor all projects use ~/.agents/skills/
1Skills CLI (Vercel)
npx skills add web-infra-dev/midscene-skills --skill ios-automation -a cursor2Manually: put the files in place
.cursor/skills/ios-automation/SKILL.mdCursor also reads .agents/skills/ and .claude/skills/
1GitHub CLI
gh skill install web-infra-dev/midscene-skills ios-automation2Manually: put the files in place
.github/skills/ios-automation/SKILL.md1Skills CLI (Vercel)
npx skills add web-infra-dev/midscene-skills --skill ios-automation -a gemini-cli2Platform CLI
gemini skills install https://github.com/web-infra-dev/midscene-skills --path skills/ios-automationManually: put the files in place
.devin/skills/ios-automation/SKILL.mdThe legacy .windsurf/skills/ path still works
Skills CLI (Vercel)
npx skills add web-infra-dev/midscene-skills --skill ios-automation -a opencodeClaude.ai
Zip the folder and upload it in Settings → Capabilities → Skills
Step by step, with commands for each platform: How to install skills in Claude Code: five ways
Questions about ios-device-automation
How do I install ios-device-automation in Claude?
Run npx skills add web-infra-dev/midscene-skills --skill ios-device-automation -a claude-code. The skill then lives at ~/.claude/skills/ios-automation/SKILL.md.
What does ios-device-automation do?
It drives an iOS device through Midscene CLI and WebDriverAgent: takes screenshots, performs actions described in plain language and checks the visible screen state. The agent picks each next step from the screenshot.
What has to be configured before the first run?
Four environment variables: MIDSCENE_MODEL_API_KEY, MIDSCENE_MODEL_NAME, MIDSCENE_MODEL_BASE_URL and MIDSCENE_MODEL_FAMILY. You can put them in a .env file in the working directory, which Midscene loads automatically.
Source text
SKILL.md · MIT
--- name: ios-device-automation description: | Vision-driven iOS device automation using Midscene CLI. Operates entirely from screenshots — no DOM or accessibility labels required. Can interact with all visible elements on screen regardless of technology stack. Control iOS devices with natural language commands via WebDriverAgent. Triggers: ios, iphone, ipad, ios app, tap on iphone, swipe, mobile app ios, ios device, ios testing, iphone automation, ipad automation, ios screen, ios navigate, test ios app, verify on iphone, QA on ipad, check the app on ios, test on ios device, see if the app works on iphone, end-to-end test on ios, visual verification on ios Powered by Midscene.js (https://midscenejs.com) allowed-tools: - Bash --- # iOS Device 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. Automate iOS devices using `npx -y @midscene/ios@1`. Each CLI command maps directly to an MCP tool — you (the AI agent) act as the brain, deciding which actions to take based on screenshots. ## What `act` Can Do Inside a single `act` call on iOS, Midscene can tap, double-tap, long-press, type, clear text, scroll, drag items, zoom with two fingers, press keys, and use system navigation such as Home or the app switcher while working from the current visible screen. ## Prerequisites Midscene requires models with strong visual grounding capabilities. The following environment variables must be configured — either as system environment variables or in a `.env` file in the current working directory (Midscene loads `.env` automatically): ```bash MIDSCENE_MODEL_API_KEY="your-api-key" MIDSCENE_MODEL_NAME="model-name" MIDSCENE_MODEL_BASE_URL="https://..." MIDSCENE_MODEL_FAMILY="family-identifier" ``` Example: Gemini (Gemini-3-Flash) ```bash MIDSCENE_MODEL_API_KEY="your-google-api-key" MIDSCENE_MODEL_NAME="gemini-3-flash" MIDSCENE_MODEL_BASE_URL="https://generativelanguage.googleapis.com/v1beta/openai/" MIDSCENE_MODEL_FAMILY="gemini" ``` Example: Qwen 3.5 ```bash MIDSCENE_MODEL_API_KEY="your-aliyun-api-key" MIDSCENE_MODEL_NAME="qwen3.5-plus" MIDSCENE_MODEL_BASE_URL="https://dashscope.aliyuncs.com/compatible-mode/v1" MIDSCENE_MODEL_FAMILY="qwen3.5" MIDSCENE_MODEL_REASONING_ENABLED="false" # If using OpenRouter, set: # MIDSCENE_MODEL_API_KEY="your-openrouter-api-key" # MIDSCENE_MODEL_NAME="qwen/qwen3.5-plus" # MIDSCENE_MODEL_BASE_URL="https://openrouter.ai/api/v1" ``` Example: Doubao Seed 2.0 Lite ```bash MIDSCENE_MODEL_API_KEY="your-doubao-api-key" MIDSCENE_MODEL_NAME="doubao-seed-2-0-lite" MIDSCENE_MODEL_BASE_URL="https://ark.cn-beijing.volces.com/api/v3" MIDSCENE_MODEL_FAMILY="doubao-seed" ``` Commonly used models: Doubao Seed 2.0 Lite, Qwen 3.5, Zhipu GLM-4.6V, Gemini-3-Pro, Gemini-3-Flash. If the model is not configured, ask the user to set it up. See [Model Configuration](https://midscenejs.com/model-common-config) for supported providers. ## Commands ### Connect to Device ```bash npx -y @midscene/ios@1 connect ``` If WebDriverAgent is already running and the session was created outside Midscene, pass the WDA endpoint and external session ID together: ```bash npx -y @midscene/ios@1 connect --wda-host 127.0.0.1 --wda-port 8100 --session-id <sessionId> ``` Use the same `--wda-host`, `--wda-port`, and `--session-id` options on later commands when you want them to operate through that existing WDA session. ### Launch an App, URL, or Deep Link Use the built-in launch capability when you want to start from a known app or route before the rest of the task. Give it the most specific target you have, such as a bundle ID, web URL, deep link, or phone/mail link. Typical targets include `com.apple.Preferences`, `https://www.apple.com`, `myapp://profile/user/123`, and `tel:+1234567890`. ### Send a Direct Device Request Use this when the task needs lower-level device control instead of a normal visible UI interaction: ```bash npx -y @midscene/ios@1 runwdarequest --method GET --endpoint /wda/screen ``` This does not run an ADB command. On iOS, the underlying operation is an HTTP request to WebDriverAgent, typically `GET http://<wdaHost>:<wdaPort>/session/<sessionId>/wda/screen`. ### Take Screenshot ```bash npx -y @midscene/ios@1 take_screenshot ``` After taking a screenshot, read the saved image file to understand the current screen state before deciding the next action. ### Perform Action Use `act` to interact with the device and get the result. It autonomously handles all UI interactions internally — tapping, typing, scrolling, swiping, waiting, and navigating — so you should give it complex, high-level tasks as a whole rather than breaking them into small steps. Describe **what you want to do and the desired effect** in natural language: ```bash # specific instructions npx -y @midscene/ios@1 act --prompt "type hello world in the search field and press Enter" npx -y @midscene/ios@1 act --prompt "tap Delete, then confirm in the alert dialog" # or target-driven instructions npx -y @midscene/ios@1 act --prompt "open Settings and navigate to Wi-Fi, tell me the connected network name" ``` ### Assert Current Screen State Use `assert` to verify that the current screen satisfies a natural language condition. It does not perform UI actions; it checks the visible screen state and passes only when the assertion is true. Use this for validation, QA checks, and final state verification after `act`. ```bash npx -y @midscene/ios@1 assert --prompt "there is a login button visible" npx -y @midscene/ios@1 assert --prompt "the settings screen shows Wi-Fi and Bluetooth options" ``` By default a failed assertion throws an AI-generated reason. Pass `--message` to throw a custom error message instead, which is useful for surfacing the intended outcome in QA and CI logs. ```bash npx -y @midscene/ios@1 assert \ --prompt "the order confirmation screen is visible" \ --message "the order should be confirmed after tapping Pay" ``` When the assertion needs to compare against a reference image (icon, logo, screenshot), pass `--image` for the URL/path and `--image-name` for its display name. Each `--image` may be an http(s) link, a `data:` URI, or a local file path. Repeat both flags in matching order when you need to attach more than one image. Add `--convertHttpImage2Base64 true` when the model cannot reach the URL directly. Requires `@midscene/[email protected]+`. ```bash npx -y @midscene/ios@1 assert \ --prompt "the visible app icon matches the supplied reference image" \ --image "https://github.githubassets.com/assets/GitHub-Mark-ea2971cee799.png" \ --image-name "icon" \ --convertHttpImage2Base64 true # or with a local file npx -y @midscene/ios@1 assert \ --prompt "the header on screen matches the local screenshot" \ --image "./fixtures/header.png" \ --image-name "header" # multiple reference images — pair --image and --image-name by order npx -y @midscene/ios@1 assert \ --prompt "the screen shows both the app icon and the header" \ --image "./fixtures/icon.png" --image-name "icon" \ --image "./fixtures/header.png" --image-name "header" ``` ### Record and Assert Transient UI Use a recording when the state to verify may disappear before a current-screen assertion runs, such as a toast, loading banner, animation, or transition: ```bash # Terminal 1: keep this foreground command running npx -y @midscene/ios@1 record start --device-id <udid> \ --output ./submission-observation.json # Terminal 2, while Terminal 1 records npx -y @midscene/ios@1 act --device-id <udid> \ --prompt "tap the Submit button" # Send Ctrl+C to Terminal 1 and wait for the saved-path message, then assert npx -y @midscene/ios@1 assert --device-id <udid> \ --record ./submission-observation.json \ --prompt "a success toast appeared during submission" ``` Pass target flags, capture flags, and `--output` to `record start`, then wait for `Recording. Press Ctrl+C to stop and save.` Keep the recorder as a foreground process in its dedicated terminal; never add shell `&`. Perform the interaction manually or from a second terminal, send Ctrl+C to the recorder, and wait until it prints the saved path before asserting. Recording uses the WDA MJPEG frame source when enabled and otherwise falls back to periodic screenshots. Optional capture flags are `--interval-ms`, `--max-frames`, and `--watchdog-ms`; `--max-frames` caps sampled frames, and the manifest may contain one additional final representative frame. The default watchdog finalizes and saves the recording after five minutes, while `--watchdog-ms 0` disables that safety limit. The output is a JSON manifest plus an adjacent `<name>.frames` image directory, not an encoded video or archive. The manifest contains relative JPEG/PNG paths and no base64 image bodies. Keep or move the JSON file and image directory together, and pass the JSON path to `assert --record`. Use ordinary `assert` without `--record` when only the current screen matters. ### Use a Reference Image for Precise Targeting When the user provides a screenshot, icon, logo, or reference image and wants an exact visual match, prefer `tap --locate` instead of a generic `act --prompt`. Pass `--locate` as JSON. The `prompt` describes the target, `images` supplies named reference images, and `convertHttpImage2Base64: true` is useful when the image URL may not be directly accessible to the model. ```bash npx -y @midscene/ios@1 tap --locate '{ "prompt": "tap the area contains the image", "images": [ { "name": "target image", "url": "https://github.githubassets.com/assets/GitHub-Mark-ea2971cee799.png" } ], "convertHttpImage2Base64": true }' ``` The same `locate` JSON shape also works for other commands that accept a `locate` parameter. ### Disconnect ```bash npx -y @midscene/ios@1 disconnect ``` ### Consume Report Files The generated HTML report is recommended for human reading first. It includes step-by-step execution details and replay videos for each operation, which makes it much easier to understand what happened and troubleshoot problems. If another skill or tool needs to consume the report, first convert it with `report-tool` from the same platform CLI package. Prefer Markdown for LLM-based workflows. Use JSON when the report needs to be processed programmatically. ```bash npx -y @midscene/ios@1 report-tool --action to-markdown --htmlPath ./midscene_run/report/.../index.html --outputDir ./output-markdown npx -y @midscene/ios@1 report-tool --action split --htmlPath ./midscene_run/report/.../index.html --outputDir ./output-data ``` ## Workflow Pattern Since CLI commands are stateless between invocations, follow this pattern: 1. **Connect** to establish a session 2. **Launch the target app and take screenshot** to see the current state, make sure the app is launched and visible on the screen. 3. **Execute action** using `act` to perform the desired action or target-driven instructions. Use `assert` for the resulting screen state, or keep `record start --output ...` running in a dedicated terminal during transient-state workflows, stop it with Ctrl+C, and then use `assert --record`. 4. **Disconnect** when done 5. **Report results** — summarize what was accomplished, present key findings and data extracted during the task, and list any generated files (screenshots, logs, etc.) with their paths ## Best Practices 1. **Be specific about UI elements**: Instead of vague descriptions, provide clear, specific details. Say `"the Settings icon in the top-right corner"` instead of `"the icon"`. 2. **Describe locations when possible**: Help target elements by describing their position (e.g., `"the search icon at the top right"`, `"the third item in the list"`). 3. **Never run in background**: Every midscene command must run synchronously — background execution breaks the screenshot-analyze-act loop. 4. **Batch related operations into a single `act` command**: When performing consecutive operations within the same app, combine them into one `act` prompt instead of splitting them into separate commands. For example, "open Settings, tap Wi-Fi, and check the connected network" should be a single `act` call, not three. This reduces round-trips, avoids unnecessary screenshot-analyze cycles, and is significantly faster. 5. **Choose the right verification window**: Use `assert --prompt "..."` for the current screen. For a toast, banner, animation, or transition, run `record start --output ...` in a dedicated terminal, perform the interaction, stop recording with Ctrl+C, wait for the saved-path message, then pass the artifact to `assert --record`. 6. **Always report results after completion**: After finishing the automation task, you MUST proactively present the results to the user without waiting for them to ask. This includes: (1) the answer to the user's original question or the outcome of the requested task, (2) key data extracted or observed during execution, (3) screenshots and other generated files with their paths, (4) a brief summary of steps taken. Do NOT silently finish after the last automation command — the user expects complete results in a single interaction. 7. **Prefer `tap --locate` when a reference image is provided**: If the user shares a screenshot, icon, or logo and wants that exact visual target, use `tap --locate` with a multimodal `locate` JSON object such as `{ "prompt": "...", "images": [...] }` instead of relying only on `act --prompt`. **Example — Alert dialog interaction:** ```bash npx -y @midscene/ios@1 act --prompt "tap the Delete button and confirm in the alert dialog" npx -y @midscene/ios@1 take_screenshot ``` **Example — Form interaction:** ```bash npx -y @midscene/ios@1 act --prompt "fill in the username field with 'testuser' and the password field with 'pass123', then tap the Login button" npx -y @midscene/ios@1 take_screenshot ``` ## Improve Precision (Deep Locate / Deep Think) Two optional global flags help when Midscene struggles with a task. Put them anywhere in the command (before or after the sub-command); once set, the relevant operations use them by default, so you don't pass a per-call parameter. - `--deep-locate` — spends an extra round of visual reasoning to pinpoint the target element. Use it when an action interacts with the wrong spot (location drift / offset). It applies to every operation that locates an element, including `tap --locate` and the locating that happens inside `act`. - `--deep-think` — plans `act` with deeper reasoning (richer context and sub-goal decomposition). Use it for complex, multi-step `act` instructions; it only affects planning. Both trade a little speed for better results, and you can combine them. ```bash # more accurate element location (helps act's internal locating too) npx -y @midscene/ios@1 act --deep-locate --prompt "tap the small back chevron in the top-left corner" # deeper planning for a complex, multi-step act npx -y @midscene/ios@1 act --deep-think --prompt "complete the multi-step signup form and submit" # combine both npx -y @midscene/ios@1 act --deep-locate --deep-think --prompt "open Settings, go to Display & Brightness, and turn on Dark Mode" ``` ## Troubleshooting ### WebDriverAgent Not Running **Symptom:** Connection refused or timeout errors. **Solution:** - Ensure WebDriverAgent is installed and running on the device. - If another tool created the WDA session, pass that session explicitly with `--session-id` plus the matching `--wda-host` and `--wda-port`. - See [https://midscenejs.com/usage-ios.html](https://midscenejs.com/ios-getting-started.html) for setup instructions. ### Device Not Found **Symptom:** No device detected or connection errors. **Solution:** - Ensure the device is connected via USB and trusted. ### API Key Issues **Symptom:** Authentication or model errors. **Solution:** - Check `.env` file contains `MIDSCENE_MODEL_API_KEY=<your-key>`. - See https://midscenejs.com/zh/model-common-config.html for details. ### `@midscene/*` Dependency Version Outdated **Symptom:** Unexpected behavior, missing features, or version mismatch errors. **Solution:** - Check local versions: `npm ls @midscene/ios @midscene/core @midscene/shared` (or `pnpm why @midscene/ios`). - Check latest versions: `npm view @midscene/ios version`, `npm view @midscene/core version`, `npm view @midscene/shared version`. - Upgrade dependencies: `npm i @midscene/ios@latest @midscene/core@latest @midscene/shared@latest`.
© web-infra-dev · MIT · web-infra-dev/midscene-skills