DevRecorder: Chrome Extension Syncs Screen Recording with Console Logs and Network Requests for Bug Reporting
By
Shakil Hossain
17d ago· 1 min readenProduct
38/100
Stale
Bagelometer↗
Yesterday's bagel. Skim it, don't savour it.
Score38Typepress releaseSentimentpositive
Summary
DevRecorder is a Chrome extension that synchronizes screen recording with developer tools data (console logs, network requests, navigation events) on a single timeline. It allows developers to record bug reproduction steps and share a link where teammates can view the video alongside all technical logs and request data locked to specific frames. It works across localhost, staging, and production environments, and integrates with MCP and AI coding tools like Claude Code, Cursor, and Windsurf for structured context reading.
Key quotes
· 3 pulledDevRecorder is a Chrome extension that records your screen alongside console logs, network requests, and navigation events — all on one synchronized timeline.
Your team sees the video with every log, request header, response body, and route change locked to the exact frame.
Connect via MCP and AI tools like Claude Code, Cursor, and Windsurf can read your recordings as structured context.
DevRecorder is a Chrome extension that records your screen alongside console logs, network requests, and navigation events — all on one synchronized timeline. Hit record, reproduce a bug, and share a link. Your team sees the video with every log, request
