How to get html from a view and change the content in MVC

There are times you want to manipulate the html after it has created to change image references, or change the links outputted to friendly URL’s. Here is a trick how to get the content out of a view in MVC and use the HtmlAgilityPack to change the content.

If you have a view you want to render, for instance in the _Layout.cshtml and you want to change html you could have lines like this:

    @Html.PropertyForWithChangeHtml(p => p.StartPage.Row1)
    @Html.RenderViewWithChange("~/Views/MasterPages/HtmlFooter.cshtml", Model)

The extension code that will render the PropertyFor is like this:

public static MvcHtmlString PropertyForWithChangeHtml<TModel, TValue>(this HtmlHelper<TModel> html, Expression<Func<TModel, TValue>> expression)
{
    return PropertyForWithChangeHtml(html, expression, null);
}
public static MvcHtmlString PropertyForWithChangeHtml<TModel, TValue>(this HtmlHelper<TModel> html, Expression<Func<TModel, TValue>> expression, object additionalViewData)
{
    var result = html.PropertyFor(expression, additionalViewData);
    var htmlTxt = result.ToString();
    var htmlTxtChanged = ChangeHtml(htmlTxt);
    return new MvcHtmlString(htmlTxtChanged);
}

And the code that will render a view is like this

public static MvcHtmlString RenderViewWithChange(this HtmlHelper html, string viewName, object model)
{
    var htmlTxt = RenderViewToString(html.ViewContext, viewName, model);
    var htmlTxtChanged = ChangeHtml(htmlTxt);
    return new MvcHtmlString(htmlTxtChanged);
}
public static string RenderViewToString(ControllerContext context, string viewName, object model)
{
    if (string.IsNullOrEmpty(viewName))
        viewName = context.RouteData.GetRequiredString("action");

    ViewDataDictionary viewData = new ViewDataDictionary(model);

    using (var sw = new StringWriter())
    {
        ViewEngineResult viewResult = ViewEngines.Engines.FindPartialView(context, viewName);
        ViewContext viewContext = new ViewContext(context, viewResult.View, viewData, new TempDataDictionary(), sw);
        viewResult.View.Render(viewContext, sw);

        return ChangeHtml(sw.GetStringBuilder().ToString());
    }
}

The actully changing of the html is easy with the HtmlAgilityPack. This code will ensure that all links are friendly EPiServer URL's

public static string ChangeHtml(string html)
{
        var doc = new HtmlDocument();
        doc.LoadHtml(html);
        FiksNodes(doc.DocumentNode);
        return doc.DocumentNode.OuterHtml;
}

public static void FiksNodes(HtmlNode node)
{
    if (node.Attributes.Contains("href"))
    {
        var val = node.Attributes["href"].Value;
        ChangeLinkToFriendly(node, val, "href");
    }
    if (node.Name == "form" && node.Attributes.Contains("action"))
    {
        var val = node.Attributes["action"].Value;
        ChangeLinkToFriendly(node, val, "action");
    }
    for (int i = 0; i < node.ChildNodes.Count; i++)
    {
        FiksNodes(node.ChildNodes[i]);
    }
}
private static void ChangeLinkToFriendly(HtmlNode node, string val, string key)
{
    if (val.StartsWith("/link/"))
    {
        var decoded = HttpUtility.HtmlDecode(val);
        var url = new UrlBuilder(decoded);
        PageReference pageRef = null;
        if (url.QueryCollection["id"] != null && PageReference.TryParse(url.QueryCollection["id"], out pageRef))
        {
            EPiServer.Global.UrlRewriteProvider.ConvertToExternal(url, pageRef, System.Text.UTF8Encoding.UTF8);
            node.Attributes[key].Value = url.Uri.IsAbsoluteUri ? url.Uri.AbsoluteUri : url.Uri.OriginalString;
        }
        else
        {
            EPiServer.Global.UrlRewriteProvider.ConvertToExternal(url, null, System.Text.UTF8Encoding.UTF8);
            node.Attributes[key].Value = url.Uri.IsAbsoluteUri ? url.Uri.AbsoluteUri : url.Uri.OriginalString;
        }
        node.Attributes.Add("data-changed-" + key + "-from", val);
    }
}