md-pr-review — comment on rendered Markdown in pull requests

Try the live demo

GitHub makes you choose. You can read a Markdown pull request as a rendered preview, which is the only way to actually take in a table or a Mermaid diagram, or you can leave line comments, which only works on the raw diff. I review a lot of agent-written plan documents as pull requests, and switching between the two views to comment on what I'd just read got old fast.

What it does

A two-pane UI: a file tree on one side, the rendered preview on the other. Every block in the preview gets a "+" in the margin, or you can select a run of text directly, and either way the comment posts as a real GitHub review comment anchored to the right lines in the diff, not a comment bolted onto a screenshot of the rendering.

The interesting problems

The core problem is mapping a rendered block back to its source lines. The unified/remark pipeline keeps position data for every node as it parses Markdown, so a custom plugin stamps the start and end line onto every block element on the way through, and that's what a "+" on a rendered table row or list item resolves to.

The second problem is that GitHub's review API only accepts a line comment if the line sits inside the diff. A new file is entirely commentable. An edited file is not: a lot of what's rendered is untouched context outside any hunk. The tempting shortcut is to snap those comments to the nearest line inside the hunk, but that quietly attaches a comment to the wrong text. Anything outside the diff becomes a file-level comment quoting the passage instead, so it's always attached to something true, never silently mis-anchored.

A few other things needed deliberate handling: you can't approve your own pull request, so the review actions adjust when the viewer is also the author. And because the local server holds a live GitHub token, it checks the Host and Origin on every request and requires a random key generated at launch, while the untrusted PR HTML itself is sanitised so it can't forge the data attributes the comment layer relies on to find its anchors.

Status

Working prototype. Local mode reads a token from the GitHub CLI, so nothing touches the browser. There's also a demo mode with a sample pull request that shows the exact API request it would send, without a live token or a real repo to point it at.