Why isn't this function returning anything?

Question

I'm trying to debug some tests - I have the following code:

test('Can get the test Side',
        function () {
            stop();
            debugger;
            var result = getTestSide();
            debugger;
            changeTestSide(result);
        }
    );
    

    // Step 1: Get test side
    function getTestSide() {
        $.ajax({
            type: 'GET',
            url: urlWithId,
            success: function (result) {
                return "test success";
                debugger;
                ok(true, "GET succeeded.");
                if (!result.SideId === testSideId) {
                    throw "GET result does not equal testSideId";
                } else {
                    ok(true, "Returned key matches testSide Id.");
                    return result;
                }
            },
            error: function (result) {
                return "test failure";
                debugger;
                throw "Error";
            }
        });
    };

No matter what, "result" in the top method is always undefined. Why is this? Whether getTestSide succeeds or fails, I'm returning a string.

Your ajax call is asynchronous, and so return values from the "success" or "error" functions won't affect anything. You cannot structure your code that way in an asynchronous system. — Pointy, Mar 17 '13 at 18:45

score 0 · Answer 1 · answered Mar 17 '13 at 18:49

0

You should invoke changeTestSide method from the success and error handlers

answered Mar 17 '13 at 18:49

user20140268

1,313
11
16

score 0 · Answer 2 · answered Mar 17 '13 at 18:51

You need to fix a few things here:

success: function (result) {
    return "test success";
    debugger;
    ok(true, "GET succeeded.");
    if (!result.SideId === testSideId) {
        throw "GET result does not equal testSideId";
    } else {
        ok(true, "Returned key matches testSide Id.");
        return result;
    }
},

First off, you need to call changeTestSide(result); from the success function in your AJAX. This is because AJAX is by default an asynchronous call, meaning that your javascript doesn't wait for getTestSide() to finish executing before continuing in your test function. Second, in your success function, the first thing that you're doing is return "test success"; which will make the function return, and none of the code below that is ever actually running. Here is a better example of what your code needs to be like:

success: function (result) {
    debugger;
    ok(true, "GET succeeded.");
    if (!result.SideId === testSideId) {
        throw "GET result does not equal testSideId";
    } else {
        ok(true, "Returned key matches testSide Id.");
        changeTestSide(result);
    }
},

score 0 · Accepted Answer · answered Mar 17 '13 at 18:52

Using return inside a nested function returns only from that function. Your code must be structured quite differently to get the effect you want. One way to do this is to pass a callback function into getTestSide that will handle the response, like this:

test('Can get the test Side',
    function () {
        stop();
        debugger;
        getTestSide(function (result) {
            changeTestSide(result);
        });
    }
);


// Step 1: Get test side
function getTestSide(cb) {
    $.ajax({
        type: 'GET',
        url: urlWithId,
        success: function (result) {
            // removed this because it stops the rest from running
            // return "test success";
            ok(true, "GET succeeded.");
            if (!result.SideId === testSideId) {
                throw "GET result does not equal testSideId";
            } else {
                ok(true, "Returned key matches testSide Id.");
                // Call the callback instead of returning.
                cb(result);
            }
        },
        error: function (result) {
            // removed this because it stops the rest from running
            // return "test failure";
            debugger;
            throw "Error";
        }
    });
};

You've also used throw inside your success and error callbacks; these will also not do what I think you expect them to do, since by the time these functions are running your test function has already returned and so there is no way for you to catch those exceptions. Your code didn't show any attempt to catch the exceptions anyway so I didn't attempt to address this, but you can address it by following a similar pattern to the $.ajax function and providing both success and error callbacks that the caller can then implement.

Why isn't this function returning anything?

3 Answers3