meticulous-test — Claude Code skill: visual tests for frontend changes
Runs a Meticulous test run after a frontend change, then hands the result to meticulous-review so each visual diff gets classified.
npx skills add alwaysmeticulous/skills --skill meticulous-test -a claude-codeWhat meticulous-test does
The skill walks the agent through the whole loop: build the frontend the same way CI does, upload the artefact as a reusable deployment with agent upload-build, and capture the deploymentId. Then agent trigger-test-run compares that build against a base and prints a testRunId. The build is uploaded once — the same deploymentId can be re-triggered against a different base without rebuilding or re-uploading.
A base is required. The command infers it from the current directory (merge-base with the origin default branch) or takes --baseSha. By default the run blocks until it finishes, and a Failure status means visual differences were detected — a normal verdict, not an error. Pass --dontWaitForTestRunToComplete to return right away.
The catch is uncommitted changes. With a dirty working tree the run is recorded against an ephemeral commit rather than your HEAD, so commands that resolve a run from the local checkout won't find it — always pass --testRunId explicitly to the review step in that case. Untracked files are rejected, so git add them first. Before starting, the skill suggests running meticulous-cli-update unless it already ran earlier in the conversation.
What it helps with
- build the frontend the way CI does and upload the artefact in one step
- re-run a visual test against a different base without rebuilding
- classify each visual change as intended or unintended
- test a feature end-to-end before opening a PR, with changes still uncommitted
- capture the
testRunIdand hand it to the visual diff review
Example prompts for the agent
- run meticulous-test after my component changes and show me what shifted visually
- trigger a test run against the main base and hand the result to meticulous-review
- my working tree is dirty — run meticulous-test and pass --testRunId to the review
How to install meticulous-test
1Skills CLI (Vercel)
npx skills add alwaysmeticulous/skills --skill meticulous-test -a claude-code2Manually: put the files in place
~/.claude/skills/meticulous-test/SKILL.mdCopy the whole skill folder; for one project use .claude/skills/meticulous-test/
1Skills CLI (Vercel)
npx skills add alwaysmeticulous/skills --skill meticulous-test -a codex2Manually: put the files in place
.agents/skills/meticulous-test/SKILL.mdFor all projects use ~/.agents/skills/
1Skills CLI (Vercel)
npx skills add alwaysmeticulous/skills --skill meticulous-test -a cursor2Manually: put the files in place
.cursor/skills/meticulous-test/SKILL.mdCursor also reads .agents/skills/ and .claude/skills/
1GitHub CLI
gh skill install alwaysmeticulous/skills meticulous-test2Manually: put the files in place
.github/skills/meticulous-test/SKILL.md1Skills CLI (Vercel)
npx skills add alwaysmeticulous/skills --skill meticulous-test -a gemini-cli2Platform CLI
gemini skills install https://github.com/alwaysmeticulous/skills --path skills/meticulous-testManually: put the files in place
.devin/skills/meticulous-test/SKILL.mdThe legacy .windsurf/skills/ path still works
Skills CLI (Vercel)
npx skills add alwaysmeticulous/skills --skill meticulous-test -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 meticulous-test
How do I install meticulous-test in Claude?
Run npx skills add alwaysmeticulous/skills --skill meticulous-test -a claude-code. The skill lands at ~/.claude/skills/meticulous-test/SKILL.md.
What does meticulous-test do?
It guides the agent through building the frontend, uploading the artefact, triggering a Meticulous run, and passing the testRunId to the meticulous-review skill for classifying visual changes.
Why can't the review find my test run?
If you tested with uncommitted changes, the run is tied to an ephemeral commit instead of HEAD. Pass --testRunId explicitly to the review step in that case.
Source text
SKILL.md · ISC
--- name: meticulous-test description: Run a Meticulous test run after implementing a frontend change, then hand off to the `meticulous-review` skill to classify each visual change as intended or unintended. Uploads the build once — the same build can be re-triggered against different bases without rebuilding — and it works with uncommitted changes. Use when implementing a feature autonomously end-to-end before creating a PR. user-invocable: true --- To test a frontend change using Meticulous, follow the workflow below step by step, using the CLI or MCP commands as described. > Before starting, run the `meticulous-cli-update` skill to ensure the Meticulous CLI and skills are up to date — unless it has already run earlier in this conversation, in which case skip it. If you are already given a test run id, skip to Step 4. ## Step 1 -- Build the frontend 1. Find out what build artefact Meticulous expects by checking your CI config for the corresponding step: - GitHub: `.github/workflows/*.yml` for `uses: alwaysmeticulous/report-diffs-action/upload-assets@v1` (build assets) or `upload-container@v1` (docker image) - GitLab: `.gitlab-ci.yml` (or an included `.gitlab/ci/*.yml`) for `npx @alwaysmeticulous/cli ci upload-assets` (build assets) or `ci upload-container` (docker image) - Bitbucket: `bitbucket-pipelines.yml` for the same `npx @alwaysmeticulous/cli ci upload-assets` / `ci upload-container` step 2. Build the frontend following the same instructions as used in that CI config. ## Step 2 -- Upload the build Register the build as a reusable deployment with `agent upload-build`. This uploads the artefact and prints a `deploymentId` to stdout — it does **not** trigger a run yet. ```bash # CLI meticulous agent upload-build --appDirectory <path-to-build> # assets meticulous agent upload-build --localImageTag <image-tag> # container # MCP (not 1:1 — request an upload URL, upload the artifact yourself, then register it) request_asset_upload(size=<zipByteSize>) # or request_container_upload() — no required args # ... upload the zip/image to the returned URL/registry yourself ... register_asset_build(uploadId="<id>", commitSha="<sha>") # or register_container_build(uploadId="<id>", commitSha="<sha>") ``` - `--appDirectory` points to the build output directory (e.g. a `dist/` subfolder); `--localImageTag` is the local Docker image tag. The build mode is auto-detected. - The build's commit defaults to the local git HEAD. If the working tree is dirty, it is captured as an **ephemeral commit** (printed as `commitSha (local, ephemeral due to dirty working tree): …`) — see the uncommitted-changes note below. - Untracked files are rejected (they can't be captured) — `git add` them first. - Capture the `deploymentId` from stdout (pass `--verbose` to also see progress on stderr). ## Step 3 -- Trigger a test run Trigger a run for the deployment, comparing against a base. Run it from the repo directory to infer both the base (merge-base with the origin default branch) and the git diff automatically: ```bash # CLI meticulous agent trigger-test-run --deploymentId <deploymentId> # MCP (never infers `baseSha`/`gitDiffOutput` — pass them explicitly — and always returns immediately without waiting for the run to finish) trigger_test_run(deploymentId="<deploymentId>", baseSha="<sha>") ``` - A base is **required**. It's auto-inferred from the current directory, or pass `--baseSha <sha>` (and optionally `--gitDiffOutput`) to set it explicitly. - Omit `--deploymentId` to use the most recent deployment already uploaded for the local HEAD commit instead — this requires a clean working tree (no uncommitted changes). - The command **blocks until the run finishes** by default and prints the `testRunId` to stdout; the final status is `Failure` when visual differences were detected (a normal completed verdict, not an error). Pass `--dontWaitForTestRunToComplete` to return as soon as the run is triggered. - **One build, many bases:** the same `deploymentId` can be re-triggered against different bases — just run `agent trigger-test-run` again with a different `--baseSha`. No rebuild or re-upload needed. Note the `testRunId` from the output. ## Step 4 -- Review the visual changes Follow the `meticulous-review` skill, passing the `testRunId` from Step 3. It fetches the diff summary, inspects representative screenshots / DOM diffs / timelines, and produces a final report classifying each visual change as intended or unintended. > **Uncommitted changes:** if you built/tested with a dirty working tree, the run is recorded against an ephemeral commit that is not your HEAD (and isn't pushed). Commands that resolve a run from the local checkout — `meticulous-review` / `agent test-run-diffs` run with no `--testRunId` — won't find it by commit, so **always pass the explicit `--testRunId`** to the review step in that case.
© alwaysmeticulous · ISC · alwaysmeticulous/skills