652543 - transitionend event not fired when there are multiple transitions

Status: RESOLVED WORKSFORME

(Core :: CSS Parsing and Computation, defect)

Description

[Hongli Lai]

User-Agent:       Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10_6_7; en-US) AppleWebKit/534.16 (KHTML, like Gecko) Chrome/10.0.648.205 Safari/534.16
Build Identifier: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.6; rv:2.0) Gecko/20100101 Firefox/4.0

I have a test case here: http://izumi.plan99.net/firefox-transitionend-bug.tar.gz
This test case uses AJAX so it should be put on a web server.

This test case was an exercise for me in Spine.js and CSS transformations. The
idea is that if you click on any of the navigation links on top, it'll load the
target using Ajax and show a smooth transition animation ala iPhone before
displaying the new content.

If you open index.html and click on "book.txt", MainController.showNewContent()
will be called which executes two animations using $.fn.transition() which in turn uses CSS transitions and CSS transformations. One moves
the old content pane to the left until it's no longer visible, the other one
moves the new content pane to the center, to the place where the old content
pane was. This test case works perfectly on Chrome, Safari and Opera, but on
Firefox 4.0 the first click doesn't work properly because the transitionend
event isn't fired. The second click works, but the third one doesn't, etc.

Reproducible: Always

Comment 1

[Thomas Bachem]

This might be a simpler test case: http://codepen.io/harryfino/pen/jphis. See discussion at SO: http://stackoverflow.com/questions/16222805.

Comment 2

[yair even or]

I have opened the simplest test case for this, and am EAGERLY anticipating a fix.

http://stackoverflow.com/q/40530990/104380

what is the work status on this one?

Comment 3

[BugBot [:suhaib / :marco/ :calixte]]

In the process of migrating remaining bugs to the new severity system, the severity for this bug cannot be automatically determined. Please retriage this bug using the new severity system.

Comment 4

[Daniel Holbert [:dholbert]]

(In reply to yair even or from comment #2)

I have opened the simplest test case for this, and am EAGERLY anticipating a
fix.

http://stackoverflow.com/q/40530990/104380

Thanks for the testcase.

Firefox, Chrome, and WebKit (epiphany, presumably also Safari) all handle that testcase the same -- showing a transitionEnd event for all three of the transitioned properties as their transitions end.

Based on comment 0 it sounds like maybe Firefox used to not fire events for the last transition -- that seems to have been fixed.

Hence, resolving as WORKSFORME. If there's still a problem here, please file a new bug with more information. Thanks!