loops!Visual Regression Until Match
Run Playwright or Percy visual snapshots on UI changes; fix unintended diffs until baselines match intentionally.
by loops!
Use loop copies the kickoff. Share copies the loop link. Open in Cursor / Claude Code only pre-fill that prompt — they do not install hook files. Download loop saves a README and kickoff into .cursor/loops/visual-regression-until-match/ — no hooks required. How it works
- Do not modify the check command or exit criteria to force success
- Do not skip, disable, or bypass checks to pass the exit condition
- If stuck after several iterations, stop and report blockers instead of gaming metrics
- Do not weaken, delete, or skip tests to make the suite pass
- Do not replace real assertions with trivial always-pass tests
- Prefer fixing production code over patching tests to go green
Two separate pieces
- Kickoff prompt — tells the agent the goal, check command, exit condition, and how to self-pace between passes.
- 1
Copy or open the kickoff prompt
Click Use loop to copy the kickoff into your clipboard. Open in Cursor and Open in Claude Code only open the agent with that prompt — they do not configure automation for you.
- 2
Paste into your coding agent
Start a chat in Cursor, Claude Code, Codex, or any agent. Paste the kickoff. The prompt includes the goal, iteration limit, shell check, and first step.
- 3
Agent self-paces until done
The agent runs the loop: act → run check command → read output → repeat until the exit condition is met or max iterations is reached. No install step is required for prompt-only loops.
Full guide with Cursor /loop notes: How to install loops
1. Run visual tests
Run visual regression tests. List screenshots that differ from baseline with component names.
npx playwright test --grep @visual
2. Fix or approve
If diffs are bugs, fix CSS/markup. If intentional, update snapshots only after verifying in report.
Start the "Visual Regression Until Match" loop. Goal: visual regression suite passes with intentional UI only Max iterations: 6 Between iterations run: npx playwright test --grep @visual Exit when: visual tests exit 0 Step 1: Run visual tests. Fix unintended UI diffs; update baselines only for deliberate design changes. Self-pace this loop. After each iteration, run the check command, read the output, and only continue if the exit condition is not met. Stop when the exit condition passes or max iterations is reached. Give a short status update each pass.
Related loops
Install and run the "Pre-Commit Guard" loop. Goal: block git commits when tests are failing. Between iterations run: npm test Exit when: tests exit 0 before each commit. Step 1: Before any git commit, run tests. Fix failures before committing.
Start the "Flaky Test Triage" loop. Goal: classify failing tests as flaky vs real and fix only real regressions Max iterations: 5 Between iterations run: npm test -- --testPathPattern=<failing-suite> Exit when: every failure is classified and real regressions are fixed or explicitly deferred Step 1: Run the failing suite multiple times. Classify each failure, fix real ones, and document flaky behavior. Self-pace this loop. After each iteration, run the check command, read the output, and only continue if the exit condition is not met. Stop when the exit condition passes or max iterations is reached. Give a short status update each pass.
Start the "Independent Verifier Pass" loop. Goal: build, lint, and tests pass under independent verification Max iterations: 8 Between iterations run: npm run build && npm run lint && npm test Exit when: all verifier commands exit 0 Step 1: Run build, lint, and tests as a verifier. Trust only command output, not prior claims. Self-pace this loop. After each iteration, run the check command, read the output, and only continue if the exit condition is not met. Stop when the exit condition passes or max iterations is reached. Give a short status update each pass.