Just My Code for ASP.NET in Visual Studio 2013

Just My Code for ASP.NET in Visual Studio 2013

Rate This
  • Comments 14

Posting this on behalf of Patrick Nelson who is a developer on the Visual Studio Debugger team, and also thanks to Rob Paveza for his help with both of our post regarding JavaScript Just My Code

Do you develop web apps? Do you hate when the debugger keeps stopping in code you don’t care about? Are you tired of accidently stepping into JQuery? In Visual Studio 2013 with Internet Explorer 11, we’ve added Just My Code for JavaScript to help with these very problems.

In our previous blog post we announced Just My Code for JavaScript and discussed it in the context of Windows Store apps. In this complementary blog post I will cover the addition of Just My Code for JavaScript when debugging ASP.NET applications in Visual Studio 2013 using Internet Explorer 11 (NOTE:  Just My Code requires both Visual Studio 2013 and Internet Explorer 11, the JavaScript Just My Code feature will not work with prior versions of Internet Explorer).

I’m going to run through some examples in this post. If you want to try them yourself, create a new ASP.NET Web Application. I created an MVC app via New Project -> Visual C# -> Web -> ASP.NET Web Application. After hitting “OK”, select MVC and “OK” again.

Create a new script file name Test.js in the “Scripts” folder with this content:

function test1() {
    var result = 1;
    $([5, 10, 20, 40]).each(function (index, item) {
        result *= item;
    });

    alert("Result = " + result);
}

function test2() {
    try
    {
        var a = undefinedFunction();
    }
    catch(e)
    {
        Debug.writeln("Caught exception " + e);
    }
}

In about.cshtml, add the following html code:

<script src="http://blogs.msdn.com/Scripts/Test.js" type="text/javascript"></script>
<li>
      <a onclick="test1()">Run test1</a>
</li>
<li>
      <a onclick="test2()">Run test2</a>
</li>

Stepping into JQuery

Set a breakpoint in Test.js line 3 ($([5, 10, 20, 40]).each(function (index, item) {), start debugging, then go to the “About” page. If you click on Run test1, you’ll hit the breakpoint in Test.js. If you try stepping into this statement with an older version of Visual Studio (or Visual Studio 2013 with Just My Code turned off), you’ll see something like this:

image

 

This is definitely not the best debugging experience because most developers don’t care to go stepping through JQuery code. This behavior may also be very confusing to a novice developer. With Visual Studio 2013 and Just My Code, the same step operation will take you directly to the first call to your anonymous function:

image

If you look at the Call Stack window, you’ll notice some grayed out frames named “[External Code]”. If you are interested in seeing what the external code is doing, you can take a look at it by right clicking in the Call Stack window, and selecting “Show External Code”:

image

Exceptions

If you have ever tried to enable stopping on first chance exceptions, you’ve probably seen screens like this many times:

image

You can try this yourself by going to Debug -> Exceptions, and enabling the debugger to stop when exceptions are thrown (also called first chance exceptions) for all JavaScript exceptions:

image

If you turn off Just My Code, enable first chance exceptions, and refresh the About page, you’ll be greeted with the screen above. In fact if you leave this setting on, you’ll be inundated with first chance exceptions in code you aren’t interested in while trying to debug your code. I tried this and had to push “Continue” (F5) 28 times before the About page loaded. Once you turn on Just My Code, all of these exceptions are ignored automatically since they are not in your code. If you want to stop at a first chance exception, click on the “Run test2” link. With stop on first chance exceptions enabled, the debugger will stop on the first chance exception in Test.js:

image

Summary

In this post I briefly walked you through Just My Code for JavaScript when debugging ASP.NET applications in Visual Studio 2013. We discussed a few of the benefits and showed an overview of the behavior for stepping and exceptions. If you would like a more detailed description of the exact behavior in various situations and how to customize what is considered Just My Code please refer to the aforementioned previous blog post or the MSDN documentation.

If you have any questions or comments please let us know by either commenting below or posting in our MSDN forum.

Leave a Comment
  • Please add 1 and 7 and type the answer here:
  • Post
  • A quick suggestion: it would be great to see those modal dialogs go away in the JS experience and be replaced with something more like the "Exception Helper" pop-ups that you get, for instance, in the C# debugging experience.  

  • @Max Battcher

    We have a few items around exceptions on UserVoice (we ask customers to post ideas there so that the community can vote on them and we can see how to prioritize their implementation based on the number of people interested)

    Please vote on any that you find interesting, or create a new one (they aren't quite what you asking for):

    visualstudio.uservoice.com/.../4578736-change-the-exceptions-modal-window-into-a-dockable

    visualstudio.uservoice.com/.../4995477-pinnable-exception-dialog

    visualstudio.uservoice.com/.../4995540-auto-expand-inner-exceptions

    Thanks!

    Maria

  • I cannot get the "Step into jQuery" scenario to work. Followed it step by step, but with no luck.

    Using VS Ultimate 2013 version 12.0.21005.1 REL

  • @Niels Schneider

    Can you verify that you don't have JMC enabled?

    If that's not it - what exactly are you trying and is not working?

  • Maria,

    Thanks for your follow up on this matter.

    JMC enable or disabled gives the same result for JS. Debugger jumps into jQuery as if JMC is disabled.

    Tried to add a mycode.json file in the root with:

    {

       "MyCode" : ["Test.js"],

       "Libraries" : ["jquery-1.10.2.js", "*.min.js"],

       "Unrelated" : []

    }

    still debugger jumps into jQuery. Doesn't matter if the minified of unminified version is used.

    Kind regards,

    Niels

  • @Niels Schneider

    Can you try a brand new test project and see if it works there?

    If not, can you email vsdbgfb at microsoft.com with the issue details?

    Thanks!

    Maria

  • Maria,

    Sorry for the late reaction. Tried a brand new empty ASP.Net project but it still doesn't work. I've followed your suggestion and mailed this question to the adres you mentioned.

    Thanks for the help.

    Niels

  • Thanks for this great article and functionality. However I'm having problems with it.

    I've a MVC 5 web project using Web.API 2 and AngularJS. I using Visual Studio 2013 Ultimate and IE 11. I am not able to get the Just My Code functionality to work. I'm keep stepping into angular.min.js

    I have my custom javascrip code at showAgents.js which is using angular directories.

    I have tried to fool around with mycode.json, which looks like this

    {

    "MyCode": [],

    "Libraries": ['*.min.js'],

    "Unrelated": [],

    }

    but still I'm stepping into the angular.min.js?

  • @mirsamar: Based on your description we would expect this work, a few initial things to check:

    1.  Is "Just My Code" enabled under Tools->Options->Debugging

    2.  Is your "mycode.json" in the root if your startup project (the project that launches when you press F5)?

    If neither of this is the issue, can you contact us at vsdbgfb@microsoft.com? This may be easier to troubleshoot over email than on blog comments.  It would be most helpful if you could provide a simple repro project, or at least code snippet so we can try it ourselves.

  • @Andrew B Hall - MSFT

    Hi Andrew!

    Thanks for your answer, I will get back to you.

  • Hi Team,

    Is there any online site where i can try asp.net in C# of vb

  • @Giri the easiest and recommended way to try ASP.NET is to download the free Web Express version of Visual Studio www.visualstudio.com/.../visual-studio-express-vs.aspx

  • Where is the best place to post about a problem with Jquery and VS 2013 I am having.

  • @ David Young

    If you need help, I would suggest the msdn forums social.msdn.microsoft.com/.../home

    If you suspect a bug, please use the Feedback tool or connect.microsoft.com/VisualStudio to send us repro steps of your issue.

Page 1 of 1 (14 items)