Firefox 90 breaks display of SVG objects
Categories
(Core :: Graphics: WebRender, defect)
Tracking
()
Tracking | Status | |
---|---|---|
firefox-esr78 | --- | unaffected |
firefox90 | --- | wontfix |
firefox91 | --- | verified |
firefox92 | --- | verified |
People
(Reporter: salvatore, Assigned: mattwoodrow)
References
(Regression)
Details
(Keywords: regression)
Attachments
(4 files)
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.1.1 Safari/605.1.15
Steps to reproduce:
The following minimal code results in the SVG not displaying. This used to work in Firefox 89, and still works in the latest Chrome:
<style>
img, object {
position: absolute;
top: 0;
left: 0;
width: 300px;
}
object {
z-index: 1;
}
</style>
<img src="https://cdn.astrobin.com/thumbs/jbZsQUF0B1qc_1824x0_n1wMX-gx.jpg">
<object type="image/svg+xml" data="https://cdn.astrobin.com/pixinsight-solutions-regular/GC2D5KMJ66Y2VVQFSGD9PUD1GNCHCRHO.svg"></object>
This is available in this JSFiddle:
https://jsfiddle.net/df1c7jut/
Actual results:
The SVG overlay is not visible on top of the image.
Expected results:
The SVG overlay, with the coordinate grid and the circles and labels near the detected galaxies, is not visible. It should look like the attached screenshot;
Updated•3 years ago
|
This file contains a minimal reproduction path that can be loaded locally.
This is the result of the bisect via mozregression
:
2021-07-17T11:38:09.646000: DEBUG : Found commit message:
Bug 1548056 - Use nsDisplayItem::Paint and DLBI to paint fallback filters instead of FrameLayerBuilder. r=jrmuizel
Differential Revision: https://phabricator.services.mozilla.com/D115321
2021-07-17T11:38:09.646000: DEBUG : Did not find a branch, checking all integration branches
2021-07-17T11:38:09.648000: INFO : The bisection is done.
2021-07-17T11:38:09.649000: INFO : Stopped
This file is a screenshot of mozregression
, with the panes scrolled all the way down to the end.
The last bad commit is highlighted.
Updated•3 years ago
|
Updated•3 years ago
|
Comment 4•3 years ago
|
||
If you disable WebRender, this problem will disappear.
Updated•3 years ago
|
Updated•3 years ago
|
Assignee | ||
Comment 5•3 years ago
|
||
Updated•3 years ago
|
Assignee | ||
Updated•3 years ago
|
Comment 7•3 years ago
|
||
bugherder |
Comment 8•3 years ago
|
||
Is that a fix we should have in 91 or would it be safer to let it ship in 92? Thanks
Thanks for addressing this so quickly! Quick question, if you don't mind: is there anything I can do as a workaround to make it work on Firefox 90 for now?
For instance, as the reported scenario doesn't work as-is in Safari, I do the following:
var isSafari = navigator.vendor && navigator.vendor.indexOf('Apple') > -1 &&
navigator.userAgent &&
navigator.userAgent.indexOf('CriOS') === -1 &&
navigator.userAgent.indexOf('FxiOS') === -1;
if (isSafari) {
var contentDocument = document.getElementById("advanced-plate-solution-svg").contentDocument;
contentDocument.querySelector("svg > g").removeAttribute("filter");
}
This drops the shadows, in my case. Could I do something similar to Firefox to make it work there for now?
Thanks!
Assignee | ||
Comment 10•3 years ago
|
||
I would assume the same fix would help for Firefox 90?
The specific issue here is that we're applying a 'complex' filter to an object with enormous bounds (the 3rd 'g' element is 3112990x1935910 pixels), and we were failing to restrict that to the subset that's actually visible.
So anything that removes the filter or reduces/clips the size of the 3rd g element should work.
Assignee | ||
Comment 11•3 years ago
|
||
Comment on attachment 9232769 [details]
Bug 1720986 - Reinstate clipping filters within SVG to the building rect. r?jrmuizel
Beta/Release Uplift Approval Request
- User impact if declined: Failed rendering of SVG filters in rare cases.
- Is this code covered by automated tests?: Yes
- Has the fix been verified in Nightly?: No
- 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): Pretty low risk, just changes the clipping rectangle we draw SVG filters with.
- String changes made/needed:
Reporter | ||
Comment 12•3 years ago
|
||
Thanks Matt, the code above also works for Firefox 90 to workaround the bug.
Comment 13•3 years ago
|
||
Comment on attachment 9232769 [details]
Bug 1720986 - Reinstate clipping filters within SVG to the building rect. r?jrmuizel
Approved for 91 beta 8, thanks.
Comment 14•3 years ago
|
||
bugherder uplift |
Updated•3 years ago
|
Updated•3 years ago
|
Updated•3 years ago
|
Comment 15•3 years ago
•
|
||
I have reproduced the issue using an affected Nightly 92.0a1 (20210717093616) on Windows 10x64.
Verified fixed with Firefox 91.0b8 (20210727185725) and 92.0a1 (20210728215815) on Windows 10x64, macOS 10.15 and Ubuntu 20.04.
Description
•