johnpapa vm样式的角引导模态的单元测试解析

Question

我创建了一个公共的ModalService并将其用于两种不同类型的对话框。 根据传递给服务的参数将弹出CancelDialog和ErrorDialog 。

即这将显示一个ErrorDialog

ModalService.openModal('Analysis Error', 'I am Error Type', 'Error');

resolve单元测试失败。 检查此PLUNKER以运行单元测试。

这在ModalDialogService.js文件中。 在这里查看示例代码：

function openCancelModal(title, message, callback) {
  $uibModal.open({
    templateUrl: 'CancelDialog.html',
    controller: 'DialogController',
    controllerAs: 'vm',
    backdrop: 'static',
    size: 'md',
    resolve: {
      message: function() {
        return message;
      },
      title: function() {
        return title;
      },
      callback: function() {
        return callback;
      }
    }
  });
}

这是测试文件ModalService.spec.js

describe('ModalService', function() {

var $injector;
var $uibModal;

// inject the module of your controller
beforeEach(module('validationApp', function($provide) {
  $uibModal = {
    open: jasmine.createSpy('open')
  };

  $provide.value('$uibModal', $uibModal);
}));

beforeEach(inject(function(_$injector_) {
  $injector = _$injector_;
}));

it('tests that openErrorModal is called', function() {
  var modalService = $injector.get('ModalService');
  modalService.openModal(null, null, "Error");

  expect($uibModal.open).toHaveBeenCalledWith(jasmine.objectContaining({
    controller: "DialogController",
    templateUrl: 'ErrorDialog.html',
    resolve: {
      message: function() {
        return message;
      },
      title: function() {
        return title;
      },
      callback: function() {
        return callback;
      }
    }
  }));
});


it('tests that openCancelModal is called', function() {
  var modalService = $injector.get('ModalService');
  modalService.openModal(null, null, "Cancel");

  expect($uibModal.open).toHaveBeenCalledWith(jasmine.objectContaining({
    controller: "DialogController",
    templateUrl: 'CancelDialog.html'
  }));
});

});

失败错误

Expected spy open to have been called with [ <jasmine.objectContaining(Object({ controller: 'DialogController', templateUrl: 'ErrorDialog.html', resolve: Object({ message: Function, title: Function, callback: Function }) }))> ] but actual calls were [ Object({ templateUrl: 'ErrorDialog.html', controller: 'DialogController', controllerAs: 'vm', backdrop: 'static', size: 'md', resolve: Object({ message: Function, title: Function, callback: Function }) }) ].

我发现此回答很有帮助，但无法复制。 vm样式如何覆盖单元测试以resolve ？

Answer 1

fdescribe('ModalService', function () {

    var $injector;
    var $uibModal;
    var actualOptions;

    // inject the module of your controller
    beforeEach(module('validationApp', function ($provide) {
        $uibModal = {
            open: jasmine.createSpy('open').and.callFake(function (options) {
                actualOptions = options;
            })
        };

        $provide.value('$uibModal', $uibModal);
    }));

    beforeEach(inject(function (_$injector_) {
        $injector = _$injector_;
    }));

    it('tests that resolve returns the same values', function () {
        var title = {};
        var message = {};
        var callback = {};

        var modalService = $injector.get('ModalService');
        modalService.openModal(title, message, "Error", callback);

        expect(actualOptions.resolve.title()).toEqual(title);
        expect(actualOptions.resolve.message()).toEqual(message);
        expect(actualOptions.resolve.callback()).toEqual(callback);
    });

});

和矮人