Lets face it, debugging JavaScript can be the most painful part of web development at times. So we’ve decided to search for some good tools to debug JavaScript issues. Here’s our collection of 10 JS Online and Browser-based debugging tools. Have fun!

Related Posts:

Online Debugging Tools

1. Pastebin

Is a collaborative debugging tool allowing you to share and modify code snippets while chatting on IRC, IM or a message board.


Source + Demo

2. JSON Formatter and Validator

The JSON Formatter was created to help with debugging. As data expressed as JSON is often written without line breaks to save space, it became extremely difficult to actually read it. This tool hopes to solve the problem by formatting the JSON into data that is easily readable by human beings.

JSON Formatter and Validator

Source + Demo

3. JS Bin – Collaborative JavaScript Debugging

A web-application specifically designed to help JavaScript and CSS folk test snippets of code, within some context, and debug the code collaboratively. Allows you to edit and test JavaScript and HTML (reloading the URL also maintains the state of your code – new tabs doesn’t) – once you’re happy you can save.

JS Bin

Source + Demo

Browser-based Debugging Tools

4. Blackbird JavaScript Debug Helper

Alert()s are widely used to create checkpoints in JavaScript development. Blackbird offers a stylish console to log, view and filter messages in JavaScript, which quickens the development process by eliminating the pause at every alert and analyzing each better.


Source + Demo

5. JavaScript Shell

Is a command-line interface for JavaScript and DOM.

JavaScript Shell

Source + Demo

6. JSDT – JavaScript Debug Toolkit

JSDT is software that can debug JavaScript in IE, Firefox, Safari, Chrome, Opera, mobile IE browser and mobile Opera browser. It works in all browsers that support Ajax.


Source + Demo

7. CJS – Companion.JS JavaScript Debugger

CJS is a JavaScript debugger for Internet Explorer. Detailed JavaScript error reporting (call stack and real file name where the error occurred) and “Firebug”-like Console API feature.


Source + Demo

8. DebugBar – IE Extension for Web Developers

View DOM Tree and modify tags attributes and CSS attributes on the fly to test your page, view JavaScript functions for easier debugging, CSS inspector and more.


Source + Demo

9. Opera Dragonfly

Is a cross device, cross platform debugging environment for the Opera browser-debug JavaScript, inspect and edit CSS and the DOM, and view any errors on your mobile or computer.

Opera Dragonfly

Source + Demo

10. Venkman JavaScript Debugger

Venkman is the code name for Mozilla’s JavaScript Debugger. Venkman aims to provide a powerful JavaScript debugging environment for Mozilla based browsers.


Source + Demo

Sam Deering is a Front-end Web Developer who specialises in JavaScript & jQuery. Sam is driven and passionate about sharing his knowledge to educate others.

Free Guide:

How to Choose the Right Charting Library for Your Application

How do you make sure that the charting library you choose has everything you need? Sign up to receive this detailed guide from FusionCharts, which explores all the factors you need to consider before making the decision.

Special Offer
Free course!

Git into it! Bonus course Introduction to Git is yours when you take up a free 14 day SitePoint Premium trial.