New issue
Advanced search Search tips

Issue 615150 link

Starred by 1 user

Issue metadata

Status: WontFix
Owner:
Closed: May 2016
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Linux , Windows , Mac
Pri: 3
Type: Bug-Regression



Sign in to add a comment

CSS Transition Duration Bug

Reported by patrickr...@gmail.com, May 26 2016

Issue description

Chrome Version       : 51.0.2704.63
URLs (if applicable) : http://codepen.io/patrickhill/pen/jrNQyd/?editors=0100
Other browsers tested:
  Add OK or FAIL, along with the version, after other browsers where you
have tested this issue:
     Safari: OK
    Firefox: FAIL
         IE: OK

What steps will reproduce the problem?
(1) Add a CSS transition and transition-duration to an element
(2) Add a longer duration to the :hover state

What is the expected result?
In past versions of Chrome, the un-hover animation duration was applied from the current animation state.

What happens instead?
The un-hover animation duration gets applied to the full length of the animation regardless of where the animation is in its timeline.

Please provide any additional information below. Attach a screenshot if
possible.

A working example with more explanation is available here: http://codepen.io/patrickhill/pen/jrNQyd/?editors=0100

I'm also attaching an animated gif.
 
chrome-vs-safari-transitions-2016-05-26-14.57.34.gif
386 KB View Download
Components: Blink>CSS
Labels: -Type-Bug M-53 OS-Linux OS-Mac OS-Windows Type-Bug-Regression
Owner: dsansome@chromium.org
Status: Assigned (was: Unconfirmed)
Able to reproduce the issue on Windows 7, Mac 10.11.5, Ubuntu 14.04 using 51.0.2704.63, latest dev 52.0.2743.10, canary 53.0.2749.2 as per steps in comment #0.

This is regression issue broken in M-51.

Please find below bisect info:
Last good build:51.0.2686.0
First bad build:51.0.2687.0

CHANGELOG URL:
https://chromium.googlesource.com/chromium/src/+log/2c13e7ad077ec639b6ca0e76f0a1a530a398cb9d..811b5b582d3be522736fee2a4fd37136eb9d52f0

From above CL, suspecting below:
https://chromium.googlesource.com/chromium/src/+/6fc170b6f3fd0cf60e486f34508956bf651fe9aa

dsansome@Could you please look into this issue if it is related to your change, else feel free to assign it to an appropriate dev person.

Thanks,
Components: -Blink>CSS Blink>Animation

Comment 3 by suzyh@chromium.org, May 27 2016

Labels: Update-weekly
Owner: ericwilligers@chromium.org

Comment 4 by suzyh@chromium.org, May 27 2016

Cc: alancutter@chromium.org
Labels: -M-53 M-51
Please set the M- label to the version that regressed when marking a bug as regression.
Status: WontFix (was: Assigned)
Chrome changed its transition reversing to match the spec and Firefox.
https://www.w3.org/TR/css3-transitions/#reversing

As far as specs and compatibility are concerned Chrome is in the green.

Something to note though is the test case uses a different transition-duration for hover vs non-hover. The hover duration is 8s while the non-hover duration is 1s. Perhaps when the transition timing properties change the reverse duration scaling should not apply, this is more of a spec issue than a browser implementation one. I encourage you to raise the issue if you feel CSS transitions should behave differently: https://discourse.wicg.io/

I also encourage you to ping the relevant WebKit bug: https://bugs.webkit.org/show_bug.cgi?id=61419

Sign in to add a comment