In this post, we are going to explore how to debug client-side script in Visual Studio 2017 using Chrome, and how to disable it.
Debugging client-side script using IDE is the most exciting feature of Visual Studio 2017. Rrecently, I have updated my IDE and after creating a new ASP.NET Core application, I noticed a splash screen before starting the application. ![Visual Studio 2017]()
Soon, I realized about this new exciting feature and decided to explain it to others. This screen is nothing but the information about debugging script in Visual Studio.
Set breakpoint in JavaScript/TypeScript in Visual Studio
Here we go. Let’s write someJS code in Site.js file.
-
- function sum() {
- var value = (1 + 2);
- console.log(value);
- };
Set breakpoint like in the below screen, using IDE in JS file.
![Visual Studio 2017]()
It hit the breakpoint while reloading the page. In Internet Explorer, this will hit on initial page loading. Use (F10/F11) to continue debugging.
![Visual Studio 2017]()
Automatically break on the script errors
Let’s create an error. Update the previous function in JS file. The below code snippet will cause a range error at runtime.
- function sum() {
- var value = (1 + 2);
- console.log(value);
- var num = 1;
- num.toPrecision(500);
- };
Press F5 using IE, like in the below screen. It’ll automatically hit the break point when the script error occurs.
![Visual Studio 2017]()
Opening "Developer tools" in Chrome stops the script debugging session.
![Visual Studio 2017]()
As you can see, when switching to the Developer tools in Google Chrome, the application stops debugging.
![Visual Studio 2017]()
Disable Debugging
Go to Tools -> Options -> Debugging -> General
![Visual Studio 2017]()
Uncheck/Clear the setting "Enable JavaScript Debugging for ASP.NET (Chrome and IE)".
![Visual Studio 2017]()
Get more on it here.
Hope this will help.