I'm using QUnit 2.0.1 to unit test an existing code base. I've got a function that makes an ajax call and then enables a button and sets a boolean. I'm trying to write a QUnit test to assert that the button is enabled and the boolean is false after calling the function.
My function with the ajax call:
self.saveComment = function() {
if(self.isEditing())
{
$('#saveCommentButton').attr('disabled', 'disabled');
var comment = self.newComment();
var data = {
newCommentText : comment,
objectId: objectId,
objectType : objectTypeId
};
$.ajax({
type: "POST",
url: "addBOComment.action",
data: data,
success: function(comments){
self.comments(comments);
$('#saveCommentButton').attr('enabled', 'enabled');
self.isEditing(false);
}
});
}
};
My QUnit test:
QUnit.test("test saveComment() - async", function(assert){
$('#qunit-fixture').append('<input type="button" id="saveCommentButton" disabled="disabled"/>')
model.isEditing(true);
model.newComment("qunit test for comments");
var done = assert.async();
window.setTimeout(function() {
model.saveComment(); //function with ajax call
assert.equal(model.isEditing(), false, 'success');
assert.equal($('#saveCommentButton').attr("enabled"), "endabled", 'success');
done();
}, 150);
});
The test runs, but success is never called so my button is disabled and my boolean is still true. What am I doing wrong?