javascript - 使用 Jasmine 测试客户端 javascript 代码

Question

我的 JavaScript 代码如下所示:

this.ProgressBarUpdater = {
  poll: function() {
    setInterval(ProgressBarUpdater.request, 5000);
  },

  request: function() {
    $(".progress_bar_updater[data-url]").each(function(i, elem) {
      url = $(elem).data("url");

      $.getJSON(url, function(data) {
        if (isFinished(data)) {
          location.reload();
        };

        $.each(data, function(key, val) {
          updateProgressBar(key, val);
        });
      });
    });
  }
};

isFinished = function(obj) {
  var correct = true;
  for (key in obj) {
    var progress = typeof obj[key] == 'string' ? obj[key] : obj[key][1];
    if (progress != '100%') correct = false;
  }
  return correct;
}

updateProgressBar = function(key, val) {
  var progress_info_value = typeof val == 'string' ? val : val[0];
  var progress_bar_value = typeof val == 'string' ? val : val[1];
  $(key + ' .progress_info').html(progress_info_value);
  $(key + ' .progress-bar').width(progress_bar_value);
}

如何使用 Jasmine 进行测试？我找不到任何关于此的好的教程...

Answer 1

通常很难测试对象。

你可以做什么:

1. 创建您的函数正在使用的元素
2. 将它们放入 DOM
3. 调用您的函数
4. 检查元素
5. 从 DOM 中删除元素

将其视为一种激励:

describe('Test ProgressBarUpdater', function() {
    var elements = [];

    beforeAll(function() {
        // create elements and put into array

        elements.forEach(function(elem) {
            document.body.appendChild(elem);
        });
    });  

    afterAll(function() {
        // remove all elements from DOM
    });  

    it('call functions...', function() {
        // call the functions to test

        // check the elements
    });
});