Patchrooms for Cursor

Add visual feedback to your Cursor app

Cursor is an AI code editor where an agent edits your codebase and you run the app locally or on a preview deploy. Patchrooms layers element-anchored feedback on top, so every comment turns into agent-ready context.

Try the live demo

Why Cursor teams need visual feedback

  • Cursor edits your real codebase, so feedback needs to be precise enough to drive the next agent edit.
  • Bugs found by testers rarely arrive with a selector: they arrive as a vague Slack message.
  • Patchrooms collects element-anchored reports from your preview deploy and exports them as agent-ready context.
  • Drop a report into Cursor and the agent has the selector, screenshot, and goal it needs to fix the code.

How Patchrooms works with Cursor

  1. Embed Patchrooms on your preview deploy

    Add the script to your staging or preview build. Cursor keeps editing source; Patchrooms collects feedback on the running app.

  2. Capture reports from testers

    Testers click and comment on the live app. Each report carries the selector, screenshot, and console context.

  3. Drop the report into Cursor

    Paste the Markdown export into Cursor (or read it via the MCP server, available now) so the agent fixes the exact element.

What your agent receives

Each pinpoint comment exports as clean Markdown with the element selector, the page and viewport, and the console state alongside the ask.

## Feedback: Checkout submit button

Element: button[data-patchroom-id="checkout-submit"]
Page: /checkout · 1440×900 · Chrome 126

Issue
Stays clickable while required fields are empty and
submits an invalid form.

Expected
Disabled until the form is valid: reduced opacity
+ aria-disabled="true".

Console
POST /api/order 422 (validation_failed)

Add it in one prompt

Paste a script tagAdd in one prompt

Ask Cursor to wire Patchrooms in for you, paste this prompt:

Add the Patchrooms review widget to the app. Insert this script tag into the root HTML template before the closing </body> tag, exactly as written:

…then give it the snippet below. It loads on the live preview and turns on artifact-review mode: pinpoint comments anchored to the elements your reviewers click.

<script src="https://room.patchrooms.com/v1/patchrooms.js"
        data-project-key="pr_xxx"
        data-source="cursor"
        data-mode="artifact-review"></script>

Or try it locally: no account, no key, no server

Reviewing a Cursor artifact on your own machine? Run Patchrooms in local mode: no account, no project key, zero network calls. Pinpoint comments stay in your browser and export to Markdown you paste straight back into Cursor.

<script src="https://room.patchrooms.com/v1/patchrooms.js"></script>
<script>
  Patchrooms.init({ storage: 'local', mode: 'artifact-review' });
</script>

Review workflow

Share the preview link with your team or client. Anyone clicks an element, types a comment or records a voice note (Patchrooms auto-transcribes it to clean text), and captures the selector, a screenshot, and the page context. Every comment carries a status (new, triaged, in-progress, closed) so nothing falls through the cracks. See the full UI review workflow.

Export feedback to your AI agent

Each report exports as clean Markdown with the element selector, a screenshot reference, and the artifact goal and constraints. Paste it straight into Cursor and the agent fixes the exact issue: this is the heart of AI artifact review. The Patchrooms MCP server lets agents read reports directly (list_reports / get_report) and triage them (set_status). Available now; extended MCP tools (create_room, issue creation) are planned, and a @patchrooms/react package is coming for tighter React integration.

FAQ

How does Patchrooms get feedback into Cursor?
Export any report as Markdown and paste it into Cursor as context, or let agents read reports directly over the Patchrooms MCP server (available now). Status writes (set_status) are available now; extended MCP tools are planned.