ng-hide="expression()" not working in 1.3-rc2 (timing issue?)

[matthiasg]

TLDR:
<p ng-hide="isHidden()"> {{isHidden()}} </p> shouldnt ever result in
<p ng-hide="isHidden()" class="ng-binding"> true </p> and thus not add class ng-hide.
Happens when isHidden changes its outcome after initial binding.

Just reverting all angular* files back to 1.3.0-beta.18 solves this.

EDIT: its not ok in rc.1. beta.18 works

Full:

I have just updated our app to 1.3-rc2 for testing and found this little gem in our app.

I would assume $animate addClass or removeClass to have a timing bug.

Given this template in a directive:

<div>
  <p ng-hide="true">THIS IS HIDDEN</p>
  <p ng-hide="isHidden()">isHidden() = {{isHidden()}}</p>
</div>

i get this output:

<div>
  <p ng-hide="true" class="ng-hide">THIS IS HIDDEN</p>
  <p ng-hide="isHidden()" class="ng-binding">isHidden() = true</p>
</div>

Debugging into the ngHideDirective showed that it did indeed correctly triggers the $animate.addClass(element,'ng-hide') call on both elements, but it only actually adds the class on the first paragraph.

This happens when isHidden() returns false at first and then becomes true a little later (a scope.$watch in our case).

Its the same way the other way around. Then isHidden() returns true from the outset it does indeed hide it, but then the change to false is not respected.

[fobin]

Is this related to this: #9103 ?

[jeffbcross]

Hi @matthiasg thanks for all the detail. It would make it easier to review and experiment with if you could create a plnkr demonstrating the issue.

[matthiasg]

Sure that would be great... I started doing that yesterday but I found the plunkr UI confusing to get the new angular library rc2 into it .. So I ran out of time after a 15 hour day coding ;)

When nobody reading this suddenly says .. Oh .. Wait.. That's xyz .. Then I will create one next week when I am back in the office...

Cheers

-----Original Message-----
From: "Jeff Cross" notifications@github.com
Sent: ‎18.‎09.‎2014 22:52
To: "angular/angular.js" angular.js@noreply.github.com
Cc: "matthiasg" mgt576@gmail.com
Subject: Re: [angular.js] ng-hide="expression()" not working in 1.3-rc2(timing issue?) (#9147)

Hi @matthiasg thanks for all the detail. It would make it easier to review and experiment with if you could create a plnkr demonstrating the issue.
—
Reply to this email directly or view it on GitHub.=

[gkalpak]

I tried to reproduce it (based on what I understood from the @matthiasg's post), but the issues doesn't appear. Maybe you can modify them to reproduce the problem.

Fiddle with ngAnimate
Fiddle without ngAnimate

_{(I tried both with and without ngAnimate in case it is a problem with the built-in or the extrernal $animate), but same result.}

Maybe it is a timing issue that only appears when the $digest loop takes more time to complete.

(/cc @jeffbcross)

[matthiasg]

Thanks will try... The Dom is nested deeply in our app. A number of includes ...

-----Original Message-----
From: "Georgios Kalpakas" notifications@github.com
Sent: ‎19.‎09.‎2014 10:53
To: "angular/angular.js" angular.js@noreply.github.com
Cc: "matthiasg" mgt576@gmail.com
Subject: Re: [angular.js] ng-hide="expression()" not working in 1.3-rc2(timing issue?) (#9147)

I tried to reproduce it (based on what I understood from the @matthiag's post), but the issues doesn't appear. Maybe you can modify them to reproduce the problem.
Fiddle with ngAnimate
Fiddle with ngAnimate
(I tried both with and without ngAnimate in case it is a problem with the built-in or the extrernal $animate), but same result.
Maybe it is a timing issue that only appears when the $digest loop takes more time to complete.
(/cc @jeffbcross)
—
Reply to this email directly or view it on GitHub.=

[fobin]

So I forged @gkalpak example a bit. Is this the desired behavior in Angular: http://jsfiddle.net/f5b8o1m5/1/

Edit: updated the link

[matthiasg]

@fobin yest thats the setup, but in my case it still shows the line <p ng-hide="isHidden()">isHidden() = {{isHidden()}}</p>

so its not about timing per se it would seem. possible because we have 3 nested templates at that position etc ... when i am back in the office next week i will try to strip out unnecessary bits until i can reproduce more easily.

[jeffbcross]

@matthiasg regarding loading scripts in plnkr, I usually just add a script tag in the head of the document pointing to code.angularjs.org:

<head>
  <script src="https://code.angularjs.org/1.3.0-rc.2/angular.js"></script>
</head>

[pocesar]

well this is seemly related with #9222

[IgorMinar]

@pocesar nope. this has nothing to do with #9222

[IgorMinar]

sounds like an ngAnimate bug. I wonder if #9283 could fix this.

@caitp can you please verify?

[caitp]

Based on @fobin's reproduction, I think #9283 does fix this http://plnkr.co/edit/rcSRKNSwx782DDsqgMOw?p=preview (we aren't showing elements with ng-hide when the expression evaluates to true)

[caitp]

Closed by 667183a (???) --- let me know if you have other issues with this

[matthiasg]

Verified: It fixes the issues I have been having. Thanks :)