为什么 Qunit 没有捕捉到我正在运行的 2+ 测试？

Question

我正在尝试在 Qunit 中进行一系列测试。我正在使用 JQM 并且正在使用他们的测试套件，其中包括一个 $.mobile.testHelper 对象，我正在向其中添加方法。

这是我的代码（带有 cmets 和日志）：

// my test page is loaded inside an iframe
var frame = document.getElementsByTagName("iframe")[0];
var d = frame.contentDocument;
var w = frame.contentWindow;
var $i = w.$(d);
var $body = w.$("body");

// forcing $(body) as event target
$.testHelper.eventTarget = $body;

// sets "one" listener on "step" event and jumps to next method when triggered
$.testHelper.stepSequence = function (fns) {
    $.testHelper.eventSequence("step", fns);
};

// run a test
$.testHelper.runTest = function (command, condition) {
    console.log("RUNNING TEST...");
    ok(condition, command);
};

// try 10x if a condition is met, wait 1000ms in between
$.testHelper.countDown = function (arr, command) {
    var condition, is_done;
    var ticker = 0;
    var i = w.setInterval(function () {

    switch (command) {
        case "verifyAttribute":
            condition = $i.find(arr[0]).eq(0).attr(arr[1]).indexOf(arr[2]) > -1;
            break;
        case "waitForElementPresent":
            condition = $i.find(arr[0]).length > 0;
            break;
        }
        if (condition) {
            console.log("CONDITION PASSED, RUN TEST");
            $.testHelper.runTest(command, condition);
            w.clearInterval(i);
        }
        ticker += 1;
        console.log(ticker);
        if (ticker === 10) {
            console.log("FAILED, RUN WITH undefined to fail test");
            $.testHelper.runTest(command, condition);
            w.clearInterval(i);
        }
    }, 1000);
};

// my test module
module("UI Basic Interaction");
asyncTest("${base_url}", function () {
    expect(2);

    // here is my sequence of methods
    $.testHelper.stepSequence([
        function () {
            w.setTimeout(function () {
                $body.trigger("step");
            }, 800);
            $.testHelper.countDown(["div#global-panel", undefined, undefined],         "waitForElementPresent");
        },
        function () {
            w.setTimeout(function () {
                $body.trigger("step");
            }, 800);
            $("a:contains('Menu')").trigger("click");
        },
        function () {
            w.setTimeout(function () {
                $body.trigger("step");
            }, 800);
            $.testHelper.countDown(["div#global-panel", "class", "ui-panel-open"], "verifyAttribute");
        },
        function () {
            w.setTimeout(function () {
                $body.trigger("step");
            }, 800);
            $("h1:contains('My Account')").trigger("click");
        },
        function () {
            start();
        }
    ])
});

我需要在测试条件运行后触发“步骤”，但无法让它工作，所以我使用了不合适的setTimeout

我的问题是第一个测试通过，第二个测试正确开始间隔，同时 UI 呈现，但是当找到元素时，QUNIT 几乎在我的控制台报告条件的同时出现Expected 2 assertions, but 1 were run是真的。

问题：
从上面的代码中，我的测试例程中是否有错误，因为 Qunit 出错了，runTest“快”的运行不够？我也很高兴有更好的方法来触发"step"。

谢谢！

Answer 1

好的。经过多方干预：

出了什么问题：

• 我的点击选择器是 $(element:contains(...)，它搜索了文档而不是 iframe $i.find("eleme... 修复了这个问题。
• 我为 test_runner 添加了第二个侦听器，它会在测试运行时触发。只有在所有测试都运行后，我才会触发start()。这样 Qunit 必须等待 :-)

和工作代码（见 cmets (1), (2), (3) 的变化）：

var frame = document.getElementsByTagName("iframe")[0];
var d = frame.contentDocument;
var w = frame.contentWindow;
var $i = w.$(d);

// (1) set counter for tests ran 
// This allows to trigger start() after all tests are done
var test_log = 0;
var $body = w.$("body");

$.testHelper.eventTarget = $body;
$.testHelper.stepSequence = function (fns) {
    $.testHelper.eventSequence("step", fns);
};
$.testHelper.runTest = function (command, condition) {
    ok(condition, command);
    $body.trigger("step");
    // (2) When running a test, also trigger a runner on body to log no of tests
    $body.trigger("test_runner");
};
$.testHelper.countDown = function (arr, command) {
    var condition, is_done;
    var ticker = 0;
    var i = w.setInterval(function () {
        switch (command) {
        case "verifyAttribute":
            condition = $i.find(arr[0]).eq(0).attr(arr[1]).indexOf(arr[2]) > -1;
            break;
        case "waitForElementPresent":
            condition = $i.find(arr[0]).length > 0;
            break;
        }
        if (condition) {
            console.log("PASSED TEST");
            $.testHelper.runTest(command, condition);
            w.clearInterval(i);
        }
        ticker += 1;
        if (ticker === 10) {
            console.log("FAILED");
            $.testHelper.runTest(command, condition);
            w.clearInterval(i);
        }
    }, 1000);
};

module("UI Basic Interaction");
asyncTest("${base_url}", function () {
    expect(2);
    $.testHelper.stepSequence([
        function () {
        // (3) set a listener for tests ran
        // once all tests are done, start()
            $body.on("test_runner", function (e) {
                test_log += 1;
                if (test_log === 2) {
                    start();
                }
            });
            $body.trigger("step");
        },
        function () {
            $.testHelper.countDown(
                ["div#global-panel", undefined, undefined], 
                "waitForElementPresent"
            );
        },
        function () {
            $i.find("a:contains('Menu')").trigger("click");
            $.testHelper.countDown(
                ["div#global-panel", "class", "ui-panel-open"], 
                "verifyAttribute"
            );
        },
        function () {
            $i.find("h1:contains('My Account')").trigger("click");
        }
    ])
});

维奥拉。效果很好。