deltaview

Review a branch where it renders.

Run /deltaview feat/checkout and your app opens in Chrome with an outline on every element the branch changes. Read each diff, approve or reject it, and post one GitHub review.

/plugin marketplace add DavidAEriksson/deltaview
/plugin install deltaview@deltaview
A real run on a demo shop's feat/checkout-summary branch: the order summary is rejected because the shipping rule is duplicated, the other four items are approved, and Finish closes the review.

A green build of 77 files tells you the branch works. It doesn't tell you where to look.

So you pull it and click around wherever you suspect trouble. Deltaview turns that into a checklist: every changed hunk is pinned to something on screen or listed separately, and nothing gets skipped without saying so.

What happens when you run it

> /deltaview feat/checkout-summary
[1/4] Check out
worktree at .deltaview/wt/feat-checkout-summary
copied .env, .env.local (not read)

The branch goes into a temporary worktree, so your own checkout is never touched.

[2/4] Install and test
pnpm install --frozen-lockfile
pnpm test: 214 passed, 2 failed

Dependencies install from your lockfile and your tests run. Failures are reported in the review, not fixed, and don't stop it.

[3/4] Anchor
41 hunks grouped into 12 items
8 direct, 2 indirect, 2 backstage

Claude reads the diff, groups the hunks and finds the element each group affects. It navigates and reads the page; it never clicks.

[4/4] Review
opened localhost:4500 in Chrome

Your app opens behind a small proxy that draws the overlays. Step through the items from the keyboard, compare against the base version side by side or check them at phone width, then click Finish review.

Every change lands in one of three places

Each hunk belongs to exactly one item. The outline tells you how directly it reaches the screen.

Direct

The changed code renders something. The outline sits on that element.

Indirect

The change is in a hook, handler or util that something on screen triggers. The outline sits on the trigger and shows the chain.

Backstage

Migrations, CI, config, or UI hidden behind an interaction. Listed in a drawer and marked as not visually verified.

Finish review leaves two things behind

A review on the pull request for the people, and a manifest for the next agent.

you requested changes
src/checkout/Summary.tsx
- <FreeShippingBanner />
Rejected: the banner is still referenced in the cart drawer.

Posted through your gh login. Rejections and comments land inline, on the line you picked; approvals are listed in the review body. One rejection requests changes; all approved approves.

.deltaview/reviews/feat-checkout-summary.json
{
  "ref": "feat/checkout-summary",
  "tests": { "passed": 214, "failed": 2 },
  "items": [
    { "tier": "direct",
      "route": "/checkout",
      "decision": "rejected",
      "comment": "banner still used in cart" },
    …
  ]
}

Written as JSON and Markdown after every decision. Run /deltaview:fix to work through the rejected items, then review again: decisions on unchanged items carry over. Stop halfway and run the command again to resume.

What it won't touch

Your app's data
The agent only navigates by URL, scrolls and reads. No clicks, so no side effects against your backend.
Your working copy
Everything runs in a worktree. The only writes are to .deltaview/, which is added to .git/info/exclude.
Your secrets
.env files are copied byte for byte and never printed. New env vars are reported by name only.
Your trust
Anything it couldn't put on screen is marked not visually verified, in the overlay, on GitHub and in the manifest.

Install

  • Claude Code with the Claude in Chrome extension
  • Node.js 20 or later
  • A web project whose dev server already runs locally
  • gh signed in, to post reviews (optional)
/plugin marketplace add DavidAEriksson/deltaview
/plugin install deltaview@deltaview

Then run /deltaview <branch>. Read the setup guide