IE Function label bug

I've spent the best part of two days this week tracing and solving a bug raised against the Alfresco Share implementation of FullCalendar that I recently did. The error thrown up is: Object doesn't support this property or method. I've not found anything in Google about this, hence this post.

To cut a long story short, the bug wasn't in FullCalendar, nor in jQuery. It was in the way Internet Explorer (I believe versions 6 - 9) interprets the way we define anonymous functions.

The context:

We use this pattern a lot:

   var fnName = function someLabel()
   {
      // function contents  
   }

This helps us out massively during development since someLabel pops up in debug and we can find out where that function has been defined or overridden due to our naming conventions.

The Problem:

However (and this was the confusing part) in IE (I've tested in 8 and 10, but bug was reported against 7 as well) this pattern also results in a function being defined in the root scope with that label. So: window.someLabel is the same function we just defined as "fnName". It's easy to see how that could get messy.

In our case we had a function defined with a label of nodeName. Now, element.nodeName is frequently used to check the type of an element, usually after converting its case, and if it's a function then (e.g.) .toLowerCase() errors: Object doesn't support this property or method, which is understandable.

The tests I've done show this behaviour doesn't happen in Webkit or in Firefox and also that the version of IE 10 recently shipped with the Windows 8 preview doesn't do it either. I've got a test case if you're interested.

The Solution:

The work around is quite easy, just wrap the defining code in a self executing function block to create a closure and the someLabel function isn't created on the window object:

   (function()
   {
      var fnName = function someLabel()
      {
         // function contents  
      }
   })();