KryzhanovskyCssMinifier doesn't work with MsieJsEngine but does with V8JsEngine - asp.net-mvc

I am using the latest BundleTransformer for ASP.NET.
I have an extremely simple bundle file with one LESS file:
var cssBundle = new CustomStyleBundle("~/Content/css/bundle").Include(
"~/Content/css/test.less");
bundles.Add(cssBundle);
The LESS file I've made as simple as possible to prove it is actually correctly interpreting as LESS.
.something
{
ol, ul
{
list-style: none;
}
}
When I try to use V8JsEngine it works as expected (relevant web.config shown):
<css defaultMinifier="KryzhanovskyCssMinifier" usePreMinifiedFiles="false">
<minifiers>
<add name="KryzhanovskyCssMinifier" type="BundleTransformer.Csso.Minifiers.KryzhanovskyCssMinifier, BundleTransformer.Csso" />
</minifiers>
</css>
<csso>
<css disableRestructuring="false" />
<jsEngine name="V8JsEngine" />
</csso>
This gives me the correct CSS:
.something ol,.something ul{list-style:none}
However when I switch to MsieJSEngine
<csso>
<css disableRestructuring="false" />
<jsEngine name="MsieJsEngine" />
</csso>
I get the following bizarrely incorrect CSS - with UL completely stripped out.
.something ol{list-style:none}
I just can't quite fathom how this is even possible. It has been interpreted correctly as LESS, but completely stripped out the UL from the list. Incidentally if I make it just a pure css file without the .something class I get the same incorrect result.
Fortunately it seems to work fine with V8JsEngine so I can keep on, but I'm posting this here hopefully to help others and because I'm very curious if there's something I did wrong.
File versions:
BundleTransformer.Core - 1.9.3.0
BundleTransformer.Csso - 1.9.1.0
BundleTransformer.Less - 1.9.1.0
BundleTransformer.MicrosoftAjax - 1.9.1.0

For BundleTransformer.Csso need the full support of ECMAScript 5, that is implemented only in ChakraJsRt mode of the MSIE JavaScript Engine for .NET. Quote from the documentation:
JsRT version of Chakra JavaScript engine (supports ECMAScript 5). Requires Internet Explorer 11 or higher on the machine.
Incidentally, in description of the BundleTransformer.Csso NuGet-package has the following requirement:
For correct working of this module is recommended to install the following NuGet packages: JavaScriptEngineSwitcher.V8 or JavaScriptEngineSwitcher.Msie (only in the ChakraJsRt mode).

Related

Datepicker is not showing in Internet explorer 8

I have used used struts-2 for my apllication and for creating datepicker i have used the "struts-jquery-tags"...it works fine in other browser but in Internet explorer, it is not showing at all..My code goes here
<%# taglib prefix="sj" uri="/struts-jquery-tags"%>
<sj:head/>
<sj:datepicker name="dueDate" id="dueDate" displayFormat="mm/dd/yy" label="Due Date" changeMonth="true" changeYear="true" title="Due Date" showButtonPanel="true" maxlength="10" readonly="true" buttonImage="/BPELServiceInvoke/resources/images/calendar_add.png" buttonImageOnly="true" duration="fast" />
This is strictly related to browser compatiblity issues for that plugin.
Best way would be to post here : https://code.google.com/p/struts2-jquery/wiki/DatePickerTag
Meanwhile, just try downgrading the version of plugin you're using. I'm sure the older-versions will be having support for IE8.
Also, look at the change-log for jquery version being used and it's support for IE8 - https://code.google.com/p/struts2-jquery/wiki/Changelog

Facing issue while trying to Cache images js files using Combres Nuget Package

Below is my Fidler.
If you pay attention to the above screenshot, js and css files are being downloaded on every refresh. Why?
I have a query about the functionality of Combres. Url.Combress can cache the css files. right? In case you remove the css file from the physical location. I get 404 error? Why? Because this file is cached. So it should not be picked from it's physical location. Instead it should be picked from cache. Correct?
Explanation
I am using MVC3. I have installed Nuget Package combres in Package Manager Console
Install-Package combres.mvc
Below is the proof of my Route Table
I have below two files in my Layout.
<link href=""~/Content/Site.css" type="text/css" />
<script src="~/Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
Combress.xml setting
<combres xmlns='urn:combres'>
<filters>
<filter type="Combres.Filters.FixUrlsInCssFilter, Combres" />
</filters>
<resourceSets url="~/combres.axd"
defaultDuration="30"
defaultVersion="auto"
defaultDebugEnabled="auto"
defaultIgnorePipelineWhenDebug="true"
localChangeMonitorInterval="30"
remoteChangeMonitorInterval="60"
>
<resourceSet name="siteCss" type="css">
<resource path="~/content/Site.css" />
</resourceSet>
<resourceSet name="siteJs" type="js">
<resource path="~/scripts/jquery-1.7.1.min.js" />
</resourceSet>
</resourceSets>
</combres>
When i execute the below path
http://localhost:2474/Home/About
I think, it is downloading the above files every time. As per my understanding, combress should Cache the images/css/js file which ever files are mentioned in the combres.xml setting.
You need to reference the files differently. Since you are using asp.net-mvc I would recommend you also install this complementary nuget package
Install-Package combres.mvc
And then in your master page, or wherever you want your different resources
#Url.CombresLink("siteCss")
#Url.CombresLink("siteJs")
Note : Before adding the above code lines. Add #using Combres.Mvc; in your layout Page.
This is the standard recommendation as per the documentation.
Note that you probably want to have full source in debug mode and only combine in release mode, which is a setting on your resourceSet: defaultDebugEnabled="auto"
There are other considerations but that should be enough to get started.

Why is DotNetNuke text editor control always showing HTML Code with iPad?

I have a DotNetNuke custom module where I am using an HTML editor to allow uses to enter some text to be saved to a database.
It is working fine for all browsers except IPad's safari where I get the HTML tags showing in the editor.
What can I do to make Ipad show text formatted (or even as plain text) rather than having these tags appear as they are very confusing to users.
The control is using:
<%# Register TagPrefix="dnn" TagName="TextEditor" Src="~/controls/TextEditor.ascx" %>
<div id="divTab2">
<dnn:TextEditor ID="txtNotes" runat="server" Width="900px" />
</div>
The web.config has this:
<htmlEditor defaultProvider="DotNetNuke.RadEditorProvider">
<providers>
<clear />
<!--Upgraded by DotNetNuke.TelerikEditorProvider version 5.6.3 - Date: 8/3/2011 1:00:02 AM-->
<!--<add name="TelerikEditorProvider" type="DotNetNuke.HtmlEditor.TelerikEditorProvider.EditorProvider, DotNetNuke.HtmlEditor.TelerikEditorProvider" providerPath="~/Providers/HtmlEditorProviders/Telerik/" toolsFile="~/Providers/HtmlEditorProviders/Telerik/Config/ToolsDefault.xml" configFile="~/Providers/HtmlEditorProviders/Telerik/Config/ConfigDefault.xml" FilterHostExtensions="True" />-->
<!--Upgraded by DotNetNuke.TelerikEditorProvider version 5.6.3 - Date: 8/3/2011 7:33:08 PM-->
<!--<add name="TelerikEditorProvider" type="DotNetNuke.HtmlEditor.TelerikEditorProvider.EditorProvider, DotNetNuke.HtmlEditor.TelerikEditorProvider" providerPath="~/Providers/HtmlEditorProviders/Telerik/" toolsFile="~/Providers/HtmlEditorProviders/Telerik/Config/ToolsDefault.xml" configFile="~/Providers/HtmlEditorProviders/Telerik/Config/ConfigDefault.xml" FilterHostExtensions="True" />-->
<add name="TelerikEditorProvider" type="DotNetNuke.HtmlEditor.TelerikEditorProvider.EditorProvider, DotNetNuke.HtmlEditor.TelerikEditorProvider" providerPath="~/Providers/HtmlEditorProviders/Telerik/" toolsFile="~/Providers/HtmlEditorProviders/Telerik/Config/ToolsDefault.xml" configFile="~/Providers/HtmlEditorProviders/Telerik/Config/ConfigDefault.xml" FilterHostExtensions="True" />
<add name="DotNetNuke.RadEditorProvider" type="DotNetNuke.Providers.RadEditorProvider.EditorProvider, DotNetNuke.RadEditorProvider" providerPath="~/DesktopModules/Admin/RadEditorProvider" />
</providers>
</htmlEditor>
example:
In iPad, I get
<div style="text-align: center;"><strong>Case History Notes - Martha </strong><br /></div><br /><strong>6/24/11</strong>: Referred by Jackie <br /><strong>6/26/11:</strong> Sch. Initial Interview for 6/30; 7:00AM Breakfast at Cafe.<br />
rather than the expected
Case History Notes - Martha 6/24/11: Referred by Jackie 6/26/11: Sch. Initial Interview for 6/30; 7:00AM Breakfast at Cafe.
Safari on the iThings doesn't support contentEditable, which is the feature used for most rech edit panels on the web.
Since I do not have an iPad, I am unable to troubleshoot this. I can confirm that the desktop version of Safari works fine though. Have you tried this on newer versions of DotNetNuke? The browser and telerik definitions are updated with every release. If you cannot upgrade for some reason, I would try upgrading just your telerik controls. For example, you can try the latest release of the DNN 5 RadEditor Provider by dnnWerk.

Auto-versioning in ASP.NET MVC for CSS / JS Files?

I have read lots of article on how to auto-version your CSS/JS files - but none of these really provide an elegant way to do this in ASP.NET MVC.
This link - How to force browser to reload cached CSS/JS files? - provides a solution for Apache - but I'm a little confused how this could be implemented via ASP.NET MVC ?
Would anyone be able to provide some advice how to do this on IIS7 and ASP.NET MVC - so that CSS/JS files automatically have a version number inserted in the URL without changing the location of the file ?
That is, so links come out link this etc presumably using the URL Rewrite or ?
<link rel="stylesheet" href="/css/structure.1194900443.css" type="text/css" />
<script type="text/javascript" src="/scripts/prototype.1197993206.js"></script>
Thx
When faced with this problem I wrote a series of wrapper functions around the UrlHelper's Content method:
EDIT:
Following the discussions in the comments below I updated this code:
public static class UrlHelperExtensions
{
private readonly static string _version = System.Reflection.Assembly.GetExecutingAssembly().GetName().Version.ToString();
private static string GetAssetsRoot()
{
string root = ConfigurationManager.AppSettings["AssetsRoot"];
return root.IsNullOrEmpty() ? "~" : root;
}
public static string Image(this UrlHelper helper, string fileName)
{
return helper.Content(string.Format("{0}/v{2}/assets/img/{1}", GetAssetsRoot(), fileName, _version));
}
public static string Asset(this UrlHelper helper, string fileName)
{
return helper.Content(string.Format("{0}/v{2}/assets/{1}", GetAssetsRoot(), fileName, _version));
}
public static string Stylesheet(this UrlHelper helper, string fileName)
{
return helper.Content(string.Format("{0}/v{2}/assets/css/{1}", GetAssetsRoot(), fileName, _version));
}
public static string Script(this UrlHelper helper, string fileName)
{
return helper.Content(string.Format("{0}/v{2}/assets/js/{1}", GetAssetsRoot(), fileName, _version));
}
}
Using these functions in conjunction with the following rewrite rule should work:
<rewrite>
<rules>
<rule name="Rewrite assets">
<match url="^v(.*?)/assets/(.*?)" />
<action type="Rewrite" url="/assets/{R:2}" />
</rule>
</rules>
</rewrite>
This article discusses how to create rewrite rules on IIS7.
This code uses the version number of the current assembly as a query string parameter on the file path's it emits. When I do an update to the site and the build number increments, so does the querystring parameter on the file, and so the user agent will re-download the file.
UPDATE: The previous version did not work on Azure, I have simplified and corrected below. (Note, for this to work in development mode with IIS Express, you will need to install URL Rewrite 2.0 from Microsoft http://www.iis.net/downloads/microsoft/url-rewrite - it uses the WebPi installer, make sure to close Visual Studio first)
UPDATE: Fixed rule for .min files
I recently spent an entirely fruitless day trying to get automatic bundling (to support auto-versioning) in C# / Net 4.6 / MVC 5 / Razor to work. I read many articles both on StackOverflow and elsewhere, yet I could not find an end-to-end walk through of how to set it up. I also do not care for the way files are version-ed (by appending a query string with version to the static file request - ie. somefile.js?v=1234) because I have been told by some that certain proxy servers ignore query strings when caching static resources.
So after a short trip down the rabbit hole, I've rolled my own version for auto-versioning and included full instructions on how to get it working below.
Full discussion #: Simplified Auto-Versioning of Javascript / CSS in ASP.NET MVC 5 to stop caching issues (works in Azure and Locally) With or Without URL Rewrite
THE PROBLEM: You generally have 2 types of javascript / css files in a project.
1) 3 party libraries (such as jquery or mustache) that very rarely change (and when they do, the version on the file generally changes) - these can be bundled / minified on an "as-needed" basis using WebGrease or JSCompress.com (just include the bundled file/version in your _Layout.cshtml)
2) page specific css/js files that should be refreshed whenever a new build is pushed. (without having the user clear thier cache or do multiple refreshes)
My Solution: Auto-increment the assembly version every time the project is built, and use that number for a routed static file on the specific resources you would like to keep refreshed. (so something.js is included as something.v1234.js with 1234 automatically changing every time the project is built) - I also added some additional functionality to ensure that .min.js files are used in production and regular.js files are used when debugging (I am using WebGrease to automate the minify process) One nice thing about this solution is that it works in local / dev mode as well as production.
How to do it: Auto-increment the assembly version every time the project is built, and use that number for a routed static file on the specific resources you would like to keep refreshed. (so something.js is included as something.v1234.js with 1234 automatically changing every time the project is built) - I also added some additional functionality to ensure that .min.js files are used in production and regular.js files are used when debugging (I am using WebGrease to automate the minify process) One nice thing about this solution is that it works in local / dev mode as well as production. (I am using Visual Studio 2015 / Net 4.6, but I believe this will work in earlier versions as well.
Step 1: Enable auto-increment on the assembly when built
In the AssemblyInfo.cs file (found under the "properties" section of your project change the following lines:
[assembly: AssemblyVersion("1.0.0.0")]
[assembly: AssemblyFileVersion("1.0.0.0")]
to
[assembly: AssemblyVersion("1.0.*")]
//[assembly: AssemblyFileVersion("1.0.0.0")]
Step 2: Set up url rewrite in web.config for files with embedded version slugs (see step 3)
In web.config (the main one for the project) add the follwing rules in the system.webServer.
<rewrite>
<rules>
<rule name="static-autoversion">
<match url="^(.*)([.]v[0-9]+)([.](js|css))$" />
<action type="Rewrite" url="{R:1}{R:3}" />
</rule>
<rule name="static-autoversion-min">
<match url="^(.*)([.]v[0-9]+)([.]min[.](js|css))$" />
<action type="Rewrite" url="{R:1}{R:3}" />
</rule>
</rules>
</rewrite>
Step 3: Setup Application Variables to read your current assembly version and create version slugs in your js and css files.
in Global.asax.cs (found in the root of the project) add the following code to protected void Application_Start() (after the Register lines)
// setup application variables to write versions in razor (including .min extension when not debugging)
string addMin = ".min";
if (System.Diagnostics.Debugger.IsAttached) { addMin = ""; } // don't use minified files when executing locally
Application["JSVer"] = "v" + System.Reflection.Assembly.GetExecutingAssembly().GetName().Version.ToString().Replace('.','0') + addMin + ".js";
Application["CSSVer"] = "v" + System.Reflection.Assembly.GetExecutingAssembly().GetName().Version.ToString().Replace('.', '0') + addMin + ".css";
Step 4: Change src links in Razor views using the application variables we set up in Global.asax.cs
#HttpContext.Current.Application["CSSVer"]
#HttpContext.Current.Application["JSVer"]
For example, in my _Layout.cshtml, in my head section, I have the following block of code for stylesheets:
<!-- Load all stylesheets -->
<link rel='stylesheet' href='https://fontastic.s3.amazonaws.com/8NNKTYdfdJLQS3D4kHqhLT/icons.css' />
<link rel='stylesheet' href='/Content/css/main-small.#HttpContext.Current.Application["CSSVer"]' />
<link rel='stylesheet' media='(min-width: 700px)' href='/Content/css/medium.#HttpContext.Current.Application["CSSVer"]' />
<link rel='stylesheet' media='(min-width: 700px)' href='/Content/css/large.#HttpContext.Current.Application["CSSVer"]' />
#RenderSection("PageCSS", required: false)
A couple things to notice here: 1) there is no extension on the file. 2) there is no .min either. Both of these are handled by the code in Global.asax.cs
Likewise, (also in _Layout.cs) in my javascript section: I have the following code:
<script src="~/Scripts/all3bnd100.min.js" type="text/javascript"></script>
<script src="~/Scripts/ui.#HttpContext.Current.Application["JSVer"]" type="text/javascript"></script>
#RenderSection("scripts", required: false)
The first file is a bundle of all my 3rd party libraries I've created manually with WebGrease. If I add or change any of the files in the bundle (which is rare) then I manually rename the file to all3bnd101.min.js, all3bnd102.min.js, etc... This file does not match the rewrite handler, so will remain cached on the client browser until you manually re-bundle / change the name.
The second file is ui.js (which will be written as ui.v12345123.js or ui.v12345123.min.js depending on if you are running in debug mode or not) This will be handled / rewritten. (you can set a breakpoint in Application_OnBeginRequest of Global.asax.cs to watch it work)
Full discussion on this at: Simplified Auto-Versioning of Javascript / CSS in ASP.NET MVC 5 to stop caching issues (works in Azure and Locally) With or Without URL Rewrite (Including a way to do it WITHOUT URL Rewrite)
I usually append a fake query string to my resource files.. i.e
<link rel="stylesheet" href="/css/structure.css?v=1194900443" type="text/css" />
<script type="text/javascript" src="/scripts/prototype.js?v=1197993206"></script>
It doesn't require any url helpers and works no matter what's running the in background. To be honest I haven't throughly tested this method, but I've found it always fixes any resource caching issues people were experiencing.
You'd probably have to update the v= manually, but it wouldn't be terribly hard to append a version parameter to the resources from a config file somewhere.
Edit:
I went back and throughly read through the content of the link above and realize you've probably already discarded this method. Apologies for suggesting it again.
I suppose next solution with advanced options (debug/release mode, versions):
Js or Css files included by such way:
<script type="text/javascript" src="Scripts/exampleScript<%=Global.JsPostfix%>" />
<link rel="stylesheet" type="text/css" href="Css/exampleCss<%=Global.CssPostfix%>" />
Global.JsPostfix and Global.CssPostfix is calculated by the following way in Global.asax:
protected void Application_Start(object sender, EventArgs e)
{
...
string jsVersion = ConfigurationManager.AppSettings["JsVersion"];
bool updateEveryAppStart = Convert.ToBoolean(ConfigurationManager.AppSettings["UpdateJsEveryAppStart"]);
int buildNumber = System.Reflection.Assembly.GetExecutingAssembly().GetName().Version.Revision;
JsPostfix = "";
#if !DEBUG
JsPostfix += ".min";
#endif
JsPostfix += ".js?" + jsVersion + "_" + buildNumber;
if (updateEveryAppStart)
{
Random rand = new Random();
JsPosfix += "_" + rand.Next();
}
...
}

Firefox Extension Development: Adding Tabs to the Preference Pane?

I'm adding this:
<prefwindow id="BrowserPreferences">
<!-- Create a new pane (tab) -->
<prefpane id="whateverPrefs" label="yes!"
onpaneload="alert('hey')"
image="chrome://helloworld/content/images/man.png">
<!-- Intermediary between GUI and preferences system -->
<preferences>
<!-- see the next section for more information -->
</preferences>
<!-- GUI Elements... -->
</prefpane>
</prefwindow>
to my overlay.xul. It doesn't work whatsoever, though it is suggested here. I do have wonderful success with this code, though:
<menupopup id="menu_ToolsPopup">
<menuitem id="helloworld-hello2" label="frigger!"
oncommand="HelloWorld.onMenuItemCommand(event);"/>
</menupopup>
Is this a version problem (e.g., Firefox 3.x will not do it)? I am unable to find the string BrowserPreferences in browser.xul, which seems to be part of the problem. How can I add tabs to the preference pane in Firefox?
[Sorry if this question is really simple, but searching for help on Firefox Extensions is like searching for help on the word "is."]
I don't think your code is wrong, but it should be overlaying preferences.xul not browser.xul - I'm guessing your overlay is registering with browser.xul and that's why your menu item works fine.
Check the section 'Register an Overlay' about half way down the MDC article Building an Extension

Resources