ngShow gives inconsistent results with ngAnimate #11717
Description
ng-show gives inconsistent results when the watched valued is changed multiple time in the same digest cycle and ngAnimate is included.
Here is a simple reproduction with 1.4.0-rc.0: http://jsfiddle.net/dubejf/xz6ppj9v/2/
- The controller has a flag,
vm.showIt. - This flag controls a red div using a
ng-showdirective, withng-show="vm.showIt". - Clicking on the button toggles the flag, twice. First to set it to
true, then to set it tofalse. The value are changed using a$timeout, in the hope that theng-showwatch will update twice in the same digest.
Expected behavior: Click on 'Click me'. At the end of the digest, vm.showIt should always be false. The red div should always be invisible.
Actual behavior: vm.showIt is always false at the end of the cycle (good). The red div is sometime visible, sometime invisible (bad).
The behavior is easier to observe in Firefox r37, where the fiddle gives the wrong results half the time. The bad behavior can also be observed in Chrome r42, with less consistency - I haven't been able to figure the pattern, you may need a few dozen push of the button to make it fail.
When the test fails (red div visible), the class 'ng-hide' is missing on the div. The class should be set, because the condition for ng-show is false.
The root of the problem appears to be the handling of classes inside the $animate service, specifically when successive calls to removeClass \ addClass are made.
The problem only occurs when the ngAnimate module is included. Tested with 1.4.0-rc.0 and 1.4.0-build.3988.