Visual Studio 2010 and javascript debugging in external javascript files (embedded and minified).
- by OKB
Hi,
The asp.net web application I'm working on is written in asp.net 3.5, the web app solution is upgraded from VS 2008 (don't know if that matter).
The solution had javascript in the aspx files before I moved the javascript to external files. Now what I have done is to set all the javascript files to be embedded resource (except the jquery.js file) and I want to minify them when building for release by using the MS Ajax Minifier. I want to use the minified javascript files when I'm in the RELEASE mode and when I'm in DEBUG mode I want to use the "normal" versions.
My problem now is that I'm unable to debug the javascript code in debug mode. When I set a break point a javascript function, VS is not breaking at all when the function is executed.
I have added this entry in my web.config:
<system.web>
<compilation defaultLanguage="c#" debug="true" />
</system.web>
Here how I register the jquery in an aspx-file:
<asp:ScriptManagerProxy ID="ScriptManagerProxy1" runat="server">
<Scripts>
<asp:ScriptReference Path="~/Javascript/jquery.js"/>
</Scripts>
</asp:ScriptManagerProxy>
External javascript registration in the code-behind:
#if DEBUG
[assembly: WebResource("braArkivWeb.Javascript.jquery.js", "text/javascript")]
[assembly: WebResource(braArkivWeb.ArkivdelSearch.JavaScriptResource, "text/javascript")]
#else
[assembly: WebResource("braArkivWeb.Javascript.jquery.min.js", "text/javascript")]
[assembly: WebResource(braArkivWeb.ArkivdelSearch.JavaScriptMinResource, "text/javascript")]
#endif
public partial class ArkivdelSearch : Page
{
public const string JavaScriptResource = "braArkivWeb.ArkivdelSearch.js";
public const string JavaScriptMinResource = "braArkivWeb.ArkivdelSearch.min.js";
protected void Page_Init(object sender, EventArgs e)
{
InitPageClientScript();
}
private void InitPageClientScript()
{
#if DEBUG
this.Page.ClientScript.RegisterClientScriptResource(typeof(ArkivdelSearch), "braArkivWeb.Javascript.jquery.js");
this.Page.ClientScript.RegisterClientScriptResource(typeof(ArkivdelSearch), JavaScriptResource);
#else
this.Page.ClientScript.RegisterClientScriptResource(typeof(ArkivdelSearch), "braArkivWeb.Javascript.jquery.min.js");
this.Page.ClientScript.RegisterClientScriptResource(typeof(ArkivdelSearch), JavaScriptMinResource);
#endif
StringBuilder sb = new StringBuilder();
Page.ClientScript.RegisterStartupScript(typeof(ArkivdelSearch),
"initArkivdelSearch",
sb.ToString(),
true);
}
}
In the project file I have added this code to minify the javascripts:
<!-- Minify all JavaScript files that were embedded as resources -->
<UsingTask TaskName="AjaxMin" AssemblyFile="$(MSBuildProjectDirectory)\..\..\SharedLib\AjaxMinTask.dll" />
<PropertyGroup>
<ResGenDependsOn>
MinifyJavaScript;
$(ResGenDependsOn)
</ResGenDependsOn>
</PropertyGroup>
<Target Name="MinifyJavaScript" Condition=" '$(ConfigurationName)'=='Release' ">
<Copy SourceFiles="@(EmbeddedResource)" DestinationFolder="$(IntermediateOutputPath)" Condition="'%(Extension)'=='.js'">
<Output TaskParameter="DestinationFiles" ItemName="EmbeddedJavaScriptResource" />
</Copy>
<AjaxMin JsSourceFiles="@(EmbeddedJavaScriptResource)" JsSourceExtensionPattern="\.js$" JsTargetExtension=".js" />
<ItemGroup>
<EmbeddedResource Remove="@(EmbeddedResource)" Condition="'%(Extension)'=='.js'" />
<EmbeddedResource Include="@(EmbeddedJavaScriptResource)" />
<FileWrites Include="@(EmbeddedJavaScriptResource)" />
</ItemGroup>
</Target>
Do you see what I'm doing wrong? Or what I'm missing in order to be able to debug my javascript code?
Best Regards,
OKB