Issue 437860: CSS Animation Callbacks Fail When Parent Element Hidden
Reported by
jacklu...@gmail.com,
Dec 1 2014
|
|||||||||
Issue descriptionUserAgent: Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.71 Safari/537.36 Example URL: Steps to reproduce the problem: 1. Add Keyframe Animation to Child Element 2. Hide parent element during animation 3. Child element animationend event does not fire What is the expected behavior? Child element should discontinue animation and immediately fire animationend event. What went wrong? This is most likely related to https://code.google.com/p/chromium/issues/detail?id=135350 and webkits optimization for display:none; Does it occur on multiple sites: Yes Is it a problem with a plugin? No Did this work before? No Does this work in other browsers? Yes Chrome version: 39.0.2171.71 Channel: stable OS Version: 6.3 Flash Version: Shockwave Flash 15.0 r0 This affects many of my components for Semantic UI, and MANY common UI scenarios. For example having a dimmer and modal both hiding at same time with the same animation duration length leads to race conditions. The same thing occurs with a dropdown menu and a child menu both animating at same time. , Dec 2 2014
jacklukic@ : Thanks for the issue. Would you mind providing any sample url/jsonfiddle if it can be verified from QA side. If so please provide the corresponding steps to perform and desired results to be observed for reproducible of the issue. , Dec 2 2014Here's the test case http://jsfiddle.net/s4x898np/ If you click the "broken" button, you will see the animationend event will not fire. If you click the "working" button it will fire correctly. In Firefox, if you click both buttons they will work correctly. AnimationEnd event still fires on content after parent hidden. , Dec 6 2014I can verify this issue. I was using hidden elements and -webkit-animationend to trigger states dropping in on this infographic: http://www.thefire-dev.wp.eresources.ws/spotlight2015/ My client called me and complained that they loaded on page load all of a sudden, and I narrowed down the issue to the Chrome update, since it was the only thing differentiating when these worked and when they stopped. I commented out these triggers out in lines 417-421 in the source of the above URL if you want to remove the comments in a fiddle and verify. The working version removed these triggers. , Jan 8 2015
Thanks for the jsfiddle.. Able to reproduce this issue on Win7, Chrome Stable version 39.0.2171.95 (Official Build) m, Canary 41.0.2269.0 (Official Build), on Mac OS X 10.9.5 Canary # 41.0.2269.0 & Ubuntu 12.04 32 bit Chrome stable # 39.0.2171.95 Note : Not a regression, issue existing from M18 # 18.0.1000.0 (Official Build 116827) , Jan 8 2015
, Jan 8 2015This sounds like a bug in firefox. From the css-animations specification: "Setting the display property to none will terminate any running animation applied to the element and its descendants." Do any other browsers exhibit the same behavior as firefox? , Jan 9 2015"The animationend event occurs when the animation finishes." http://www.w3.org/TR/css3-animations/ No further guidance is specified, but I assume that this would include prematurely terminated, as the end event will fire now even if the animation produces no tweening frames. For developers, at least, this will remove hackish timeout calls from literally all tweening libraries that rely on transitionend to know when animations complete. , Jan 9 2015Example of currently-necessary hacky timeout: https://github.com/twbs/bootstrap/blob/c56219d223af5145c171defb9fa1426e1dd022f3/js/transition.js#L36 , Jan 9 2015, Jan 15 2015
Moving all non essential bugs to the next Milestone. , Feb 13 2015
, Mar 3 2015
[AUTO] This issue has already been moved once and is lower than Priority 1,therefore removing mstone. , Apr 22 2015
It's unclear from the specification whether an animation terminating == that animation finishing. I've reached out to www-style for clarification. , Apr 22 2015Gratuitous link to the thread: https://lists.w3.org/Archives/Public/www-style/2015Apr/0323.html , May 5 2015
We now have a resolution from the WG: RESOLVED: No animation events when subtrees are destroyed. (https://lists.w3.org/Archives/Public/www-style/2015Apr/0405.html) Accordingly I'm going to close this bug as WontFix. , May 5 2015That makes absolutely no sense. This is case in point why standards bodies are so ridiculous , May 5 2015Please limit posts to technical commentary. |
|||||||||
►
Sign in to add a comment |
|||||||||
Comment 1 by jacklu...@gmail.com, Dec 1 2014