Javascript breakpoints in Visual Studio 2017

Question

I just installed Visual Studio 2017. After starting an ASP.NET MVC application I get the message that chrome debugging in Visual Studio is enabled.

But my breakpoints in Visual Studio won't hit. The breakpoints on Razor code seems to be working but Javascript does not. The breakpoints are not fully red like they should be. A restart, rebuild don't seem to take any effect.

I have the following code example

@Html.Partial("_Test", Model.Test) // debugging works here

<script>
    var i = 1;
    console.log(i); // debugging does not work here or above
</script>

@section scripts {
    <script>
        var a = 11;
        console.log(a); // debugging does not work here or above
    </script>
}

I don't have the chrome debugging console open and I checked the option in Visual Studio ('Enable Javascript debugging..') which is enabled.

According to this blog post I thought this should work: https://blogs.msdn.microsoft.com/webdev/2016/11/21/client-side-debugging-of-asp-net-projects-in-google-chrome/

Am I missing something here? Could it be that this is not working in Visual Studio 2017 somehow?

I only have one extension and that is Resharper, but I guess this is not an issue.

Answer 1

Two options you could try:

1. Turn off the "Enable JavaScript debugging for ASP.NET (Chrome and IE)" in VS options, and then use the debugger (F12) in your browser.
2. Start debugging in Visual Studio and then add your breakpoint(s) in Solution Explorer -> Internet Explorer -> <your view name>. (Assumes you are using IE)

Answer 2

After thinking the only way to get this working was to do a repair on Visual Studio 2017, using the installer, I realized that we had BundleTable.EnableOptimizations = true; in Bundle.config. I removed this line and added it to Web.Debug.config transformation and it started working as expected.

Answer 3

• Visual Studio Professional 2017 Version 15.8.1
• Chrome Version 68.0.3440.106 (Official Build) (64-bit)

I had to enable Legacy Chrome JavaScript debugger under:

Options -> Tools -> Debugging -> General -> Enable legacy Chrome JavaScript debugger for ASP.NET

Answer 4

It does work in vs 2017 only with enabling option "Enable Javascript Debugging for ASP.NET (Chrome and IE)" and setting debugger; in js code in *.cshtml as well as *.js file