Transition of background-position not working for same offset but different edge
Reported by
bearinth...@gmail.com,
Mar 17 2018
|
|||||
Issue descriptionUserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.162 Safari/537.36 Steps to reproduce the problem: 1. Make an element with background-position described as left 10px bottom 10px 2. Make the same element have background-position: right 10px bottom 10px on hover, so the only difference is left -> right What is the expected behavior? Smooth background-position transition from point A to point B. What went wrong? There is no transition. Background just jumps to the new position. Did this work before? N/A Does this work in other browsers? Yes Chrome version: 65.0.3325.162 Channel: stable OS Version: OS X 10.13.3 Flash Version: Transition works correctly if we change an offset even by 1px, like left 10px -> right 11px. Also, other axis works correctly, so left 10px bottom 10px -> right 10px bottom 100px will still animate the vertical transition, but horizontally it will just jump to the new one.
,
Mar 17 2018
The bug is observable since Chrome 25 where background-position was first introduced, also in Chrome Canary. Replacing "left 10px" with "left 10.000001px" restores the correct behavior. Firefox works correctly in all cases.
,
Mar 17 2018
It also works correctly in Safari.
,
Mar 19 2018
,
Mar 19 2018
I have uploaded a patch for this issue: https://chromium-review.googlesource.com/c/chromium/src/+/967912
,
Mar 19 2018
Able to reproduce the issue on Mac 10.13.3, Win-10 and Ubuntu 14.04 using chrome reported version #65.0.3325.162 and latest canary #67.0.3374.0. This is a non-regression issue as it is observed from M60 old builds. Hence, marking it as untriaged to get more inputs from dev team. Thanks...!!
,
Mar 19 2018
,
Mar 29 2018
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/ec61cb7c755b12c7c7e40f55f0f0f0626d13d10e commit ec61cb7c755b12c7c7e40f55f0f0f0626d13d10e Author: Zhuoyu Qian <zhuoyu.qian@samsung.com> Date: Thu Mar 29 00:54:21 2018 Check BackgroundEdgeOrigin when check BackgroundPosition. We should check Background{X/Y}Origin when check BackgroundPosition{X/Y}. BackgroundPosition same but BackgroundEdgeOrigin different is not the same position, we should return false when FillLayersEqual(). Bug: 823046 Signed-off-by: Zhuoyu Qian <zhuoyu.qian@samsung.com> Change-Id: Ia7d0c5af33e1ee5986420dc054c2ce1b1f65e9b0 Reviewed-on: https://chromium-review.googlesource.com/967912 Reviewed-by: Rune Lillesveen <futhark@chromium.org> Cr-Commit-Position: refs/heads/master@{#546679} [add] https://crrev.com/ec61cb7c755b12c7c7e40f55f0f0f0626d13d10e/third_party/WebKit/LayoutTests/external/wpt/css/css-transitions/transition-background-position-with-edge-offset.html [modify] https://crrev.com/ec61cb7c755b12c7c7e40f55f0f0f0626d13d10e/third_party/WebKit/Source/core/css/CSSPropertyEquality.cpp
,
Apr 2 2018
I think it fixed.
,
Apr 2 2018
|
|||||
►
Sign in to add a comment |
|||||
Comment 1 by bearinth...@gmail.com
, Mar 17 2018