Skip to content
This repository has been archived by the owner on May 29, 2019. It is now read-only.

Modal removes openClass before the modal close animation has finished #6051

Closed
cleavera opened this issue Jun 24, 2016 · 3 comments
Closed

Comments

@cleavera
Copy link

cleavera commented Jun 24, 2016

Bug description:

When using an ng-leave animation on the modal dialog the modal open class is removed at the start of the animation rather than at the end of the animation. This results in issues where you're using the open class to hide overflow on the body etc which get removed before the modal is closed and end up with a nasty flickering of the scrollbar in this example. Instead the modal open class should be removed after the animation.

Example

http://plnkr.co/edit/A8YZeacWFK4yP6zMIIjY?p=preview
In this example the background is red while the open class is added to the body, you'll notice that the open class is removed at the start of the leave animation instead of when the animation has completed.

Version of Angular, UIBS, and Bootstrap

Angular: 1.5.3

UIBS: 1.3.3

Bootstrap: N/A

@icfantv
Copy link
Contributor

icfantv commented Jun 25, 2016

@cleavera, i've updated the relevant versions in your issue descriptions as 0.10.0 of UIBS is from January of 2014, or when Angular 1.2.9 was released and your plunker was using relatively recent (if not THE most) versions of those two libraries.

I did notice, however, you neglected to add the Bootstrap CSS which changes things a bit. Can you please update your plunker to include the latest Bootstrap CSS and fix the issues with it before we take a look at this? Thanks

@cleavera
Copy link
Author

Hi @icfantv I forgot to mention I have a fix for this and I intend to submit a pr on monday. I left the css out as it doesnt affect the bug (its a js issue) and its easier to demonstrate without (we also dont use your css within our system). I can still update the plunkr if needed?

@icfantv
Copy link
Contributor

icfantv commented Jun 25, 2016

@cleavera of course. and thanks.

cleavera pushed a commit to cleavera/bootstrap that referenced this issue Jun 27, 2016
Modal dialog removeAfterAnimate switched to wait until after all animations are finished to call the done callback

Fixes angular-ui#6051
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

2 participants