Debugging gets easier the more bugs you see. These examples feature real-world issues, as well as opportunities to hone your own debugging skills. Share your replays with us and we’ll add it to this page!
Record a bug once, reproduce it forever. Start with the Recording Bug Reports Guide.
HasReplay.io features GitHub issues with attached replays.
- Closed Issues are great examples of how replays were used to solve real-world bugs.
- Open Issues are great for diving into replays and debugging yourself.
The site also has a “buggy” mode that can be enabled by clicking the ✅ icon in the upper right corner. Record the site or use the replay here to practice debugging these issues!
Using Replay’s built-in developer tools to debug application issues.
Debug an element resize issue in Excalidraw.
Debug a React useEffect issue in Replay.
Debug a Redux dispatch issue in Replay.
- Video: Debugging a bug in GitHub
Use Replay to explore applications, whether you’re getting up to speed with a new project, reviewing changes, or just curious how something works.
Digging into the React front end of the open source hot.opensauced.pizza to understand how it updates based on user events.
Reviewing changes made by another developer in the HasReplay.io app to understand the new code.
Record any web or Node app with Replay to see what’s happening under the hood.
- Webinar Video: Debugging your Debugging Process by Cecelia Martinez (slides)
- Blog: Debugging CSS