angular-ui / bootstrap

PLEASE READ THE PROJECT STATUS BELOW. Native AngularJS (Angular) directives for Bootstrap. Smaller footprint (20kB gzipped), no 3rd party JS dependencies (jQuery, bootstrap JS) required. Please read the README.md file before submitting an issue!
http://angular-ui.github.io/bootstrap/
MIT License
14.27k stars 6.73k forks source link

Collapse directive with angular 1.4.x is less smooth than with angular 1.3.x #4254

Closed Waterstraal closed 9 years ago

Waterstraal commented 9 years ago

I've noticed that since I've upgrade to angularjs 1.4.3, the collapse animation looks not as smooth as it used to be. It's definitely slower, but it also looks less smooth and more "shocky"? It looks like the animation is linear in 1.4.4 and eased in 1.3.18.

I have created two plunkers demonstrating the issue:

Collapse with AngularJS 1.3.18 & ui bootstrap 0.13.3 http://plnkr.co/edit/wL8uXVbOmn10ISdwp1o9?p=preview

Collapse with AngularJS 1.4.4 & ui bootstrap 0.13.3 http://plnkr.co/edit/D9uCqCWpQuk4MEQ0iCrq?p=preview

wesleycho commented 9 years ago

Thanks for the reproduction - perhaps this is due to $animate changes in 1.4.x, and $animateCss is needed to get the proper animation benefits here.

wesleycho commented 9 years ago

I did an investigation, and this turns out to be a bug in ngAnimate in Angular - I filed an issue in https://github.com/angular/angular.js/issues/12656 .

This brings us to a conundrum - I can force the easing to be ease, but then this will potentially be too restrictive if someone wants to override this and the bug is fixed in ngAnimate proper. I will wait for a decision from Matias first before deciding to go down that rabbit hole, since I believe it is better for the fix to come in Angular, and not UI Bootstrap.

trajano commented 9 years ago

I have a Plunkr that still shows unsmooth animation in 1.3.x of Angular http://plnkr.co/edit/fPlCSvVwGF94WuvEwu5I?p=preview

wesleycho commented 9 years ago

@trajano: unless it's a clear Angular problem, I recommend reporting those types of issues to the UI Bootstrap repository and not here - this issue is specifically because the problem was isolated as a ngAnimate issue.

trajano commented 9 years ago

I'm confused, isn't this the Angular UI bootstrap repository? I mean it shows in https://github.com/angular-ui/bootstrap/

Also I just tested the two plunkrs from the OP they seem to both work correctly. Not sure what issue it had.

trajano commented 9 years ago

Also this Fiddle http://jsfiddle.net/whytheday/2Dj7Y/11/ shows it works correctly on bootstrap only.

wesleycho commented 9 years ago

Whoops, I'm losing my mind from GitHub notifications :) .

trajano commented 9 years ago

@wesleycho ya you got me confused too :) However the plunker's from @Waterstraal seem to work smoothly, what's the issue?

wesleycho commented 9 years ago

I'm not quite sure - if I had to suspect, it might have to do with the fact that this is a table.

I don't think it is worthwhile to try to fix this for 1.3, given that the Angular team does not really maintain 1.3.x excepting for major enough updates (their focus is 1.2 for critical bug fixes and 1.4 for current active development).

trajano commented 9 years ago

It also has issues with 1.4.3, http://plnkr.co/edit/bZIpFvIPjMxVaFh19Ln0?p=preview

I can "feel" it is animating because there's a slight delay.

wesleycho commented 9 years ago

That is a separate issue and should be separated from this particular issue - this issue is specifically about the linear transition vs. ease.

trajano commented 9 years ago

OK I'll create a new issue

icfantv commented 9 years ago

Closing as this seems to be working quite nicely with 0.14.3 and 1.4.7.