如何对ui-bootsrap $ uibModal实例的结果进行单元测试？

Question

I have a controller that calls $uibModal.open to pop a ui-bootstrap modal. The controller looks like this:

(function () {
    'use strict';

    angular
        .module('app')
        .controller('MyCtrl', myCtrl);

    function myCtrl($uibModal) {
        var vm = this;
        vm.showModal = showModal;

        vm.results = [];

        function showModal() {
            var modalInstance = $uibModal.open({
                templateUrl: '/mymodal.html',
                controller: 'ModalCtrl ',
                controllerAs: 'modalCtrl',
            });

            modalInstance.result.then(function (myResult) {
            // I want to test that my code here  gets called and behaves as   expected. shortened for brevity
                vm.results.push(myResult);
            });
        }
    }
})();

I have successfully tested opening the modal with correct config options. But I would like to test the result of the modal as some logic is executed when this happens but I can't seem to figure out how I can hook into the result or get it to even execute in my tests

Tests with some setup code omitted

(function() {
    'use strict';

    describe('myPageWithModal', function() {

        //mock edit modal
        var mockModalInstance = {
            result: {
                then: function(confirmCallback, cancelCallback) {
                    // Store the callbacks for later when the user clicks
                    // on the OK or Cancel button of the dialog
                    this.confirmCallBack = confirmCallback;
                    this.cancelCallback = cancelCallback;
                }
            },
            close: function( item ) {
                // The user clicked OK on the modal dialog, call the stored
                // confirm callback with the selected item
                this.result.confirmCallBack( item );
            },
            dismiss: function( type ) {
                // The user clicked cancel on the modal dialog, call
                // the stored cancel callback
                this.result.cancelCallback( type );
            }
        }

        var mockModalOptions = {
            controller: 'ModalCtrl ',
            controllerAs: 'modalCtrl',
            templateUrl: '/mymodal.html',
        }


        describe('myModal', function() {
            var actualModalOptions;

            beforeEach(function() {
                ctrl = //omitted

                //set up a spy to listen for when modal dialogs are opened and return our mock modal
                spyOn($uibModal, 'open').and.callFake(function(options) {
                    actualModalOptions = options;
                    return mockModalInstance;
                });
            });

            it('should open edit modal with options', function() {
                ctrl.showModal();

                expect($uibModal.open).toHaveBeenCalledWith(mockModalOptions);
            });


            it('should close modal and execute the modalInstance.result logic',     function() {

            });
        });
    });
})();

Answer 1

Considering that $uibModal.open was mocked in current spec to return mockModalInstance , mockModalInstance should be freshly defined for each spec where it is used, and mockModalInstance.result should be a promise:

var modalResult = {};
var mockModalInstance = { result: $q.resolve(modalResult) };
spyOn(mockModalInstance.result, 'then').and.callThrough();
spyOn($uibModal, 'open').and.returnValue(mockModalInstance);

ctrl.showModal();
$rootScope.$digest();

expect(mockModalInstance.result.then).toHaveBeenCalledWith(jasmine.any(Function));
expect(ctrl.results.length).toBe(1);
expect(ctrl.results[0]).toBe(modalResult);