Debugging Angular application with Intellij Typescript debugger

I am trying to debug an Angular application from Intellij 2021. So I'm using Intellij's Typescript and Javascript debuggers.

My OS is Ubuntu. Node.js version v16.14.2.

I'm following this video tutorial. But I think that my project structure is different. In the video they seem to have two separate projects: a Java project for the back end, and an Angular project for the front end.

In my case both ends are in one project: It's a Java project in which the Angular project is in a folder within the Java project. I start both projects by sbt run from the Java project root.

And then Angular listens on port 4200, Java listens on port 9000.

So for debugging the Angular project, I start both projects with sbt run. I do it because I want the Java project to start.

According to the video, I now have to do in another terminal, from the Angular folder, npm start.

But wait! That would try to start another Angular project on Angular's default port 4200, to which another Angular process is already listening. So I do instead: npm start -- --port 4201. And accordingly I change the URL in the intellij's JavaScript Debug configuration to http://localhost:4201.

The Browser I chose in that configuration was Chrome, and I gave it the Chromium installation path.

Now, according to the video, when npm start -- --port 4201 is completed, I can start the debugger by clicking the green debug button.

But it does not work. 😟 After a few seconds I'm getting the message:

Waiting for connection to localhost: 39807.

Please ensure that the browser was started successfully with remote debugging port opened. Port cannot be opened if Chrome having the same User Data Directory is already launched.

I don't know where "39807" came from. In Intellij's settings > debugger > built-in server the port specified is a different number.

Any idea how to fix it?