diff --git a/src/modal/modal.js b/src/modal/modal.js index 637bab1992..486f1b4e06 100644 --- a/src/modal/modal.js +++ b/src/modal/modal.js @@ -107,14 +107,8 @@ angular.module('ui.bootstrap.modal', ['ui.bootstrap.stackedMap']) }]) .directive('uibModalWindow', [ - '$uibModalStack', '$q', '$animate', '$injector', - function($modalStack , $q , $animate, $injector) { - var $animateCss = null; - - if ($injector.has('$animateCss')) { - $animateCss = $injector.get('$animateCss'); - } - + '$uibModalStack', '$q', '$animate', '$animateCss', + function($modalStack, $q, $animate, $animateCss) { return { scope: { index: '@' @@ -160,13 +154,9 @@ angular.module('ui.bootstrap.modal', ['ui.bootstrap.stackedMap']) var animationPromise = null; if (attrs.modalInClass) { - if ($animateCss) { - animationPromise = $animateCss(element, { - addClass: attrs.modalInClass - }).start(); - } else { - animationPromise = $animate.addClass(element, attrs.modalInClass); - } + animationPromise = $animateCss(element, { + addClass: attrs.modalInClass + }).start(); scope.$on($modalStack.NOW_CLOSING_EVENT, function(e, setIsAsync) { var done = setIsAsync(); @@ -230,22 +220,14 @@ angular.module('ui.bootstrap.modal', ['ui.bootstrap.stackedMap']) }) .factory('$uibModalStack', [ - '$animate', '$timeout', '$document', '$compile', '$rootScope', + '$animate', '$animateCss', '$timeout', '$document', '$compile', '$rootScope', '$q', - '$injector', '$$multiMap', '$$stackedMap', - function($animate , $timeout , $document , $compile , $rootScope , + function($animate , $animateCss, $timeout , $document , $compile , $rootScope , $q, - $injector, $$multiMap, $$stackedMap) { - var $animateCss = null; - - if ($injector.has('$animateCss')) { - $animateCss = $injector.get('$animateCss'); - } - var OPENED_MODAL_CLASS = 'modal-open'; var backdropDomEl, backdropScope; @@ -350,15 +332,12 @@ angular.module('ui.bootstrap.modal', ['ui.bootstrap.stackedMap']) } afterAnimating.done = true; - if ($animateCss) { - $animateCss(domEl, { - event: 'leave' - }).start().then(function() { - domEl.remove(); - }); - } else { - $animate.leave(domEl); - } + $animateCss(domEl, { + event: 'leave' + }).start().then(function() { + domEl.remove(); + }); + scope.$destroy(); if (done) { done(); @@ -441,7 +420,7 @@ angular.module('ui.bootstrap.modal', ['ui.bootstrap.stackedMap']) angularBackgroundDomEl.attr('modal-animation', 'true'); } backdropDomEl = $compile(angularBackgroundDomEl)(backdropScope); - appendToElement.append(backdropDomEl); + $animate.enter(backdropDomEl, appendToElement); } var angularDomEl = angular.element('
'); @@ -460,8 +439,10 @@ angular.module('ui.bootstrap.modal', ['ui.bootstrap.stackedMap']) var modalDomEl = $compile(angularDomEl)(modal.scope); openedWindows.top().value.modalDomEl = modalDomEl; openedWindows.top().value.modalOpener = modalOpener; - appendToElement.append(modalDomEl); - appendToElement.addClass(modalBodyClass); + $animate.enter(modalDomEl, appendToElement) + .then(function() { + $animate.addClass(appendToElement, modalBodyClass); + }); $modalStack.clearFocusListCache(); }; diff --git a/src/modal/test/modal.spec.js b/src/modal/test/modal.spec.js index efdd30e96a..f745c05e0b 100644 --- a/src/modal/test/modal.spec.js +++ b/src/modal/test/modal.spec.js @@ -888,6 +888,8 @@ describe('$uibModal', function () { template: '
dummy modal
' }); + $animate.flush(); + expect(body).toHaveClass('modal-open'); }); @@ -897,6 +899,8 @@ describe('$uibModal', function () { openedClass: 'foo' }); + $animate.flush(); + expect(body).toHaveClass('foo'); expect(body).not.toHaveClass('modal-open'); }); @@ -907,6 +911,8 @@ describe('$uibModal', function () { openedClass: 'foo' }); + $animate.flush(); + expect(body).toHaveClass('foo'); close(modal); @@ -920,6 +926,8 @@ describe('$uibModal', function () { openedClass: 'foo' }); + $animate.flush(); + expect(body).toHaveClass('foo'); expect(body).not.toHaveClass('modal-open'); @@ -928,6 +936,8 @@ describe('$uibModal', function () { openedClass: 'bar' }); + $animate.flush(); + expect(body).toHaveClass('foo'); expect(body).toHaveClass('bar'); expect(body).not.toHaveClass('modal-open'); @@ -937,6 +947,8 @@ describe('$uibModal', function () { openedClass: 'foo' }); + $animate.flush(); + expect(body).toHaveClass('foo'); expect(body).toHaveClass('bar'); expect(body).not.toHaveClass('modal-open'); @@ -1009,9 +1021,11 @@ describe('$uibModal', function () { expect(body).not.toHaveClass('modal-open'); var modal1 = open({template: '
Content1
'}); + $animate.flush(); expect(body).toHaveClass('modal-open'); var modal2 = open({template: '
Content1
'}); + $animate.flush(); expect(body).toHaveClass('modal-open'); dismiss(modal1);