IE bug with SyntaxHighlighter and jQuery - “Unable to get value of the property 'slice': object is null or undefined”

Question

I really love SyntaxHighter - it turns out the poshest looking code around. Unfortunately I've barked my shins against an appalling JS error in IE7 and IE8 which is going to prevent me using this otherwise excellent plugin altogether.

Here's a test case. I'm including

<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>

in my header so IE7 and IE8 can recognise HTML5 elements.

In the body of my test page I've just got a few nav items:

<nav id="top-nav" class="f16 clearfix">
    <ul id="nav-menu">
        <li><a href="index.htm">Home</a></li>
        <li><a href="branding.htm">Branding</a>
            <ul class="nav-submenu">
                <li><a href="logos1">Logos 1</a></li>
                <li><a href="logos2">Logos 2</a></li>
                <li><a href="logos3">Logos 3</a></li>
            </ul>
        </li>
    </ul>
</nav>

There's nothing else apart from these includes for JQuery and SyntaxHighlighter, and this little script which initialises SyntaxHighlighter and tries to add an event listener to the nav menu.

<script src="extra/syntax-highlighter/shCore.js"></script>
<script src="extra/syntax-highlighter/shBrushJScript.js"></script>
<script src="extra/syntax-highlighter/shBrushXml.js"></script>
<script>
    SyntaxHighlighter.all();

    $(document).ready(function(){
        $('#nav-menu').on('mouseenter', function () {
            $(this).children('.nav-submenu').fadeIn('fast');
        })
    })
</script>

When I view this page in IE7 and IE8 I get the error "SCRIPT5007: Unable to get value of the property 'slice': object is null or undefined" and my jQuery fails to work.

From reading around I understand this may have something to do with XRegExp, which SyntaxHighlighter uses. According to this jQuery bug ticket there was some error in XRegExp which was fixed in XRegExp 1.5.1. Unfortunately this fix doesn't seem to have found its way to SyntaxHighlighter. There was a discussion of a similar bug on SyntaxHighlighter's Bitbucket page. I tried the modified XregExp.js and shCore.js files one guy produced, but it didn't fix my problem.

Has anyone else come across this kind of thing? Otherwise I'll have to use some other crappy syntax highlighter!

Answer 1

I was having the same issues in IE7/8

I finally fixed them by grabbing the latest version of the plugin from GitHub (https://github.com/alexgorbatchev/SyntaxHighlighter) which is more up to date than the repository on BitBucket.