CSS transition on "order" property fails with timing-function "step-end"
Reported by
antoine....@gmail.com,
Feb 13 2017
|
|||||||||
Issue descriptionUserAgent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Ubuntu Chromium/53.0.2785.143 Chrome/53.0.2785.143 Safari/537.36 Steps to reproduce the problem: 1. Set up test case making use of the property "order" 2. Set up transition using "step-end" timing function What is the expected behavior? The property change should be effective at the end of the transition duration. What went wrong? The property change is applied immediately no matter what the transition's duration is. Did this work before? N/A Does this work in other browsers? N/A Chrome version: 53.0.2785.143 Channel: n/a OS Version: 14.04 Flash Version: Test case here : https://jsfiddle.net/xkkst52n/1/
,
Feb 14 2017
Hi, could you describe the expected result using a screenshot? FF and Chrome have the same output. Thank you!
,
Feb 14 2017
@nainar, repro: in the first colored row click any color bar except the first one EXPECTED: the bar becomes the first one after two seconds OBSERVED: the bar becomes the first one immediately
,
Feb 14 2017
Thank you for the clarifcation. Marking this as confirmed and sending for Triage.
,
Feb 15 2017
Able to reproduce the issue on Windows 10, Ubuntu 14.04 and Mac 10.12.3 with chrome version #56.0.2924.87 and also in earlier version of chrome #30.0.1549.0. This is a non-regression issue, marking it as untriaged. Attaching a screen-cast for reference.
,
Feb 15 2017
We simply don't treat this as an interpolable property. According to spec we should: https://drafts.csswg.org/css-flexbox-1/#order-property
,
Feb 15 2017
,
Feb 16 2017
,
Feb 16 2017
,
Feb 17 2017
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/4348a58ce41a92ecb5cd1acf6e86269130e61709 commit 4348a58ce41a92ecb5cd1acf6e86269130e61709 Author: alancutter <alancutter@chromium.org> Date: Fri Feb 17 04:46:17 2017 Support animating CSS property "order" This patch enables animating "order" as an integer. Spec: https://drafts.csswg.org/css-flexbox-1/#order-property BUG= 691573 Review-Url: https://codereview.chromium.org/2692383004 Cr-Commit-Position: refs/heads/master@{#451218} [add] https://crrev.com/4348a58ce41a92ecb5cd1acf6e86269130e61709/third_party/WebKit/LayoutTests/animations/interpolation/order-interpolation.html [modify] https://crrev.com/4348a58ce41a92ecb5cd1acf6e86269130e61709/third_party/WebKit/Source/core/animation/CSSInterpolationTypesMap.cpp [modify] https://crrev.com/4348a58ce41a92ecb5cd1acf6e86269130e61709/third_party/WebKit/Source/core/animation/NumberPropertyFunctions.cpp [modify] https://crrev.com/4348a58ce41a92ecb5cd1acf6e86269130e61709/third_party/WebKit/Source/core/animation/css/CSSAnimatableValueFactory.cpp [modify] https://crrev.com/4348a58ce41a92ecb5cd1acf6e86269130e61709/third_party/WebKit/Source/core/css/CSSProperties.json5 [modify] https://crrev.com/4348a58ce41a92ecb5cd1acf6e86269130e61709/third_party/WebKit/Source/core/css/CSSPropertyEquality.cpp [modify] https://crrev.com/4348a58ce41a92ecb5cd1acf6e86269130e61709/third_party/WebKit/Source/core/css/resolver/AnimatedStyleBuilder.cpp
,
Feb 21 2017
,
Feb 21 2017
Tested the issue on Latest Dev# 58.0.3018.0 on Windows, Mac and Linux and the issue is not reproducible. Hence adding TE-Verified Labels. Adding a screen cast for reference. Note: Changed the wait time to 5s for Order Transition and the selection is done accordingly. Thank You. |
|||||||||
►
Sign in to add a comment |
|||||||||
Comment 1 by nyerramilli@chromium.org
, Feb 14 2017Labels: Needs-Milestone