How to use Javascript to make Freemarker errors less intrusive

Your Rating:

Results:

2

rates

When using Freemarker in Magnolia, you often get errors. For example, because you tried to use an undefined value and didn't add the required '!' symbol. When that happens you see the infamous red-on-yellow "FreeMarker template error!". During development, that's not a problem, but on a production site you don't want to confuse your visitors with cryptic Java errors.

Unfortunately, it's not that easy to turn those errors off, and you probably do want people to report these errors because they might indicate a serious bug in your website.

For this purpose i wrote a small Javascript function that you can use to 'prettify' the Freemarker error. It replaces the stacktrace with a general error message, but the user can still see the original error by clicking on a link. The script requires jQuery, which is included in the STK or can be downloaded from jQuery.com. To run in, just add it to your $(document).ready() function.

function hideFreemarkerErrors() {
    $("xmp").each(function() {
        var $b = $(this).parent().parent().parent().find("b");
        
        if ($b.html() === null) {
            return true;
        }

        if (!$b.html().match(/freemarker/i)) {
            return true;
        }

        $b.parent().attr('style', '').html(''.concat(
            '<div class="box freemarker-error"><h1 style="color:red;font-size:1.8em;',
            'border-bottom: 10px solid red;">',
            'Error</h1><p>This page contains an error and can not be shown as intended. ',
            'Please mail our technical support to report this error: ',
            '<a href="mailto:techsupport@example.com">techsupport@example.com</a>',
            '</p><p><a href="" class="freemarker-error">Click here to see the ',
            'full error report</a></p>',
            '<textarea rows="40" cols="80" class="freemarker-error" style="display:none; ',
            'font-size:1.2em;overflow:auto;">',
            $(this).html() , '</textarea></div>'
        ));

        $("a.freemarker-error").click(function() {
            $("textarea.freemarker-error").slideToggle();
            return false;
        });
    });
}

$(function() {
    hideFreemarkerErrors();
});

How to use Javascript to make Freemarker errors less intrusive

Labels

Comments (1)

Ernst Bunders says: