Claron Live Review

Claron Live Review brings your visual QA, annotation, and developer feedback tools directly onto any staging, preview, or live website. No complex reverse proxies, frames, or hosted environments required. By running as a native browser extension, Claron seamlessly bypasses authentication gates and corporate firewalls, letting your product, QA, and engineering teams review live apps together in real-time. KEY CAPABILITIES: • Visual QA & Annotation: Hover and click directly on any element on the page to report bugs. Highlight, circle, and annotate issues in-context. • Opaque Source Attribution: Integrates with @claron/sdk to read element hashes (data-claron-id) at build time, resolving front-end bugs back to the exact file path and line number (e.g., components/Button.tsx:42:10) on your dashboard. • Interactive Console & Network Logs: Automatically captures console warnings, errors, and failed network calls at the exact moment a bug is submitted. • Pixel-Perfect Screenshot Cropping: Dynamically takes a screenshot and crops it exactly to the bounding box of the selected element. • Live Cursor Collaboration: Connects via secure WebSockets to synchronize user cursors and actions, making live review walkthrough sessions highly collaborative. • Verify Fix Flow: Automatically runs visual regression and diff checks against previous annotations when new code is deployed. HOW IT WORKS: 1. Install this extension. 2. Open any web application matching a registered Claron project. 3. Click "Start Session" to open the floating toolbar and begin annotating. 4. Review submitted annotations on your Claron Developer Dashboard with complete source map, stack trace, and device details. Maximize alignment between QA and Engineering. End the cycle of "cannot reproduce" forever with Claron.