How to work with the Javascript Browser debugger (Chrome, Firefox, ...)


This article talks about the Javascript debugger present in the browser and shows you how to use it.

Steps by Step

The debugger keyword

The first and easiest way to use the browser debugger is to add inside your Javascript the debugger keyword.


  • Add the debugger word in your code where you want your breakpoint. Example:
// code before
// code after
  • Open the devtool (if the devtool is opened after the page load, the HTML is not present and the debugger will not show the code while debugging)
  • Refresh the page (F5)
  • The debugger should stop and open the source tab on the line of the debugger keyword.

Chrome Breakpoint

Add a breakpoint

You may also add a breakpoint by right clicking on the script line.

Discover More
Javascript Debugger Keyword In Devtool
Javascript - Debugger

in Javascript source map file In the debugger window, you can set breakpoints in the JavaScript code. If you put the debugger keyword in a script and that you open the devtool, browser debugger...

Share this page:
Follow us:
Task Runner