Javascript - How to debug Javascript remotely from IDEA in Chrome/Firefox

About

This page shows you how to debug Javascript remotely from IDEA in Chrome/Firefox.

Steps

Prerequisites / Configuration

Chrome/Firefox Extension

Idea Built In Web Server

  • Configure it in the chrome extension. If the default port of the built-in server (63342) is already bound (for instance, if some IDE is already running) the next free port is used (usually 63343).

Idea Chrome Extension Options

Idea Plugin

Idea Plugin Javascript Debugger

Run

In the run/debug windows, before starting the run, you need to map the first part of the URL (https://hostname:port) to the location in your project.

Idea Javascript Debug Run Configuration

Debug

When starting a run debug, you can see by opening the devtool (F12) that the debug session in the browser is in sync with the debug session inside IDEA.

  • The debug session in the browser

Idea Chrome Debug Session Started

  • The debug session in IDEA

Idea Debug Session Javascript

Documentation





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