MCPInstall

argos-pr-review

Review Argos visual regression builds as one input to a pull request review. Use when a PR has an Argos build link, an Argos status check, or a bot comment pointing to an Argos build, and you need to decide whether the visual diffs match the developer's intent before approving.

Installs
761
Last 24h
—
Trending rank
—
Security
Not audited

Install

Works with every agent the skills CLI supports.

npx skills add https://github.com/argos-ci/argos-javascript --skill argos-pr-review
  1. 01

    Install

    Run the command in your project. The CLI asks which agents to install for.

  2. 02

    Describe the task

    Ask your agent for something this skill covers. It loads argos-pr-review automatically when relevant.

  3. 03

    Review the result

    The agent follows the SKILL.md steps, scripts and references bundled with the skill.

SKILL.md

The instructions your agent reads when the skill is triggered.

Argos PR Review

Argos is a visual testing platform: each CI build captures screenshots and compares them to a baseline, producing per-snapshot diffs. A build with changes-detected is waiting for a human (or you) to decide whether each change is intentional, a regression, or a flaky capture.

Treat the Argos build as one input to the PR review, never the sole source of truth. Infer the intended UI change from the PR title, description, linked issue, and code diff first, then use Argos to confirm the rendered result matches.

Tooling & auth

Drive Argos through the argos CLI — load the argos-cli skill for the token model and flags. In short: build get / build snapshots need a project token (ARGOS_TOKEN/--token); submitting a review or comment needs a personal access token (--token / argos login). Always use --json when parsing, and never print token values. If no PAT is available, give the user your conclusion and evidence instead of posting — the CLI can't submit the review.

Workflow

  1. Inspect the build — argos build get <ref> --json. Decide from status:

    StatusMeaning / next step
    accepted / no-changesAlready approved / no visual diff — no review needed
    pending / progressNot ready — stop and report it can't be reviewed yet
    changes-detectedNeeds a decision — fetch snapshots
    rejected / error / aborted/ expiredDon't approve until the cause is understood
  2. Fetch what changed — argos build snapshots <ref> --needs-review --json. For each diff inspect url (diff mask), base.url (before), head.url (after), and head.metadata, plus the flakiness signals test.metrics and, on a change, change.occurrences / change.ignored (used in step 3).

  3. Judge each diff against the inferred intent:

    • Intentional — matches the code change and renders cleanly.

    • Regression — broken layout/overlap, clipping, wrong state/theme/route, missing content, or a removed snapshot with no matching test removal.

    • Flaky — weigh two independent signals; when they agree, call it flaky with confidence:

      • Test history — test.metrics.flakiness (0 stable → 1 flaky) and change.occurrences (how many times this exact diff has recurred over the metrics period). A high flakiness score or a recurring change is strong evidence the diff is environmental noise, not this PR's work; stability (builds without a change), consistency (do changes repeat identically), and uniqueChanges explain why it scores that way. change.ignored: true is already known-flaky and auto-approved — never read it as a regression.
      • This capture — a spinner/skeleton, async content not yet loaded, mid-animation, drifting dynamic values, head.metadata.test.retry > 0, or identical score/head.url across browsers (both captured the same transient state). retries (the configured budget) is not itself a signal.

      Conversely, a stable test (flakiness→0, high stability, a first-time change) that changed is more likely intentional or a real regression — don't dismiss it as flaky on the visuals alone. Tune the window with build snapshots --metrics-period <24h|3d|7d|30d|90d> (default 7d).

  4. Comment on specific diffs — the highest-value output of an agent review. A binary approve/reject is cheap; specific, anchored feedback is what makes an agent review worth reading. For each problem diff, post a comment that names what's wrong and how to fix it, anchored to that snapshot:

    argos comment create <ref> --token <pat> --diff <screenshotDiffId> \
      --body "Loader still visible — capture runs before data loads. Wait for settled content (or mark the loader aria-busy)."
    
    • <screenshotDiffId> is the diff id from build snapshots --json.
    • Pin to a region with --anchor-lines <from,to> or --anchor-point <x,y> (normalized 0–1); reply in a thread with --reply-to <commentId>.
    • Use --draft to bundle comments into your pending review, then submit them together in the next step.
  5. Submit the review (or report if no PAT is available):

    • Approve: argos review create <ref> --token <pat> --event approve
    • Request changes: argos review create <ref> --token <pat> --event reject --body "<summary>"
    • Neutral note only: --event comment --body "<summary>"
    • Add --project owner/project for build-number refs (not URLs).
    • Silence a confirmed recurring flake so it stops blocking future builds: argos change ignore <change.id> --token <pat> --project owner/project (reverse with change unignore). Only ignore flakes the metrics confirm — never to bypass a real diff; prefer a code fix (references/flaky-fixes.md) when one exists.
    • Lead with the inferred intent, the snapshots reviewed, and the evidence. In the PR, cite the build URL and affected snapshot names; for flakes, name the signal and recommend a fix.

References

  • references/baseline.md — baseline selection and orphan-build semantics (load when the review depends on which baseline was used).
  • references/flaky-fixes.md — concrete code fixes for flaky captures (aria-busy, data-visual-test, animation stabilization).

FAQ

What does the argos-pr-review skill do?

Review Argos visual regression builds as one input to a pull request review. Use when a PR has an Argos build link, an Argos status check, or a bot comment pointing to an Argos build, and you need to decide whether the visual diffs match the developer's intent before approving.

How do I install argos-pr-review?

Run npx skills add https://github.com/argos-ci/argos-javascript --skill argos-pr-review in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/argos-pr-review/ (personal) or .claude/skills/argos-pr-review/ (project).

Which AI agents can use argos-pr-review?

Any agent that supports the open Agent Skills format (a folder with a SKILL.md file), including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, Windsurf, Cline, OpenCode and more.

Is argos-pr-review safe to install?

No partner security audit is available yet. Skills can run commands and scripts, so read the SKILL.md and any bundled files before installing.

Who maintains argos-pr-review?

It is published by argos-ci in argos-ci/argos-javascript. It has 761 recorded installs.

More from argos-ci/argos-javascript

View all →

argos-cli

argos-ci/argos-javascript

Operate Argos visual testing from the terminal with the argos CLI — inspect builds and snapshot diffs, submit reviews, request reviewers, post comments, inspect a test's flakiness and its recurring changes, ignore flaky test changes, configure a project and its contributors, manage a team's members, invites and email domains, manage automation rules, fetch analytics, upload screenshots, and manage CI builds. Use whenever running argos commands or working with Argos builds, snapshots, flakiness, projects, teams, or visual-regression reviews from a shell, script, or CI pipeline. Load before running argos — it covers the token model and JSON output contract that prevent silent failures.

Testing & QA761 installs

Popular code quality & workflow skills

View category →

grill-me

mattpocock/skills

A relentless interview to sharpen a plan or design.

Scan a codebase for deepening opportunities, present them as a visual HTML report, then grill through whichever one you pick.

handoff

mattpocock/skills

Compact the current conversation into a handoff document for another agent to pick up.

domain-modeling

mattpocock/skills

Build and sharpen a project's domain model. Use when discussing codebase terminology, writing or editing a GLOSSARY.md, or recording or editing an ADR.

codebase-design

mattpocock/skills

Shared vocabulary for designing deep modules. Use when the user wants to design or improve a module's interface, find deepening opportunities, decide where a seam goes, make code more testable or AI-navigable, or when another skill needs the deep-module vocabulary.

diagnosing-bugs

mattpocock/skills

Diagnosis loop for hard bugs and performance regressions. Use when the user says "diagnose"/"debug this", or reports something broken/throwing/failing/slow.