[Regression] Radial gradient rendered as solid block when second color is transparent
Categories
(Core :: Graphics: WebRender, defect)
Tracking
()
Tracking | Status | |
---|---|---|
firefox-esr78 | --- | unaffected |
firefox88 | --- | wontfix |
firefox89 | --- | verified |
firefox90 | --- | verified |
People
(Reporter: bsh, Assigned: nical)
References
(Regression)
Details
(Keywords: regression)
Attachments
(3 files)
90.78 KB,
image/png
|
Details | |
661 bytes,
text/html
|
Details | |
48 bytes,
text/x-phabricator-request
|
pascalc
:
approval-mozilla-beta+
|
Details | Review |
User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:88.0) Gecko/20100101 Firefox/88.0
Steps to reproduce:
A background-image is defined with a radial-gradient.
In one case, the second color is fully visible (alpha=1).
In the other case, the second color is fully transparent(alpha=0).
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>demo</title>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<style type="text/css">
.test {
position: absolute;
width: 300px;
height: 900px;
border: 1px solid black;
background-color: white;
}
#test1 {
left: 10px;
background-image: radial-gradient(ellipse 5px 20px at 100px 300px, blue 0, rgba(255,255,255,1) 300px);
}
#test2 {
left: 350px;
background-image: radial-gradient(ellipse 5px 20px at 100px 300px, blue 0, rgba(255,255,255,0) 300px);
}
</style>
</head>
<body>
<div class="test" id="test1"></div><!-- OK -->
<div class="test" id="test2"></div><!-- NOK -->
</body>
</html>
Actual results:
The radial gradient with alpha=0 is not rendered correctly. Instead of a large ellipsis that fades from one color to transparent, only a small rectangular block is rendered. The gradient with alpha=1 is correct.
This is a regression with Firefox 88. It is rendered fine in Firefox 87 and Chrome 90.
Expected results:
Both gradients in the example provided should look the same.
Comment 1•4 years ago
|
||
The Bugbug bot thinks this bug should belong to the 'Core::Graphics: WebRender' component, and is moving the bug to that component. Please revert this change in case you think the bot is wrong.
Comment 2•4 years ago
|
||
Comment 3•4 years ago
|
||
-> bug 1687977
not fixed in latest nightly
Updated•4 years ago
|
Updated•4 years ago
|
Assignee | ||
Comment 4•4 years ago
|
||
The bounds of a radial gradient primitive's radius have to be scaled by the end_offset parameter.
Updated•4 years ago
|
Assignee | ||
Updated•4 years ago
|
Comment 5•4 years ago
|
||
Set release status flags based on info from the regressing bug 1687977
Updated•4 years ago
|
Comment 7•4 years ago
|
||
bugherder |
Comment 8•4 years ago
|
||
The patch landed in nightly and beta is affected.
:nical, is this bug important enough to require an uplift?
If not please set status_beta
to wontfix
.
For more information, please visit auto_nag documentation.
Assignee | ||
Comment 9•4 years ago
|
||
Comment on attachment 9220325 [details]
Bug 1708122 - Fix the radial gradient optimization. r=#gfx-reviewers
Beta/Release Uplift Approval Request
- User impact if declined: Some radial gradients won't render correctly
- Is this code covered by automated tests?: Yes
- Has the fix been verified in Nightly?: Yes
- Needs manual test from QE?: No
- If yes, steps to reproduce:
- List of other uplifts needed: None
- Risk to taking this patch: Low
- Why is the change risky/not risky? (and alternatives if risky): Simple enough.
- String changes made/needed:
Comment 10•4 years ago
|
||
Comment on attachment 9220325 [details]
Bug 1708122 - Fix the radial gradient optimization. r=#gfx-reviewers
88 regression, patch has tests and was verified in nightly, approved for 89 beta 11, thanks.
Comment 11•4 years ago
|
||
bugherder uplift |
Updated•4 years ago
|
Updated•4 years ago
|
Comment 12•4 years ago
|
||
Verified as fixed on Windows 10 x64, macOS 10.15 and on Ubuntu 20.04.
Description
•