kraleppa
LiveDebugger - tool for debugging LiveView apps
I’m happy to announce LiveDebugger v0.1.0! ![]()
LiveDebugger is a browser-based tool for debugging LiveView applications, designed to enhance your development experience. It gives you:
A detailed view of your LiveComponents tree
The ability to inspect assigns for LiveViews and LiveComponents
Tracing of their callback executions
The idea for LiveDebugger came up while developing a large-scale LiveView application for a client - we faced some challenges in tracking state changes and component interactions.
We plan to continue developing LiveDebugger, with new features like highlighting LiveComponents on the way. We’d love your feedback to help improve this tool for everyone!
Most Liked
srzeszut
Hey everyone! We officially released LiveDebugger v1.0.0 during ElixirConf EU in Malaga!
Reaching 1.0 means LiveDebugger is now stable and ready for everyday use. Over the past releases, we focused on solidifying the core features, improving reliability, and smoothing out the debugging experience. We also shipped v0.8.0 earlier, which introduced several improvements.
Here’s a summary of what’s new:
- Interactive Tutorial - We are releasing a comprehensive tutorial (the LiveDebugger Tour) to help you and your team get the absolute most out of the tool from day one. Check it out here on GitHub.
Highlights from v0.8.0:
- Open Callback in Editor - You can now jump straight to a callback’s implementation in your code editor directly from the debugger, making your workflow even faster.
- Improved Stability & Tracing - We’ve fixed endless reloads, resolved trace highlighting issues, and added a safeguard to automatically disable tracing if the heap size limit is reached.
Important Note on LiveView Versions: Starting with v1.0.0, LiveDebugger requires Phoenix LiveView v1.1.7 or higher. If your project is still running an older version of LiveView, no worries! You can simply use LiveDebugger v0.8.0, which still gives you full access to all of the features.
A huge thank you to everyone who tested, reported issues, and provided feedback throughout our early versions. You helped make this 1.0.0 release something truly special!
Happy debugging!
Check out our repo: GitHub - software-mansion/live-debugger: Tool for debugging LiveView applications · GitHub
For more details, check out our website: LiveDebugger: LiveView debugging made simple
kraleppa
LiveDebugger v0.3.0 Released! ![]()
The newest version of LiveDebugger is here, packed with powerful new features:
- Global Callback Traces: Get a comprehensive view of your components interactions.
- Callback Execution Time: Identify and optimize performance bottlenecks.
- Improved Debugging for Redirects and Errors: Troubleshoot with ease.
- Firefox Extension Support: Broaden your debugging capabilities across more browsers.
Check our roadmap for what’s coming next and join the LiveDebugger channel on elixir-lang Slack for support and feedback.
Happy debugging!
kraleppa
Hey everyone! ![]()
We just shipped LiveDebugger v0.6.0.
Here’s a summary of what’s new:
Inject Custom Events & Messages
Skip the manual setup of clicking through UIs or waiting for background jobs. You can now craft and send custom events or messages directly into your LiveView process to test handle_info and handle_event logic instantly.
Enhanced Callback Exceptions
LiveDebugger now captures and displays callback exceptions directly within the tool. View the exact error and stack trace the moment a crash occurs, keeping your debugging workflow entirely in the browser.
Revisited Highlighting
he revisited highlighting mechanism now extends beyond the node tree to include Active LiveViews and Streams. Simply hover over any item in the tool to instantly spotlight its corresponding element in the browser UI.
Support for Temporary Assigns
LiveDebugger supports temporary assigns, giving you full visibility into data that doesn’t stay in the socket.
Check out our repo: GitHub - software-mansion/live-debugger: Tool for debugging LiveView applications · GitHub
And if you’re interested in what’s coming next, check out the LiveDebugger website: LiveDebugger: LiveView debugging made simple
Popular in Announcing
Other popular topics
Categories:
Sub Categories:
Forums
Popular Tags
- #ecto
- #liveview
- #troubleshooting
- #learning-elixir
- #deployment
- #library
- #erlang
- #testing
- #genserver
- #mix
- #absinthe
- #remote-other
- #otp
- #plug
- #how-to-question
- #macros
- #postgres
- #channels
- #elixirconf
- #exunit
- #discussion
- #javascript
- #code-sync
- #podcasts
- #onsite
- #dialyzer
- #docker
- #authentication
- #umbrella
- #full-time-contract
- #podcasts-by-brainlid
- #ecto-query
- #elixir-ls
- #phoenix_html
- #iex
- #blog-post
- #graphql
- #genstage
- #ai
- #websockets
- #supervisor
- #advent-of-code
- #elixirconf-us
- #distillery
- #processes
- #forms
- #api
- #metaprogramming
- #security
- #performance








