rotate3d animation in combination with precentage translate
Reported by
zhanzhen...@hotmail.com,
Oct 4 2016
|
||||||
Issue descriptionUserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12) AppleWebKit/602.1.50 (KHTML, like Gecko) Version/10.0 Safari/602.1.50 Example URL: https://codepen.io/anon/pen/RGjBYa Steps to reproduce the problem: This issue occurs when those 2 conditions are met: 1. The start and end transform function has `rotate3d` whose first 3 parameters are different. 2. The start and end transform function has a percentage translate. What is the expected behavior? The animation runs. What went wrong? The animation doesn't run. It suddenly jumps to the end value after the duration. Does it occur on multiple sites: Yes Is it a problem with a plugin? No Did this work before? N/A Does this work in other browsers? Yes Chrome version: 53 Channel: stable OS Version: OS X 10.12 Flash Version: If it's "px" not percentage, then everything works fine.
,
Oct 5 2016
Even with px the main thread is not animating this transform properly. See getComputedStyle() remains static during the animation while the compositor animates as expected. https://codepen.io/anon/pen/pEpzJo Tested that Firefox animates percentages smoothly and has changing getComputedStyle value.
,
Oct 5 2016
,
Oct 5 2016
Looks like we're considering rotate3d(1, 1, 0, 45deg) and rotate3d(-1, -1, 0, 45deg) as having the same axis of rotation. https://chromium.googlesource.com/chromium/src/+/master/third_party/WebKit/Source/platform/transforms/Rotation.cpp#58 I did touch this code 6 months ago but looking at the change diff it seems to have been that way previously. https://chromium.googlesource.com/chromium/src/+/34bd172e9a3df92c12ed9f24b7a2c25949cd3278%5E%21/#F1 I'll leave Needs-Bisect on just in case I'm wrong here.
,
Oct 5 2016
,
Oct 6 2016
Tested the issue on Windows, Mac 10.12 and Linux using Chrome Stable# 53.0.2785.143 and is reproducible. This is a Non-Regression issue seen from M44# 45.0.2407.0 (Official Build# 323891) hence removing the needs-bisect label. Attaching the screenshot for reference . Observations -- From ChromeM30# 30.0.1549.0 till M44# the behavior of the CSS is different. The animation doesn't have any movement. From ChromeM45# 44.0.2407.0 the transformation is not proper. Note: The animation works fine on FireFox. Thank You.
,
Oct 7 2016
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/b69d3d2ec0d8bd333157dc33f5e1da1eaf76e5fb commit b69d3d2ec0d8bd333157dc33f5e1da1eaf76e5fb Author: alancutter <alancutter@chromium.org> Date: Fri Oct 07 05:53:59 2016 Fix common axes logic to detect negated axes as not common When interpolating rotate3d transforms we were considering axes that are the negation of each other to be in the same direction. This patch fixes this mistake by checking the sign of the dot product. Spec text for rotate3d interpolation: https://drafts.csswg.org/css-transforms/#ref-for-funcdef-rotate3d-3 For interpolations with the primitive rotate3d(), the direction vectors of the transform functions get normalized first. If the normalized vectors are equal, the rotation angle gets interpolated numerically. Otherwise the transform functions get converted into 4x4 matrices first and interpolated as defined in section Interpolation of Matrices afterwards. BUG= 652705 Review-Url: https://codereview.chromium.org/2391003004 Cr-Commit-Position: refs/heads/master@{#423802} [add] https://crrev.com/b69d3d2ec0d8bd333157dc33f5e1da1eaf76e5fb/third_party/WebKit/LayoutTests/animations/rotate3d-negated-axes-expected.html [add] https://crrev.com/b69d3d2ec0d8bd333157dc33f5e1da1eaf76e5fb/third_party/WebKit/LayoutTests/animations/rotate3d-negated-axes.html [modify] https://crrev.com/b69d3d2ec0d8bd333157dc33f5e1da1eaf76e5fb/third_party/WebKit/Source/platform/transforms/Rotation.cpp [modify] https://crrev.com/b69d3d2ec0d8bd333157dc33f5e1da1eaf76e5fb/third_party/WebKit/Source/platform/transforms/RotationTest.cpp [modify] https://crrev.com/b69d3d2ec0d8bd333157dc33f5e1da1eaf76e5fb/third_party/WebKit/Source/platform/transforms/TransformOperationsTest.cpp
,
Oct 7 2016
|
||||||
►
Sign in to add a comment |
||||||
Comment 1 by dtapu...@chromium.org
, Oct 4 2016