[Webkit-unassigned] [Bug 121835] New: CSS3 animations don't run if dynamically hidden

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=121835

           Summary: CSS3 animations don't run if dynamically hidden
           Product: WebKit
           Version: 528+ (Nightly build)
          Platform: Unspecified
        OS/Version: All
            Status: UNCONFIRMED
          Severity: Normal
          Priority: P2
         Component: CSS
        AssignedTo: webkit-unassigned at lists.webkit.org
        ReportedBy: faivre at gmail.com


Specifically, using AngularJS for DOM manipulation, Bootstrap progress bars and Font Awesome spinner icon animations (as in the JSFiddle), if there is a ui-view (which dynamically loads its content) anywhere in the doc AND one of the animation classes is hidden using ng-show (dynamically shows/hides part of the page), all other animations in scope won't be active.

REPRODUCE:
See this JSFiddle: http://jsfiddle.net/dfaivre/KZNf3/6/.  It looks like the progress bar initially animates. Click "Run" to re-run and see the described behavior

If you use developer tools and toggle the animation class off/on, it will animate.

It works in IE (10) and Firefox.  Fails in both Chrome and Safari.

Cross filed here: https://github.com/angular-ui/ui-router/issues/458#issuecomment-24928416, and reported through Chrome.

-- 
Configure bugmail: https://bugs.webkit.org/userprefs.cgi?tab=email
------- You are receiving this mail because: -------
You are the assignee for the bug.