javascript - 如何为包含 SAPUI5 Core API 的函数编写单元测试?

标签 javascript unit-testing sapui5 sinon qunit

我是使用 UI5 的 qUnit 的新手。

我想测试一个函数 formatter.js

formatDate: function(sTimeStamp) {
  if (sTimeStamp) {
    var iTimeStamp = Number(sTimeStamp.match(/\d/g).join("")), 
        oDateTimeFormat = DateFormat.getDateTimeInstance(); 
    return oDateTimeFormat.format(new Date(iTimeStamp));
  }
  return sTimeStamp;
},

对其进行单元测试:

function formatDateTestCase(assert, sValue, fExpectedNumber) {
  var fDate = formatter.formatDate(sValue);
  assert.strictEqual(fDate, fExpectedNumber, "Format Date was correct");
}

QUnit.test("Should return valid date", function (assert) {
  formatDateTestCase.call(this, assert, "/Date(1510026665790)/", "Nov 7, 2017, 11:51:05 AM");
});

显然,当我更改语言设置时,此测试用例将失败。如何改进?


我认为这里的主要问题是 formatDate 是一个有副作用的函数。我应该改进这个功能本身吗?通过在 formatDate 中添加语言环境?

或者我应该在测试用例中使用 DateFormat 吗?这将使我的测试毫无意义。

最佳答案

我认为您应该在此处模拟对 DateFormat 的调用,以便能够独立测试您的代码。

单元测试注意事项

严格来说,单元测试的重点是测试您的 - 并且只测试您的 - 单元。您不应测试任何依赖的 API。总的来说,人们可能会对此争论不休,但我绝对不建议测试 SAPUI5 API。

另一方面,我强烈建议使用无效参数(例如 undefined)和无效字符串测试 if 语句和 Regex 部分。这将确保您的格式化程序始终工作并返回某物。如果它是一个空字符串,则有意义。

Sinon.JS:模拟、 stub 和 spy

您应该在您的特定测试中对 DateFormat.getDateTimeInstance() 进行 stub ,以便该方法返回可预测的值(例如,想想 DateFormat 中的 I18N,这会给您不同的测试结果不同的语言)。

要做到这一点,SAPUI5 已经附带了 Sinon.JS (注意包含的版本:SAPUI5 1.44 -> Sinon.JS 1.14)。这是一个基本示例:

sap.ui.define([
  "my/module/formatter",
  "sap/ui/core/format/DateFormat",
  "sap/ui/thirdparty/sinon",
  "sap/ui/thirdparty/sinon-qunit"
], function (formatter, DateFormat) {

  QUnit.test("Should return valid date", function (assert) {
    // stub the method
    sinon.stub(DateFormat, "getDateTimeInstance");
    // ensure a predictable outcome
    DateFormat.getDateTimeInstance.returns({
      format: function(oDate) {
        return oDate.getTime();
      }
    });

    var fDate = formatter.formatDate("/Date(1510026665790)/");
    assert.strictEqual(fDate, "1510026665790", "Format Date was correct");
    // Optional: test if the stubbed function was called
    assert.ok(DateFormat.getDateTimeInstance.calledOnce);

    // don't forget to restore the stub so that it does not interfere with other tests
    DateFormat.getDateTimeInstance.restore();
  });

});

通过 stub DateFormat.getDateTimeInstance,您可以停止测试核心 API 及其结果,您可以专注于最重要的事情:您的代码。

BR 克里斯

关于javascript - 如何为包含 SAPUI5 Core API 的函数编写单元测试?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47546551/

相关文章:

unit-testing - Scala - 单元测试设置(使用访问修饰符限定符?)

javascript - SAPUI5 图标大小和颜色的变化

css - SAPUI5 中的垂直标签对齐(标签太高)

sapui5 - 预期为 '}',但在表达式中看到了 '='

javascript - 如何重新设计 tr 行中的所有表 td

javascript - React.js+Bootstrap 渲染行

javascript - 正则表达式与完美的结束括号匹配

javascript - 带有 JS 的响应式/自适应 Web 的图像

python - 模拟django的数据库保存

node.js - 如何模拟 typeorm 连接