javascript event handling

I'm working on a very lightweight system to test a javascript framework开发者_Python百科 I am building for work.

I've created a test function that acts as a wrapper invoking the function i am testing within a try/catch to report feedback without breaking my test cycle. The problem is that my catch isn't getting called when I deliberately create an error.

My code....

    /// <summary>
    ///     Acts as a wrapper to allow us to perform and report the result 
    ///     of each individual
    ///     test without blocking further tests.
    /// </summary>
    /// <param name="selector" type="String">
    ///     The id jQuery selector e.g #versionTests to repot feedback to.
    /// </param>
    /// <param name="testFunction" type="Function">
    ///     The test function to call.
    /// </param>
    test: function (selector, testFunction) {

        try {
            // now we are calling our own callback function
            if (typeof testFunction === 'function') {

                testFunction.call();
            }
        } catch (e) {

       jQuery(selector).addClass("error").append("<p>" + e.description + "</p>");

        }

    }

Thanks in advance....

EDIT.. Added called code for clarity.

The test function that I am calling is basically on that calls this....

    testEqualizeHeight: function () {

        PeachUI("div.heightTest").equalizeHeight();
    }

Which calls this....... (this.selector is a property that reflect jQuerys selector.) note the missing '$' on $selector.height(tallest);

equalizeHeight: function () {
    /// <summary>
    ///     Equalizes the height of the specified element(s).
    /// </summary>

    var $tallest = 0, $selector = this.selector;

    $selector.each(function () {

        var $height = jQuery(this).height();

        if ($height > $tallest) {

            $tallest = $height;
        }
    });

    // ie6 height is the same as min-height for other browsers.
    if (PeachUI.browser.ie6) {

        $selector.height(tallest);

    } else {

        $selector.css("min-height", $tallest);
    }
}

When looking in your source code it appeared to me that you do this remarkable thing (last lines):

PeachTest.test("#versionTests", PeachTest.testVersion());
PeachTest.test("#browserTests", PeachTest.testBrowser());
PeachTest.test("#isNumericTests", PeachTest.testNumeric);
PeachTest.test("#heightTests", PeachTest.testEqualizeHeight());

Here you pass a reference to PeachTest.testNumeric to PeachTest.test, but you're calling the other three test functions and pass the values those functions return to PeachTest.test.

Remove the function call operators (()) behind those parameters and your test function works as expected.

You actually don't need to invoke .call(). You can just use:

testFunction();

if you want to setup the execution context explicitly, you can use .call(context, param1, param2, ..)

How do you "deliberately" create an error? Try to throw an exception within testFunction like

throw new Error('Foo Bar');

Last thing to mention here is, that the exception object does not own the property description but message.

Example: http://www.jsfiddle.net/RUeEm/

Either testFunction is not getting called (it is wrapped in a conditional), or your code to add the error is incorrect.

I would use a debugger to trace the test execution and verify that it is following the path you think it is. Or console.logs()