alwaysmeticulous avatar

Meticulous Simulate And Diff

Runs a Meticulous session replay against a live URL and tells you what broke visually. You give it a session ID and optionally a base replay to diff against. With a base, it compares screenshots pixel by pixel and diffs the HTML snapshots so you can see both what changed visually and which DOM elements are responsible. Without a base it just captures screenshots for manual inspection. The HTML diff analysis is smart: it pulls the full page DOM from metadata files and highlights class changes and structural shifts, which usually map directly to the components you changed. Good for catching regressions before you push, especially if you're tweaking styles or layout and want to know exactly which routes got affected.

skills.sh installs
8.9K
GitHub stars
10
last updated
Aug 21, 2026

Install

$ npx -y skills add alwaysmeticulous/skills --skill meticulous-simulate-and-diff --agent claude-code

Installs into .claude/skills of the current project.

Files

Simulate a session and analyze diffs

This skill covers running a single simulation and interpreting the results. For the simulate command's full option reference see the meticulous-cli skill's simulate reference.

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.

Prerequisites

  • A sessionId to replay
  • An appUrl (local dev server, or leave blank to use the original recorded URL)
  • Optionally: a baseReplayId — the ID of a prior replay to diff screenshots against. Without this, screenshots are stored but not compared.

If you don't have a baseReplayId, you can find one from a downloaded test run:

meticulous download test-run --testRunId=latest
# Then inspect ~/.meticulous/test-runs/<testRunId>/coverage.json
# or check the testCases[].replayId fields

Step 1 — Run the simulation

With a base replay (diff mode)

meticulous simulate \
  --sessionId=<sessionId> \
  --appUrl=<url> \
  --baseReplayId=<baseReplayId> \
  --headless

Sponsors

Details

Repository
github.com/alwaysmeticulous/skills
Categories
Frontend Development, Git & Pull Requests, Design & UI/UX
First seen
Jul 14, 2026

More from alwaysmeticulous/skills

All 7
1anthropics avatarplaygroundanthropics/claude-plugins-officialCreates interactive HTML playgrounds — self-contained single-file explorers that let users configure something visually through controls, see a live preview, an8.6Kskills.sh installs
2vercel-labs avatardevtoolsvercel-labs/json-renderDrop-in inspector panel for any json-render app. Use when the user wants to debug a generative UI, inspect the spec tree, edit state at runtime, see dispatched 8.4Kskills.sh installs
3payloadcms avatarpayloadpayloadcms/skillsUse when working with Payload projects (payload.config.ts, collections, fields, hooks, access control, Payload API). Use when debugging validation errors, secur7.1Kskills.sh installs
4affaan-m avatarcoding-standardsaffaan-m/eccBaseline cross-project coding conventions for naming, readability, immutability, and code-quality review. Use detailed frontend or backend skills for framework-7Kskills.sh installs
5pixijs avatarpixijs-environmentspixijs/pixijs-skillsUse this skill when running PixiJS v8 outside a standard browser: Web Workers, OffscreenCanvas, Node/SSR, or CSP-restricted contexts. Covers DOMAdapter.set, Bro6.7Kskills.sh installs
6figma avatarfigma-generate-designfigma/mcp-server-guideUse this skill alongside figma-use when the task involves translating an application page, view, or multi-section layout into Figma. Triggers: 'write to Figma',6.4Kskills.sh installs