我如何测试一个被 Karma 嘲笑的承诺？答案

【问题标题】：How can I test a promise that is mocked with Karma?我如何测试一个被 Karma 嘲笑的承诺？
【发布时间】：2016-11-07 09:01:41
【问题描述】：

我的代码是：

  $scope.openModal = openModal;


  function openModal(data){
    var info = data || {}
    ModalService.showModal({
        templateUrl: ENVApp+"/myview.html",
        controller: "ModalController",
        inputs: {
          icon : "",
          title: "Additional",
          data : info
        }
      }).then(function (modal) {
        modal.element.modal();
        modal.close.then(function (res) {
          if(res.data != 'cancel'){
            if(!res.data.id){
              create(res)
            }else{
              update(res)
            }
          }
        });
      });
  }

使用 Karma 进行测试的正确方法是什么？到目前为止，这是我所拥有的：

在我的beforeEach:

  this.ModalService = {
    showModal: function(obj) {
      var deferred = $q.defer();
      deferred.resolve({
        element: {
          modal: jasmine.createSpy(),
          close: function() {
            var deferred2 = $q.defer();

            return deferred2.promise;
          }
        }
      });
      return deferred.promise;
    }
  };
  this.UserService = {
    user: {
      id: 2
    },
    updateCategory: function(data, type) {
      var deferred = $q.defer();
      deferred.resolve({
        data: {
          rows: 'response'
        }
      });
      return deferred.promise;
    }
  }
  this.controller = $controller('ProfileAdditionalController', {
    '$scope': this.scope,
    '$rootScope': this.rootScope,
    '$state': this.state,
    "$stateParams": this.stateParams,
    'ModalService': this.ModalService,
    'UserService': this.UserService,
    'ResourceService': this.ResourceService,
    '$upload': this.upload,
    'userData': this.userData
  });

对于我的实际测试：

  it('should open a modal when requested', function() {
    this.scope.openModal();
    expect(this.ModalService.showModal)
  });

但这并没有多大意义。想法？

【问题讨论】：

你能不能让openModal 从showModal 返回它正在使用的承诺。我最近正在测试一个 GUI 小部件，它的功能类似于您的代码正在执行的操作：方法 A 正在调用方法 B，而 B 返回了 A 正在使用的承诺。我刚刚决定让 A 返回它从 B（+ 处理程序）那里得到的承诺。它大大简化了测试。

标签： angularjs unit-testing mocking promise karma-runner

【解决方案1】：

要在控制器上测试您的openModal 功能，基本上您要验证以下（3 个测试）

ModalService.showModal 使用一些特定选项调用
显示模态后，验证then 函数是否正在执行其预期的操作
当模态关闭时，验证第二个then 函数是否正在执行它应该执行的操作

首先，您可能需要在 ModelService.showModal 上设置一个间谍（模拟）： spyOn(ModalService, 'showModal).and.returnValue($q.when(mockModal))

现在在您的测试中，您将触发函数和 $scope.$digest 调用：

$scope.openModal(data);
$scope.$digest() // to propagate the `resolve()` result of the promise)

这将触发第一个 then 回调（将 mockModal 作为参数传递），然后您可以验证其行为。

为了验证第二个回调，您需要模拟已解析的 modal 对象。

【讨论】：