Javascript link rendered without onclick attribute in preview

Question

When using javascript link the edit mode renders the target script in onClick attribute

<a href="#" onclick="javascript:void(0);onclick=javascript:openOverlay('test-overlay',event);return false;" class="vds-button" sc-part-of="field">Show Test Modal</a>

Preview mode renders target script in href attribute

<a href="javascript:openOverlay('test-overlay', event)" class="vds-button">Show Test Modal</a>

is there any workaround to get the preview mode work same as edit mode to render javascript links?

Update 1: It appears to be something to do with glassmapper escaping Sitecore renderfield processor in preview/live mode. Any thoughts/suggestions on customizing glassmapper to resolve this?

Any help towards overriding glassmapper as explained here - RenderField pipeline only called in editing mode would be appreciated.

Update 2:

Following this https://jammykam.wordpress.com/2015/11/09/custom-glass-mapper-data-handlers-part-2/ I've managed to add a onclick Property to Glass Link field

 public class GlassLinkFieldDataMapper : SitecoreFieldLinkMapper
{
    public override object GetField(Field field, SitecoreFieldConfiguration config, SitecoreDataMappingContext context)
    {
        var link = (Link)base.GetField(field, config, context);

        if(link!=null && link.Type== LinkType.Javascript && link.Url.Contains("openOverlay"))
        {
            var extendedLink = new ExtendedLink(link);
            extendedLink.Url = "#";
            return extendedLink;
        }

        return link;
    }
}

public class ExtendedLink : Link
{
    public ExtendedLink(Link link)
    {
        base.Class = link.Class;
        base.Text = link.Text;
        this.onClick = link.Url;
    }

    public string onClick { get; set; }
}

But not sure how to have this onClick property rendered as attribute, as I see no option on Glass Link Field class, any thoughts would be appreciated.

Answer 1

From the API:

You can analyze the Sitecore.Context.Site.DisplayMode property.

1. It is equal to the Sitecore.Sites.DisplayMode.Edit value in the webedit mode.
2. Sitecore.Sites.DisplayMode.Preview value in the preview mode and
3. Sitecore.Sites.DisplayMode.Normal in the normal mode.

In Glassmapper:

1. Html.Glass().IsInEditingMode for webedit mode

by using the above properties you can build/render your condition base code.

Example:

if (Html.Glass().IsInEditingMode)
{
  // code-a 
}
else
{
 //code-b
}