Output from runtime errors, console.log, console.trace, console.time and network requests is displayed in your editor next to the relevant line of code. No more context switching to the browser dev tools console, or terminal output.
Logged values and runtime errors for a line of code are displayed in your editor hover tooltip. No need to leave your editor to see formatted values, full error messages, or navigable stack trace.
The log viewer shows all recorded logs and errors from your running application in chronological order. Log entries are expandable and contain clickable links to the target source code. The log viewer supports search across all recorded entry details.
Visualize network requests right next to the code paths making them. Quickly view network request details (URL, method, status, and request and response payloads) without leaving your editor. Formatted values are available in the log viewer.
Predictive Logging anticipates other data you need beyond what you have already logged, reducing the number of iterations adding new logs and rerunning your app. Never think "I wish I had logged that as well" again.
Logpoints allow you to log the value of any expression without modifying your code by simply adding a breakpoint. When applied to a line with a function or class, every line within that context will be logged. Code coverage is also displayed for lines of the context.
Log Viewer Pro provides indentation guides, expand/collapse and breadcrumb controls for efficient work with large objects. Filtering/highlighting makes it easy to focus on specific log entries, and is especially useful in scenarios with a lot of logs.
Watchpoints allow you to keep track of the latest value of any logged expression. While opened, the value can easily be monitored for any changes made to it as a result of your code modifications, or other actions in your app affecting the value.
Simply start your editor, and your development server or a test runner in watch mode, and see logged values next to your code. No config, no setup, no hassle.
Say goodbye to context switching and analyzing where a console log is coming from. Get logged values right where you need them - in your editor. See console log values right next to your code, or use the aggregated view to explore logged values and navigate between logs and code.
One of the fastest ways to understand what your code is doing is console.log. Unfortunately, it doesn't scale - multiple log statements quickly result in obscure unmanageable output. Console Ninja is specifically designed to keep console.log easy to use while making it scalable, providing an edit & continue REPL-like debug experience.
Console Ninja is brought to you with love by the Wallaby Team. The Community edition is free to use, and will always be free to use. In addition to the free Community edition, we offer a commercial 'Pro' edition of Console Ninja that provides a number of additional advanced features.
If you like Console Ninja, you may like to check out our other amazing JavaScript tools: Wallaby The Test Runner and Quokka The Playground.
Install the extension for VS Code
to start using Console Ninja.
For news and updates,
subscribe to our mailing list.