mirror of
https://github.com/Hopiu/angular.js.git
synced 2026-04-27 01:44:47 +00:00
fix($animate): ensure the active class is not applied if cancelled during reflow
Closes #4699
This commit is contained in:
parent
974b6d4a5b
commit
e53ff431e1
2 changed files with 28 additions and 0 deletions
|
|
@ -898,6 +898,11 @@ angular.module('ngAnimate', ['ng'])
|
||||||
|
|
||||||
// This triggers a reflow which allows for the transition animation to kick in.
|
// This triggers a reflow which allows for the transition animation to kick in.
|
||||||
afterReflow(function() {
|
afterReflow(function() {
|
||||||
|
if(!element.hasClass(className)) {
|
||||||
|
done();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
if(timings.transitionDuration > 0) {
|
if(timings.transitionDuration > 0) {
|
||||||
node.style[transitionProp + propertyKey] = '';
|
node.style[transitionProp + propertyKey] = '';
|
||||||
if(ii > 0 && stagger.transitionDelay > 0 && stagger.transitionDuration === 0) {
|
if(ii > 0 && stagger.transitionDelay > 0 && stagger.transitionDuration === 0) {
|
||||||
|
|
|
||||||
|
|
@ -1723,6 +1723,29 @@ describe("ngAnimate", function() {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it("should not perform the active class animation if the animation has been cancelled before the reflow occurs", function() {
|
||||||
|
inject(function($compile, $rootScope, $animate, $sniffer, $timeout) {
|
||||||
|
if(!$sniffer.transitions) return;
|
||||||
|
|
||||||
|
ss.addRule('.animated.ng-enter', '-webkit-transition: 2s linear all;' +
|
||||||
|
'transition: 2s linear all;');
|
||||||
|
|
||||||
|
var element = html($compile('<div>...</div>')($rootScope));
|
||||||
|
var child = $compile('<div class="animated">...</div>')($rootScope);
|
||||||
|
|
||||||
|
$animate.enter(child, element);
|
||||||
|
$rootScope.$digest();
|
||||||
|
|
||||||
|
expect(child.hasClass('ng-enter')).toBe(true);
|
||||||
|
|
||||||
|
$animate.leave(child);
|
||||||
|
$rootScope.$digest();
|
||||||
|
|
||||||
|
$timeout.flush();
|
||||||
|
expect(child.hasClass('ng-enter-active')).toBe(false);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
// it("should add and remove CSS classes and perform CSS animations during the process",
|
// it("should add and remove CSS classes and perform CSS animations during the process",
|
||||||
// inject(function($compile, $rootScope, $animate, $sniffer, $timeout) {
|
// inject(function($compile, $rootScope, $animate, $sniffer, $timeout) {
|
||||||
//
|
//
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue