Javascript Errors when Debugging in Visual Studio 2013

Question

I've just opened up a website for the first time in VS2013 and I'm getting Javascript exceptions when I run debugger:

Unhandled exception at line 194, column 21 in http://localhost:49809/

0x800a1391 - JavaScript runtime error: '$' is undefined 

And here's the code:

<script type="text/javascript">
      $(function () {
           $('#one').ContentSlider({
                width: '960px',
                height: '250px',
                speed: 400,
                easing: 'easeOutSine'
            });
      });
 </script>

Click Continue and I get a further exception:

Unhandled exception at line 37, column 59140 in http://localhost:52306/27fadf043d464a019907842c2a5a764e/browserLink

0x800a139e - JavaScript runtime error: Syntax error, unrecognized expression: unsupported pseudo: plusone

This website works fine live and debugs without issue in VS2012. I have a suspicion it's to do with referring to remote Javascript blocks (<script src="//code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> and <script type="text/javascript" src="//apis.google.com/js/plusone.js">). Is there a permissions setting I need to amend?

Any help would be greatly appreciated.

Numb

Answer 1

This seems to be a bug in the new Browser Link feature of VS 2013. See Browser Link Feature. It is a way for dynamic communication between a running app and the Visual Studio.

From that article, you can turn off the feature by adding the following line to Web.config:

<appSettings>
  ...
  <add key="vs:EnableBrowserLink" value="false" />
</appSettings>

Answer 2

It looks as though your script manager adds in the jquery reference in the body tag of a master page. You're putting in your own script and referencing jquery using the '$' symbol before the master page gets to the body tag.

Just move your own script to after the body. If you're using a content placeholder then move the content placeholder after the body (and not in the 'head' section).