简体   繁体   English

QUnit测试间歇性失败

[英]QUnit tests failing intermittently

Below is my javascript file that shows the sum of two numbers. 以下是我的JavaScript文件,其中显示了两个数字的总和。

var getSum = function (arg1, arg2) {
    var intArg1 = parseInt(arg1);
    var intArg2 = parseInt(arg2);
    return intArg1 + intArg2;
};

var getSumText = function (arg1, arg2) {
    var sum = getSum(arg1, arg2);
    return 'The sum of ' + arg1 + ' and ' + arg2 + ' is ' + sum + '.';
};

$(document).ready(function () {
    $("#button1").click(function (e) {
        console.log('button clicked');
        var sumText = getSumText($("#arg1").val(), $("#arg2").val());
        $("#output1").text(sumText);
        e.stopPropagation();
    });
});

Here's my QUnit.html file. 这是我的QUnit.html文件。

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8" />
    <title>Test Suite</title>
    <link href="Content/qunit-1.12.0.css" rel="stylesheet" />
    <script src="Scripts/jquery-2.0.0.min.js"></script>
    <script src="Scripts/qunit-1.12.0.js"></script>
    <script src="Scripts/main.js" data-cover></script>
    <script src="Scripts/mainTests.js"></script>
    <script src="Scripts/blanket.min.js"></script>
</head>
<body>
    <h1 id="qunit-header">Test Suite</h1>
    <h2 id="qunit-banner"></h2>
    <div id="qunit-testrunner-toolbar"></div>
    <h2 id="qunit-userAgent"></h2>
    <ol id="qunit-tests"></ol>
    <div id="qunit-fixture">
        <input type="text" id="arg1" />&nbsp;
        <input type="text" id="arg2" /> <br />
        <div id="output1">&nbsp;</div>
        <input type="button" id="button1" value="Show sum" />
    </div>
        <script type="text/javascript">function blanket_toggleSource(e) {
    var t = document.getElementById(e);
    t.style.display === "block" ? t.style.display = "none" : t.style.display = "block";
}</script>
</body>
</html>

And here's my js tests file. 这是我的js测试文件。

module('DOM');
test('should add correctly', 1, function() {
    $('#arg1').val('2');
    $('#arg2').val('5');
    console.log($('#arg1').val());
    console.log($('#arg2').val());
    $('#button1').trigger('click');
    var output = $('#output1').text();

    equal(output, 'The sum of 2 and 5 is 7.', 'sum text is correct');
});

module('Sum');
test('should add correctly', 1, function() {
    var sum = getSum('2', '1');
    deepEqual(sum, 3, 'sum is correct');
});

If I move the 'Sum' module above the 'DOM' one, the test in the DOM module fail intermittently. 如果我将“求和”模块移到“ DOM”模块上方,则DOM模块中的测试会间歇性地失败。 What am I missing? 我想念什么?

Thanks, Arun 谢谢,阿伦

You need to separate the library code, that you can test, from the initialization code, that you don't really need to test in this case. 您需要将可以测试的库代码与初始化代码分开,在这种情况下,您实际上不需要进行测试。 Move the code inside the click handler into another named function and called that from a separate script tag or file. 将单击处理程序内的代码移动到另一个命名函数中,并从单独的脚本标记或文件中对其进行调用。 That way you can test all three functions from your tests. 这样,您可以从测试中测试所有三个功能。 Currently you end up with document-ready executing code at a some point in time, while your tests run at another. 当前,您最终会在某个时间点获得准备好文档的执行代码,而测试则在另一个时间点运行。 That causes the seemingly random behaviour you're seeing. 这会导致您看到的看似随机的行为。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM