Sunday, 15 September 2013

Better way to test .animate with qUnit

Better way to test .animate with qUnit

Getting to know TDD i wrote a simple test suit for moving dom elements to
the left.
I testing animations I need to wait for them to finish. I didn't want to
use promises since it feels like monkey patching and I ended up using
qUnit example form:
test("move 50", function () {
//Creates an element for testing and attaches to document
var el = appendToTest();
ok(el.css('left') == "auto", "element 0");
stop();
moveLeft(el, 50, 100);
setTimeout(function () {
equal(el.css("left"), "50px");
start();
}, 101);//Timeout duration
});
full fiddle
The test fails on all jQuery versions but 2.x (edge)
failed
Expected:
"50px"
Result:
"49.69220733642578px"
Diff:
"50px" "49.69220733642578px"
Incrementing the timeout duration enough makes the test pass so I figured
the animation didn't finish before being probed for the left property.
But this doesn't seem right. Having to guess how long to wait. Is there a
better way to do this?

No comments:

Post a Comment