Transform with decimal values in svg path animation occurs in a different area than the end path
Categories
(Core :: SVG, defect, P3)
Tracking
()
Tracking | Status | |
---|---|---|
firefox78 | --- | fixed |
People
(Reporter: thewingthing, Assigned: hiro)
References
Details
Attachments
(3 files)
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.14; rv:69.0) Gecko/20100101 Firefox/69.0
Steps to reproduce:
This bug is still occurring during animations (https://bugzilla.mozilla.org/show_bug.cgi?id=1561190). When the animation is done, the path then pops back into place.
This occurs with svg paths with decimal values.
Codepen: https://codepen.io/anon/pen/qzjvMg
<svg width="500" height="500" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2 2">
<path class="square" d="M .1 .1 H .9 V .9 H .10 L .10 .10"/>
<!-- Points -->
<circle cx=".10" cy=".10" r=".02" fill="red"/>
<circle cx=".90" cy=".90" r=".02" fill="red"/>
<circle cx=".90" cy=".10" r=".02" fill="red"/>
<circle cx=".10" cy=".90" r=".02" fill="red"/>
</svg>
.square {
animation-name: ani;
animation-fill-mode: forwards;
transform: scale(0);
animation-duration: 1s;
}
@keyframes ani {
to {
transform: scale(1);
}
}
Actual results:
The animation happens in an incorrect area.
Expected results:
The animation happens in the right area.
Updated•5 years ago
|
Reporter | ||
Comment 1•5 years ago
|
||
Oops, that's the wrong codepen. New codepen: https://codepen.io/anon/pen/EBXqjr
Updated•5 years ago
|
Comment 2•5 years ago
|
||
The culprit is https://searchfox.org/mozilla-central/rev/7e158713cf5a8514fa8161dd4a239737b05da64d/gfx/layers/composite/AsyncCompositionManager.cpp#606, setting true will round the origin, which is wrong for SVG element. Essentially it's the same cause as
Bug 1523343.
This search https://searchfox.org/mozilla-central/search?q=.origin()&case=true®exp=false shows the data member origin()
is only used in a few places. So the right approach might be to round the origin conditionally here: https://searchfox.org/mozilla-central/rev/7e158713cf5a8514fa8161dd4a239737b05da64d/layout/painting/nsDisplayList.cpp#785
Comment 3•5 years ago
|
||
Forgot to mention the above will only solve the non-WebRender case. The WebRender case is much worse, a decimal width will even affect color opacity... There must be some undesired rounding going on somewhere, but I'm not familiar with.
Updated•5 years ago
|
Assignee | ||
Comment 6•4 years ago
|
||
I also confirmed the patch in bug 1636119 fixes this. And I wrote a reftest based on comment 0. I will post it here.
Assignee | ||
Comment 7•4 years ago
|
||
This reftest is based on a reduced test case provided by thewingthing.
Updated•4 years ago
|
Pushed by hikezoe.birchill@mozilla.com: https://hg.mozilla.org/integration/autoland/rev/0c94dc7dfbff Add a reftest a transform aniamtion which is runnin on the compositor on a path element. r=boris
Comment 9•4 years ago
|
||
Backed out changeset 0c94dc7dfbff (bug 1561225) for Reftests failure in transform-animation-on-path.html. CLOSED TREE
Log:
https://treeherder.mozilla.org/logviewer.html#/jobs?job_id=302348030&repo=autoland&lineNumber=26887
Push with failures:
https://treeherder.mozilla.org/#/jobs?repo=autoland&group_state=expanded&revision=0c94dc7dfbff7615297f6b64e80c84db6b0132cd
Backout:
https://hg.mozilla.org/integration/autoland/rev/4516108eef2b87a2ced90ec8e177304f2ad75774
Assignee | ||
Comment 10•4 years ago
|
||
Oops, I should have run the test on Android. There seems to be still a bug... Will check it on Android emulator.
Assignee | ||
Comment 12•4 years ago
|
||
And check ShouldSnapToGrid
when we create a stacking context for the
transform display item.
I was totally missing a comment [1] in CreateAimationData.
Updated•4 years ago
|
Comment 13•4 years ago
|
||
Pushed by hikezoe.birchill@mozilla.com: https://hg.mozilla.org/integration/autoland/rev/b85c17816d3b Revert the WebRender part for bug 1636119. r=longsonr https://hg.mozilla.org/integration/autoland/rev/ab2a9658abc1 Add a reftest a transform aniamtion which is running on the compositor on a path element. r=boris
Assignee | ||
Updated•4 years ago
|
Comment 14•4 years ago
|
||
bugherder |
https://hg.mozilla.org/mozilla-central/rev/b85c17816d3b
https://hg.mozilla.org/mozilla-central/rev/ab2a9658abc1
Description
•