Issue with css animation when webrender is disabled
Categories
(Core :: Graphics, defect, P2)
Tracking
()
People
(Reporter: ryanjmack21, Unassigned)
References
(Regression)
Details
(Keywords: regression)
Attachments
(1 file)
7.98 KB,
image/png
|
Details |
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:74.0) Gecko/20100101 Firefox/74.0
Steps to reproduce:
This affects FF v70+. When reverting to earlier versions of FF, the issue can't be reproduced. This issue is also specific to FF and not other browsers.
User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:74.0) Gecko/20100101 Firefox/74.0
Demo of bug:
https://codepen.io/ryanMackIllumio/pen/XWbaqRq
The issue becomes resolved if you remove border-radius on the progress bar. Setting overflow: hidden
on the button, and removing the border-radius on the progress bar resolves the issue, but unfortunately isn't an option in our specific use case.
Also, if I navigate to about:config
and set gfx.webrender.all
to true, the animation behaves as expected. None of the other gfx
flags resolves the issue.
Actual results:
The animation for the progress bar has rough, choppy edges.
See the attached screenshot for reference.
Expected results:
The edges of the progress bar should be smooth.
Comment 1•5 years ago
|
||
Bugbug thinks this bug should belong to this component, but please revert this change in case of error.
Updated•5 years ago
|
Updated•5 years ago
|
Updated•5 years ago
|
Comment 3•5 years ago
|
||
macos specific, and fixed by enabling webrender
Comment 4•5 years ago
|
||
Reproduced this on the toronto windows testing machine (GTX 950) with d3d11 compositing as well.
Updated•2 years ago
|
Updated•2 years ago
|
Updated•2 years ago
|
Description
•