verify-ui-change
Installation
SKILL.md
Verify the change in the running app
You edited something a user can see. Nothing is proven until the real app has done it and something other than the DOM agrees.
This uses Reticle, which embeds a dev-only SDK in the user's running app and exposes it as reticle_* MCP tools. No screenshots, no browser download for the verify loop, no dev server of its own.
1. Are the tools here?
reticle_session({ action: "list" })
- A session comes back → go to step 2.
- Tools do not exist → Reticle is not installed. Run
RETICLE_INSTALL_SOURCE=npx_skill npx @reticlehq/server@latest init, then keep going without the tools: fix every⚠it printed, start the project's own dev script in the background if nothing is serving the app, and open it withnpx @reticlehq/server open <the url the dev server is serving>. Only once the app is running and connected, ask for the one thing you cannot do yourself: a client restart, so it picks up the MCP server. Stopping at theinitcommand leaves the user with config files and an uninstrumented page. Full setup is in theinstall-and-verifyskill. - Tools exist, list is empty → read the
whyfield on the response. It distinguishes "no app running" from "an app is running that never dialled this daemon" from "a tab was here and closed", and each has a different fix. If no app is running, start the project's own dev script frompackage.jsonin the background yourself and tell the user in one line that it is running and how to stop it: never a second one, never a guessed command, never kill anything, and the permission prompt is your host's. If one IS running, the app is not the missing piece and the SDK is; do not send the user to start what they already started.
2. Name the consequence BEFORE you act
This is the whole method. An expectation written after you see the result can be talked into agreeing with whatever happened; one written before cannot.