如何对通过Mocha接收选择元素的JS函数进行单元测试？

Question

我想对以下JS函数进行单元测试：

let convert = {};

convert.f = function f(element)
{
    options = Array.from(element.options);
    options.forEach(function (item, index) {
        item.removeAttribute('selected');
    });
}

module.exports = convert;

预期会收到一个选定的DOM元素，并将选定的属性删除到其选项。

我目前正在使用Mocha使用以下测试代码对其进行测试：

let convert = require('../../main/webapp/WEB-INF/js/helper.js')

var assert = require('assert');

describe('Function', function() {
  describe('#f()', function() {
    it('should work', function() {
      var selectedOption = [{}]
      var options = [{}]
      var element = { className: '', tag: 't', name:'a', id:'b', selectedOptions: selectedOption, options: options };
      convert.f(element);
    });
  });
});

当前，我收到“ TypeError：item.removeAttribute不是函数”。我已经知道这不是正确的方法，因此我需要帮助以了解对单元代码进行最佳测试的最佳方法。任何帮助将不胜感激。

Answer 1

您需要模拟包含选项数组的select元素对象，其中每个选项都具有以下内容：

• 属性为selected的属性，对于具有selected属性的选项，此属性为true
• removeAttribute功能

select元素对象应该看起来像这样

const removeAttr = function() {
    this.selected = false;
};

const select = {
    options: [
      { selected: true, value: 1, removeAttribute: removeAttr  },
      { selected: true, value: 1, removeAttribute: removeAttr  },
      { selected: true, value: 1, removeAttribute: removeAttr  },
    ]
};

参见此demo。打开外壳并运行npm test命令。在此演示中，我已将chai用作断言库。

要在Mac上打开外壳，请按命令 + shift + S。在Windows上，按右下角的?图标，然后从菜单中单击键盘快捷键选项。