Skip to content
This repository has been archived by the owner on Apr 12, 2024. It is now read-only.

Inline styles destroyed on elements with ng-model directives if css transition is defined #7503

Closed
jwhiting opened this issue May 18, 2014 · 3 comments

Comments

@jwhiting
Copy link

If the ngAnimate module is included in the app, elements with ng-model directives will lose their inline style definitions on the first change to the model property, IF the element has a class which declares a css transition.

A JSFiddle to demonstrate: http://jsfiddle.net/q54Tj/2/

Expected behavior: inline styles should always be preserved on elements regardless of transition definitions or inclusion of ngAnimate module.

I'm not sure what version of Angular introduced this issue, but I've been running for a while on 1.2.5 and when I tried 1.3.9, I noticed this happening in some of my forms. It is reproducible in all browsers I've tried, including the latest versions of Chrome, Firefox, IE, & Safari on OSX 10.8.5 and Win7.

@caitp
Copy link
Contributor

caitp commented May 21, 2014

Interesting, it's bizarre that inline style should be totally reset, since afaik we should only be touching the CSSStyleDeclaration. I will look into this, since @matsko has piles of assigned issues for this mstone I believe. But maybe he'll get to it before I do, I dunno.

@caitp caitp added this to the 1.3.0-beta.10 milestone May 21, 2014
@caitp caitp self-assigned this May 21, 2014
@matsko
Copy link
Contributor

matsko commented May 23, 2014

Sorry @caitp this was a super quick fix. I'm making a test now for it.

@matsko
Copy link
Contributor

matsko commented May 23, 2014

The fix is awaiting in #7560

matsko added a commit to matsko/angular.js that referenced this issue May 23, 2014
Transitions that are run through ngAnimate which contain a specific property
cause any inline styles to be erased after the animation is done. This has
something to do with how the browsers handle transitions that do not use
"all" as a transition property.

Closes angular#7503
@matsko matsko closed this as completed in 98b9d68 May 23, 2014
matsko added a commit that referenced this issue May 23, 2014
Transitions that are run through ngAnimate which contain a specific property
cause any inline styles to be erased after the animation is done. This has
something to do with how the browsers handle transitions that do not use
"all" as a transition property.

Closes #7503
RichardLitt pushed a commit to RichardLitt/angular.js that referenced this issue May 24, 2014
Transitions that are run through ngAnimate which contain a specific property
cause any inline styles to be erased after the animation is done. This has
something to do with how the browsers handle transitions that do not use
"all" as a transition property.

Closes angular#7503
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.