I have a simplified QUnit test which consists of 2 simple tests that fails randomly/alternately for no good reason (They are both atomic, meaning that one test doesn't change anything of the other element)

Please see this jsFiddle try to run multiple times

module("Basic actionBind");
//two simple tests
test("action1", function() {
    ok(ele2.trigger("click").hasClass("clicked"), "basic click action");
});

test("action2", function() {
    ok(ele1.click().hasClass("clicked"), "basic click action");
});

I have a simplified QUnit test which consists of 2 simple tests that fails randomly/alternately for no good reason (They are both atomic, meaning that one test doesn't change anything of the other element)

Please see this jsFiddle try to run multiple times

module("Basic actionBind");
//two simple tests
test("action1", function() {
    ok(ele2.trigger("click").hasClass("clicked"), "basic click action");
});

test("action2", function() {
    ok(ele1.click().hasClass("clicked"), "basic click action");
});

• javascript
• jquery
• unit-testing
• qunit

• What does the second test do? I'm not sure what the click function does without any arguments. – Paul Grime Commented May 8, 2013 at 18:03
• the click function itself without arguments trigger's a click – adardesign Commented May 8, 2013 at 18:05
• Very strange. I've updated to include the two tests twice, and made them async with random pauses, but only one test runs. It's like click/trigger gives up after the first. jsfiddle/bAbNd/1. – Paul Grime Commented May 8, 2013 at 18:36
• Same deal with dispatchEvent? jsfiddle/bAbNd/2 – Paul Grime Commented May 8, 2013 at 18:45
• That happens because the first failed test will run first the next time. – gustavohenke Commented May 8, 2013 at 20:34

2 Answers 2

Your QUnit code looks fine.

The problem is in the caching of the jQuery objects in the global context at run-time. Here's two snippets from your code _{(from the link in your question: http://jsfiddle/adardesign/aZRK7/12/):}

HTML:

<div id="qunit-fixture">
    <span id="ele1" class="action" data-action="action1"></span>
    <span id="ele2" class="action" data-action="action2" ></span>
</div>

JS:

// caching elements
var $ele1 = $('#ele1'),
    $ele2 = $('#ele2');

test('action1', function(assert) {
    assert.ok($ele2.trigger('click') ....


test('action2', function (assert) {
    assert.ok($ele1.trigger('click') ....

The actual elements are inside the #qunit-fixture which is reset and re-parsed for each test, thus the click events you fired from inside the tests were triggered on the elements that are now no longer in the document. Instead, those elements have been detached and #qunit-fixture has been re-created from the original HTML string, thus creating new DOM elements.

I've forked your jsFiddle and revised it accordingly: http://jsfiddle/aZRK7/15/

I cleaned up various parts before I noticed it, the essential change is moving the query for the element from outside to inside your test:

test('foo', function(assert) {
    var $foo = $('#ele1');
    assert.ok($foo.trigger('click') ....


test('bar', function(assert) {
    var $bar = $('#bar');
    assert.ok($bar.trigger('click') ....

EDIT: Looks like OP took out the async part of the code, leaving the answer in case any stumbles onto this, but it does not answer the question now.

Well, I'm not sure what issues you might be having the the test itself, but any AsyncTest must have a start(); call somewhere. So from your fiddle:

asyncTest("action1", delay.bind(null, function() {
  console.log("test1");
  ok(ele2.trigger("click").hasClass("clicked"), "basic click action");

  start();

}, 2000*Math.random()));

From the QUnit asyncTest documentation, see their examples.