Closed Bug 1574212 Opened 5 years ago Closed 4 years ago

snapping issue with buttons + shadows (was: CSS element appear broken)

Categories

(Core :: Graphics: WebRender, defect, P3)

68 Branch
defect

Tracking

()

RESOLVED FIXED

People

(Reporter: andreas, Unassigned)

References

(Blocks 1 open bug)

Details

Attachments

(4 files, 1 obsolete file)

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:68.0) Gecko/20100101 Firefox/68.0

Steps to reproduce:

Just updated Firefox and since the 68 update website appears to have css related issues

Actual results:

CSS related issues, specifically on this website gordian-knot.eu on the header and element class btns the background and border appear to be broken. They appear properly in all other browsers.

Hi Andreas,

Thanks for your report.
I tried reproducing the issue reported on https://gordian-knot.eu/ using Firefox Release latest version 68.0.2 and Firefox Nightly latest version 70.0a1 (2019-08-20) but the mentioned website displays ok on my end. I'll be attaching a screenshot on my next message.

Can you please try to open the site using Firefox Nightly and share your results with us? You can download Nightly from here: https://nightly.mozilla.org/

If there is any other info you can provide to help us figure out how we can reproduce the issue (like a different site, test page or steps) please share them.

Regards,

Flags: needinfo?(andreas)
Component: Untriaged → CSS Parsing and Computation
Product: Firefox → Core

Thanks a lot for the report; As Virginia, the site looks ok to me.

I'm happy to investigate if there are concrete steps to reproduce though. Any extension installed? Need to be logged-in? Any window size? Any URL in particular?

Otherwise you could try to run https://mozilla.github.io/mozregression/ to figure out what change it actually broke the site.

(In reply to Virginia Balducci from comment #1)

Hi Andreas,

Thanks for your report.
I tried reproducing the issue reported on https://gordian-knot.eu/ using Firefox Release latest version 68.0.2 and Firefox Nightly latest version 70.0a1 (2019-08-20) but the mentioned website displays ok on my end. I'll be attaching a screenshot on my next message.

Can you please try to open the site using Firefox Nightly and share your results with us? You can download Nightly from here: https://nightly.mozilla.org/

If there is any other info you can provide to help us figure out how we can reproduce the issue (like a different site, test page or steps) please share them.

Regards,

Hello.

You have to login to reproduce probably. Use Test as ID and trooper1979!@# as password. Thank you

Flags: needinfo?(andreas)

Can you attach your about:support? I see some white seams around the corners in the test-case in comment 5. Do you see something similar to your screenshots?

Also, does the Compositing section of your about:support say WebRender by any chance? I only seem to reproduce this with WebRender enabled.

Flags: needinfo?(andreas)
Priority: -- → P5

How do I attach the about:support? I opened it but it's a huge wall of text. Should I save it in a txt and upload it or something else?

Flags: needinfo?(andreas)

Also the issue is the same in the new version 69.0

Attached file about-support.txt (obsolete) —

You seem to have attached the about:support from safe mode, is that intentional?

By mistake. Here's the proper one.

Attached file about-support.txt
Attachment #9090344 - Attachment is obsolete: true

Yeah, so when you hit the issue you're using WebRender. Can you confirm that on safe mode or if you toggle gfx.webrender.force-disabled to true in about:config the problem goes away, and that you see the problem with attachment 9086848 [details]?

This seems to be a WebRender snapping issue. The good thing is that there's work ongoing to fix these (bug 1574493).

Status: UNCONFIRMED → NEW
Component: CSS Parsing and Computation → Graphics: WebRender
Ever confirmed: true
See Also: → wr-snapperific
Summary: css element appear broken → snapping issue with buttons + shadows (was: CSS element appear broken)

The component has been changed since the backlog priority was decided, so we're resetting it.
For more information, please visit auto_nag documentation.

Priority: P5 → --

Bug 1574493 makes the borders more subtle and closer to Chrome/non-WebRender Firefox, but I'm not sure if it fixes it completely. It should hopefully land this week and we can reevaluate.

Blocks: wr-snap
Priority: -- → P3

I think the effects reported are resolved by bug 1574493. It renders slightly differently from Chrome but no longer has the stark white corners. Andreas, can you confirm that on nightly in builds 20190914212452 or later that this is resolved? Thanks!

Flags: needinfo?(andreas)

Yes. Latest nihgtly fixed the issue but I have to say that in chrome still looks more neat. I do not remember how it was in the past though. (older versions)

Flags: needinfo?(andreas)

We have landed a few more fixes that seemed to have improved things. I would say at this point the rendering differences between Chrome and Firefox for me depend on the zoom/device pixel scale details. We are closer with WebRender than basic compositor is today. There are also zooms for me (200% display scaling on Linux, 67% Chrome zoom) where Chrome is much worse than us at any zoom (solid white bars on some vertical sides of the boxes), whereas WebRender is now very consistent.

Status: NEW → RESOLVED
Closed: 4 years ago
Resolution: --- → FIXED
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: