Asynchronous JavaScript Testing with QUnit


I’m implementing a feature that does some stuff when an IFRAME is finished loading.  Due to the inherent asynchronous nature of this functionality, it was hard to test.  I was trying to use QUnit, but having issues, until I found this post:

http://markdotmeyer.blogspot.com/2008/07/javascript-unit-testing-with-qunit.html

The summary?  Check out the stop() and start() functions.

Now, I can write my test like this:

test("addWindow should remove the loadingStauts div after the iframe is loaded", function() {
<span class="kwrd">var</span> loadingStatus = $(<span class="str">"&lt;div&gt;&lt;/div&gt;"</span>).attr(<span class="str">"id"</span>, <span class="str">"loadingDiv"</span>);

<span class="kwrd">var</span> stack = $(<span class="str">"&lt;div&gt;&lt;/div&gt;"</span>)
                .attr(<span class="str">"id"</span>, <span class="str">"stackDiv"</span>)
                .appendTo(<span class="str">"#stack"</span>)
                .windowStack()
                .withLoadingStatus(loadingStatus);

stack[0].addWindow(<span class="str">"Blank_for_iframe_testing.htm"</span>, <span class="str">""</span>);

stop();

setTimeout(<span class="kwrd">function</span>() {
    equals(loadingStatus[0].parentNode, <span class="kwrd">null</span>, <span class="str">"loadingStatus DIV should be removed after the iframe is loaded"</span>);
    start();
}, 500);

});

← Oxite Review
VAN (Virtual ALT.NET Meeting) Update →