angular / angular.js

AngularJS - HTML enhanced for web apps!
https://angularjs.org
MIT License
58.86k stars 27.52k forks source link

[ngAnimate] animation-duration causing issues with ng-show #5750

Closed cwaldren closed 10 years ago

cwaldren commented 10 years ago

When trying to use a CSS3 animation with ng-show, I have a problem. A gif illustrates it:

ngshow

http://plnkr.co/edit/YpjzECQyOh7r5tzuqKGD?p=preview

I click, and it disappears. All is well. I double click, and it appears. It should not appear, because two clicks would make it be hidden (original state).

The image does not obey the truth value used by ng-show when double clicking fast. I believe the animation-duration is to blame.

How to reproduce this First, I think you have to be on a Windows machine (?). Then: Double click on the "click me" text really fast. You probably need to use a trackpad for this. Notice that the image at times is shown when false is indicated, and hidden when true is indicated.

Browsers Firefox 26 Chrome 31.0.1650.63 m

Known Operating Systems Windows 8.1

Can't seem to reproduce on a mac. Maybe because can't physically click fast enough.

How to fix No idea, but I have been able to stop the issue by changing all of the animation-durations from .3s to 0s. Then it behaves as expected. The problem is that real animations don't have a 0s duration.

Note that this does not affect transitions that specify a duration. Just animation-durations.

When using physical buttons, this is very minor, because you have to click extremely fast. With a trackpad, clicking fast is much easier, and this is where I see the issue mostly.

matsko commented 10 years ago

Hey @cwaldren. Can you please double check if this is an issue with the latest master? Just run the demo and check (since the demo uses snapshot).

cwaldren commented 10 years ago

@matsko I don't think it's an issue. Seems to work fine now.

matsko commented 10 years ago

Awesome. Thank you.