Question

I’m been trying to wrap javascript try/catch as seen on http://pastebin.com/f579d999d

It works well, it basically wrap everything in a try/catch letting you catch errors like this:

$.handleErrors(function(e){
    console.log("an error occurred");
    console.log(e);
});

(and then I’m going to post it to server)

However, this does not work for draggables or resizables (but for everything else). If you start to drag/resize an element, it doesn’t stop on mouse up (making the drag forever)

It appears as if the ofn.apply() doesn’t work on draggable/resizable.

Specifically (shortened):

          ofn = fn;
          wfn = function() {
                ofn.apply(this, arguments);
          };
          fn = wfn;

But for all other events.

Code block):

     $.fn.bind = function(type, data, fn) {
       var ofn, wfn;
       if (!fn && data && $.isFunction(data)) {
          fn = data;
           data = undefined;
      }
       if (fn && type.indexOf("error") === -1) {
          ofn = fn;
          wfn = function() {
             try {
                ofn.apply(this, arguments);
             } catch(e) {
                handler(e);
                return false;
             }
          };
          fn = wfn;
       }
       return jbind.call(this, type, data, fn);

I’m pretty much lost here, and I can’t find any resource saying why this shouldn’t work (I can’t even find anyone who has the same issues)

So my question is:

1. Does the above method seem like an OK way to catch errors with jQuery
2. Has anyone experienced the same issue (and fixed it)
3. Do I misunderstand something and I should simply not call this on draggable events

Regards,
Niklas

Update 2011-08-28, the full code (working) is now:

jQuery.fn.bind = function( type, data, fn ) { 
    if ( !fn && data && typeof data == 'function' ) {
        fn = data;
        data = null;
    }

    if ( fn )
    {
        var origFn = fn;
        var wrappedFn = jQuery.proxy(origFn, function () { 
            try {
                origFn.apply( this, arguments );
            }catch ( ex ) {
                return trackError( ex );
           }
        });
        fn = wrappedFn;
    }
    return jQueryBind.call( this, type, data, fn );
};

If anyone has more tips on how to improve it (the original function is from http://blogs.cozi.com/tech/2008/04/javascript-error-tracking-why-windowonerror-is-not-enough.html) please let me know in a comment.

Answer 1

Re: 1 – We do the same thing, and it seems to work pretty well.

Re: 2 – Yes. What’s happening is jQuery UI isn’t able to unbind “mousemove.draggable” once you wrap the original function. The fix is to add the line below (adapted from jQuery’s proxy function):

// Set the guid of unique handler to the same of original handler, so it can be removed
wfn.guid = ofn.guid = ofn.guid || wfn.guid || jQuery.guid++;