Question

var showChangePasswordDialog = function(){
            var modalInstance = $modal.open({
            templateUrl:'changePassword/changePassword.html',
            controller: ChangePasswordDialogController,
            windowClass: 'app-modal-window',
            resolve:{
                    loginInfo: function(){
                        return $scope.loginInfo;
                    }
                }
            });
        }

我在m角度控制器中有这个代码我如何进行单元测试并期望modal.open.toHaveBeencalled（）

Answer 1

我只是为自己解决这个问题，这就是我所做的。希望它有所帮助，或者至少让你更接近。

// LAUNCH CONTROLLER
angular.module('myModule').controller('myCtrl', function($modal){
    $scope.ctrlModal = null;

    $scope.launchModal = function(){
        $scope.ctrlModal = $modal.open({
            templateUrl: 'path/to/template.html',
            controller: 'modalController'
        });

        $scope.ctrlModal.result.then(function(){
            //success stuff
        },
        function(){
            //cancel stuff
        });
    };
});

// TESTS 
describe('Your Controller', function(){
    // variable to hold instance of angularUI $modal service
    var $modal;             

    // create a fake modal instance to stub out $modal functionality
    var modalInstance = {
        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 );
        }
    };

    beforeEach(module('yourModule'));
    beforeEach(inject(function($rootScope, $controller, _$modal_){
        // tie $scope to a new $rootScope
        // this $scope will replace our test controller scope
        $scope = $rootScope.$new();

        // instanciate the controller we want to test
        createController = function(){
            return $controller('myCtrl', {
                $scope: $scope,
                $modal: _$modal_
            });
        };

        // store an instance of the $modal service
        $modal = _$modal_;
    }));
    beforeEach(function(){
        createController();

        // set up a spy to listen for when modal dialogs are opended.
        spyOn($modal, 'open').and.returnValue(modalInstance);
    });

    // --- Assertions ---
    it("can launch a modal", function(){
        // launch the modal and make sure it's loaded
        $scope.launchModal();
        expect($modal.open).toHaveBeenCalled();

        $scope.ctrlModal.close(mockModalResultDataObj);
    });
});

单元测试ui.bootstrap模态

1 个答案: