Question

我想开始使用测试框架，mocha +期望对我好。

说我有这个功能，

/*
 * Hides or shows loading .gif
 * show : boolean
 */
function loadingMsg(show) {
    var $loader = $("#loader");
    if(show){
        $loader.show();
    }
    else{
        $loader.hide();
    }
}

为了使其可测试，我是否需要添加如下所示的Return语句？

/*
 * Hides or shows loading .gif
 * show : boolean
 */
function loadingMsg(show) {
    var $loader = $("#loader");
    if($loader){
        if(show){
            $loader.show();
            return "loader shown";
        }
        else{
            $loader.hide();
            return "loader shown";
        }
    }
    else {
        return "$loader undefined";
    }
}

或者我应该测试dom元素“loader”吗？

Answer 1

不，你没有。

而是检查DOM中的loader元素显示属性。

评论后更新：

没有使用摩卡的大部分内容，但是在测试用户界面时，它几乎在每个框架或图书馆都有类似的方式。使用jQuery或您可用的任何选择器库在DOM中查找元素，并根据需要检查它们的内容。在您的情况下，您将检查加载器元素是否为显示块或显示无。

等等何时显示装载机

expect($('#loader').css('display')).toBe('block');

隐藏加载程序时

expect($('#loader').css('display')).toBe('none');

Answer 2

最佳做法是：您的测试不应要求修改测试代码，以便它们可以通过/失败。因此，您不应该像您所建议的那样添加退货声明，您也不应该进行测试＆＃39;可以传递给函数的标志，以启用某些特殊的测试状态。

所以简单的答案是：不，你不应该添加返回语句。

但只是问题的构成本身对我来说听起来像是你对DOM测试的新手？听起来您希望单元测试您在那里采样的代码，可能在应用程序的其余部分之外？

假设这是真的，那么也许你应该看看像mocha-jsdom这样的东西;我希望你能够编写如下的测试：

describe('mocha tests', function () {
  var $;
  jsdom();

  before(function () {
    $ = require('jquery'); // Sets up jQuery to be available
  });

  describe('with visible=false', function() {
    it('shows the loader', function () {
      document.body.innerHTML = '<div id="loader">My faked loader</div>'
      loadingMsg(false);
      expect($("#loader:visible").length).eql(0)
    });
  });
});

注意：我不能保证代码片段能够正常工作，只是一个例子（并且主要是从mocha-jsdom页面中窃取的！）。

测试，我是否需要在函数中添加更多的Return语句？

2 个答案: