Best HTML Parser

When it comes to HTML page content manipulation, there are two main HTML parsers which goes well with .NET framework.

MSHTML by MicrosoftHTML Agility Pack

Out of the two, according to my experience, Agility Pack outweigh MSHTML easily. Following are the main reasons.

Proper documentation.Customer support.Support large HTML contents.More features/methods.

MSHTML is a legacy Microsoft library and you have to add it to your project from your computer’s assembly location (Add Reference -> Assemblies -> Type “HTML”, you will see Microsoft.mshtml. Then add it to your project). Or you can try the Nuget package version as well.

To start manipulating HTML content, you have to,

Load the HTML content

MSHTML

If you pass your HTML content using a string parameter called “content”,

var htmlDoc = new HTMLDocument(); var ihtmlDoc = (IHTMLDocument2)htmlDoc; ihtmlDoc.open(); ihtmlDoc.write(content);

Agility Pack

HtmlWeb web = new HtmlWeb();

var uri = new Uri(FilePath)

var htmlDoc = web.Load(uri, "POST");

If you are trying to manipulate a large page, we would recommend you to use HTML Agility Pack without a doubt. Our .Net development team has experienced limitations with MSHTML when it comes to handling large HTML content. It was with one of our SharePoint Development (with Azure) projects and the team had to struggle a lot to pinpoint the issue. Once we pushed the solution to one of our Azure App Services, MSHTML solution tends to break at “itmlDoc.write(content)” code line without even giving an error or stack trace. It could be either a memory leak or an unhandled exception with that library.

Following are some common parse commands that you can use to manipulate an HTML page.

Deleting a Node

MSHTML

var childNode = htmlDoc.getElementById("u_0_1i");

if (childNode!= null)

{

var parentNode = ((mshtml.HTMLDivElement)childNode).parentNode;parentNode.removeChild((IHTMLDOMNode)childNode);

}

HTML Agility Pack

var childNode = htmlDoc.GetElementbyId("u_0_1i");

if (childNode!= null)

{

childNode.ParentNode.RemoveChild(childNode, false);

}

In both the cases, we have to get the Child Element and then use its Parent Element to delete the child.

Set CSS of an Element

MSHTML

var postContentContainer = htmlDoc.getElementById("content_container");

if(postContentContainer!=null)

postContentContainer.style.cssText= "width: 100%!important;";

HTML Agility Pack

var postContentContainer = htmlDoc.GetElementbyId("content_container"); if (postContentContainer != null) { postContentContainer.GetAttributeValue("style",null); postContentContainer.SetAttributeValue("style", "width: 100%!important;"); }

Note: We had no luck with “postContentContainer.Attributes.Append("style");” when it comes to changing the style of an element with HTML Agility Pack. It has to be “GetAttributeValue” and then “SetAttributeValue” to overwrite the styles.

Set Attributes of an Element

MSHTML

var nodeSample= htmlDoc.getElementById("content_container"); nodeSample.setAttribute("width","100%");

HTML Agility Pack

var globalContainer = htmlDoc.GetElementbyId("globalContainer"); if (globalContainer != null) { globalContainer.Attributes.Append("width"); globalContainer.SetAttributeValue("width", "100%!important;"); }

Change CSS Class Name

MSHTML

nodeSample= htmlDoc.getElementById("content_container");

nodeSample.className= "_2pie _14i5 _1qkx";

HTML Agility Pack

var videosElement = htmlDoc.GetElementbyId("videos"); if (videosElement != null) { videosElement.ReplaceClass("newClass", "oldClass"); }

Overwrite CSS or Add New Classes

MSHTML

mshtml.IHTMLStyleSheet css = (mshtml.IHTMLStyleSheet)ihtmlDoc.createStyleSheet("", 0);

css.cssText = ".uiScaledImageContainer { width: 100% !important; height: auto!important; } ._4-eo { width: 100% !important; }"

HTML Agility Pack

var cssString = ".uiScaledImageContainer { /*image container*/ width: 100% !important; height: auto!important; } ._4-eo { /*image a tag*/ width: 100% !important; }" var styles = htmlDoc.CreateElement("style"); var styleText = htmlDoc.CreateTextNode(cssString); styles.AppendChild(styleText); htmlDoc.DocumentNode.AppendChild(styles);

Select a Particular Nodes

HTML Agility Pack

var imgs = htmlDoc.DocumentNode.SelectNodes("//a");

Overwrite an Attribute

HTML Agility Pack

var imgs = htmlDoc.DocumentNode.SelectNodes("//a");

foreach (var node in imgs)

{

if (node.Attributes.Contains("target"))

node.Attributes.Remove("target");

node.Attributes.Append("target");

node.SetAttributeValue("target", "_blank");

}

Select Nodes with REGEX

HTML Agility Pack

var nodes = htmlDoc.DocumentNode.SelectNodes("//div[contains(@class, '_5va1 _427x')]");

This will get all the DIVs that contains the class

Save the document at the end to see the changes.

HTML Agility Pack

using (StreamWriter sw1 = new StreamWriter(filePath + "/test.html")) { htmlDoc.Save(sw1); }

Summary

With the experience of handling all these libraries to a greater level, I would recommend to pick HTML Agility Pack over MSHTML Class Library without a doubt.

If you want more support, please contact us.

Our Software Development team encountered a weird issue on one of the MVC web based projects. In some cases, if the App is hosted in Azure and authenticated by Azure AD, the user is redirected to Microsoft Online login page. This only happens when the solutions is publish to Azure(Not in the dev environment).

This is a semi-famous bug(Katana Bug #197) in Microsoft Owin implementation. This bug is related to the Cookie handling algorithm and clearing out stored cookies might only be a temporary solution.

I would recommend to follow the bellow article first to check whether it fixes your problem.

https://www.laptopmag.com/articles/fix-stuck-login-office-365

If this doesn’t fix your problem, please get and install “Kentor.OwinCookieSaver” from the Nuget package manager in to your project. After installing, please do the following modification in “Startup.Auth.cs” file.

Go to “ConfigureAuth” method.

add;

app.UseKentorOwinCookieSaver();

just before;

app.UseCookieAuthentication(new CookieAuthenticationOptions());

Make sure that you install the latest package as the old package did not fix my problem. According to the latest package you might be required to change the .NET framework of your project. The latest “Kentor.OwinCookieSaver” Works with .Net Framework 4.6 or higher.

This is a known issue for publishing pages has become a common problem in SharePoint Development. Some Javascript libraries are not loaded in SharePoint page Publishing mode. For an example, as a part of Minimal Download Strategy(MDS), “sp.js” may not be loaded at every page load, unless it is explicitly loaded.

Thus, some jQuery features may not work in the following code in Publishing pages,

$(document).ready(function() {

// My custom functionality

});

Use the following code block instead;

$(document).ready(function ()

{

SP.SOD.executeFunc('sp.js', 'SP.ClientContext', myFunction);

});

function myFunction ()

{

// My custom code

};

“SOD.executeFunc” loads the “sp.js” file first and then execute the custom functions.

The problem we have with exectueFunc is, if the script associated with the script key is already loaded, then executeFunc does absolutely NOTHING. In our case, if “sp.js” is already loaded, “myFunction” will not be executed. Thus, if you use your code in a button click function, button click code will only be executed once.

To get our function executed all the time, we have to use both methods in conjunction with one another as follows:

executeOrDelayUntilScriptLoaded(function() {

..My Code..

},"custScript.js");

executeFunc("custScript.js", null, null);

Above code will queue “My Code”, until “custScript.js” is loaded. If “custScript.js” is already loaded, it will execute “My Code” straight away.

Different between document.ready vs spBodyOnLoadFunctions

SharePoint uses its own body onload function called, _spBodyOnLoadFunctionNames. It is recommended to use this as it allows the things to load in their proper order.

In some cases, you might need to execute your jQuery code after the page is completely loaded. For example; if you want to re-write / overwrite page elements/tags, use the following code segment;

_spBodyOnLoadFunctions.push(function(){

ExecuteOrDelayUntilScriptLoaded(myFunction, "sp.js");

});

function myFunction ()

{

};

We are an Australian software development company specializing in SharePoint and .NET Applications. We already have a ground breaking, self developed tools to help our customers connect to the future of business. For example, our SharePoint Migration Tool SW1SH, is one of the first migration tools that have been developed in Australia. Why us? The benefit in choosing us is the understanding of business demands due to competing priorities of business operations. The team has previous grass roots business and management experience through to highly complex business situations. Combine this with business training and Information Technology systems training. This is leading to a high quality of workmanship, analysis and implementation of situationally appropriate software systems. (No two systems will be alike, because no two businesses are alike) Our blog will discuss In this blog thread, we will attempt to demystify the issues in business and information technology that face business today. The aim is to provide “You”, our business customers with the confidence and inspiration to move forward with our company and your business. As we go along, we will be discussing several management theories and practices that can be transformed by Information Technology. We will explain jargon terms of what the business owner needs to know to achieve the next level of productivity. We will also discuss the pitfalls and benefits of small business.