Open Bug 1710432 Opened 2 years ago Updated 2 years ago

Windows 10 custom context menu styling's rounded corners do not look well-rounded


(Firefox :: Menus, defect, P3)

Firefox 90
Windows 10



Tracking Status
firefox89 --- wontfix
firefox90 --- affected


(Reporter: andro.marian.v94, Unassigned)


(Blocks 1 open bug)


(Whiteboard: [proton-context-menus])


(6 files, 1 obsolete file)

Attached file (obsolete) —

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/90.0.4430.93 Safari/537.36

Actual results:

  1. The context menu rounded corner not looks rounded. The edge pixels looks too sharp.
  2. The main menu rounded corner looks too blurry to me.
OS: Unspecified → Windows 10
Hardware: Unspecified → x86_64

The Bugbug bot thinks this bug should belong to the 'Firefox::Theme' component, and is moving the bug to that component. Please revert this change in case you think the bot is wrong.

Component: Untriaged → Theme

Hello I have tried to reproduce this issue using Firefox 87.0 on Ubuntu 20 but unfortunately I wasn't able to reproduce it.
Could you please answer the following questions in order to further investigate this issue:

  1. Does this issue happen with a new profile? Here is a link on how to create a new profile:
  2. Are you using add-ons? If so could you please list them?
  3. Does this issue occur in the latest nightly version of firefox? Here is a link from where you can download it:
  4. On what resolution are you encountering this issue?
  5. On what GPU are you encountering this issue(GPU model and driver used)?

Thank you!

Flags: needinfo?(andro.marian.v94)
Attached video PcaAW1eSbO.mp4
  1. Why you testing it on Ubuntu if I submit it for Windows?
  2. What that should to with anything... But Yes
  3. Yes, and has more bugs than 87
  4. What this has anything to do with it? 1920x1080 Native 100% Scale
  5. What this has anything to do with it? Intel HD 4600 -
Flags: needinfo?(andro.marian.v94)

The video is from other Bug. I was get 2 emails and tangled them, sorry.

  1. No on Nightly, is just for testing
  2. Is form other issue. But is on the latest Nightly

Hello Andronachi! Thank you for your reply! I have managed to reproduce the issue on Windows 10 with Firefox Nightly 90.0a1(2021-05-12) and 89.0b11. I would like to mention that this issue also occurs on Ubuntu and MacOS 10.15 as well but it's very hard to spot at the first look.

I will add a component to this issue in order to get the developers involved, if it's not the right component please feel free to change it to an appropriate one.

Thank you!

Severity: -- → S3
Component: Theme → Menus
Ever confirmed: true
OS: Windows 10 → All
Hardware: x86_64 → Desktop
Attached image Proton-ContextMenu.png

First image from attachment 9221132 [details]

Attached image Proton-MainMenu.png

Second image from attachment 9221132 [details]

Reporter: for future reference, please upload images individually rather than in archives, as it makes them much easier to see instead of having to download attachments manually, un-archiving them, etc.

Attachment #9221132 - Attachment is obsolete: true

I genuinely can't tell what the issue is from these screenshots. The border radius on the context menu is meant to be 4px ( ) so I don't know why you're comparing it with 5px. For the main menu, it looks like the border color in the CSS example and the menu are different, so again they can't be compared directly. The corner rounding on the context menu on Windows has some known issues, which is bug 1705254 , but those are around the bottom right-hand corner, so I don't know what issue you're seeing at the top but I can't see it in the blown-up screenshot (that goes for both the hamburger menu and the context menu).

Can you attach normal resolution screenshots and describe in more detail what you believe is wrong, or how you think it should be fixed?

Flags: needinfo?(andro.marian.v94)
Attached image border.png

Because the 4px looks like this. With no box shadow and the corners still not looking the same.
Maybe that bug has something to do with this. But still the pixels are too full on opacity and way to different from the CSS.

Flags: needinfo?(andro.marian.v94)

On white background is not too much. But on dark background is really noticeable to me.

Attached image TelegramMenu.png

This is how the telegram menu are the same as 4px with CSS one.
And how should be.

Emilio, can you provide some context about what would cause the rendering difference here, and if there's anything we can do about it? I suspect that because the menu is not in the same document as the background, achieving the same rendering may not be possible, but perhaps I'm missing something obvious...

Flags: needinfo?(emilio)
OS: All → Windows 10
See Also: → 1705254
Summary: Proton rounded corners not looks too rounded → Windows 10 custom ontext menu styling's rounded corners do not look well-rounded against dark backgrounds
Whiteboard: [proton-context-menus]
Attached image TelegramCorners.png

Not really only on dark. But overall. Pixels should be the same if is on white or dark.

This is probably more of a question for WebRender folks, but yeah, afaict antialiasing across windows (the browser popup is really a different window) is probably pretty hard.

Flags: needinfo?(emilio)
Summary: Windows 10 custom ontext menu styling's rounded corners do not look well-rounded against dark backgrounds → Windows 10 custom context menu styling's rounded corners do not look well-rounded
Priority: -- → P3
You need to log in before you can comment on or make changes to this bug.