JavaScript Debugger

Debug JavaScript code in your browser with breakpoints, console output, and variable inspection

About JavaScript Debugger

Overview

The JavaScript Debugger is a powerful browser-based tool that allows you to write, run, and debug JavaScript code directly in your browser. Set breakpoints by clicking on line numbers, inspect variables when execution pauses, and view console output in real-time. Perfect for learning JavaScript, testing code snippets, or debugging small scripts without setting up a development environment.

Features

  • Monaco Editor (same editor as VS Code) with syntax highlighting
  • Breakpoint support - click line numbers to set/remove breakpoints
  • Variable inspection when paused at breakpoints
  • Console output capture (console.log, console.error, console.warn)
  • Code execution in isolated Web Worker for security
  • File upload and download support
  • Built-in code snippets library for quick examples
  • Fullscreen editor mode for better focus
  • Dark mode support with theme synchronization
  • Completely browser-based - no server required
  • Your code never leaves your device
  • Responsive design for mobile and desktop

How to Use

  1. Write or paste your JavaScript code in the Monaco editor
  2. Click on line numbers in the gutter to set breakpoints (red dots will appear)
  3. Click "RUN CODE" to execute your code
  4. When execution pauses at a breakpoint, inspect variables in the Variables panel
  5. Click "CONTINUE" to resume execution or "STOP" to terminate
  6. View console.log output in the Console panel below
  7. Upload .js files or use code snippets to get started quickly

FAQ

How do breakpoints work in this debugger?

Click on any line number to set a breakpoint. When you run your code, execution will pause at that line. The Variables panel will show all local variables at that point. Click "CONTINUE" to resume execution. Breakpoints are shown as red dots in the editor gutter.

Can I debug asynchronous code?

Yes, you can debug async/await code and promises. Set breakpoints inside async functions and the debugger will pause when those lines are reached. However, setTimeout and setInterval may have limited support due to the Web Worker environment.

Is my code safe when using this debugger?

Yes, your code runs in an isolated Web Worker that has no access to the main page or your browsing data. All execution happens locally in your browser, and your code never leaves your device. The worker environment provides a secure sandbox for code execution.

What JavaScript features are supported?

The debugger supports modern JavaScript including ES6+ features like arrow functions, destructuring, async/await, classes, and modules. However, DOM manipulation and browser APIs may be limited since code runs in a Web Worker without direct DOM access.

Can I save my code for later?

Yes, use the "Download .js" button to save your code as a JavaScript file. You can then upload it later using the "Upload File" button or drag and drop. The code is saved locally on your device.