1815752 - webextension icon is blurry

Status: RESOLVED MOVED

(WebExtensions :: Developer Outreach, defect, P3)

Description

[Daniel Naber]

User Agent: Mozilla/5.0 (X11; Linux x86_64; rv:109.0) Gecko/20100101 Firefox/110.0

Steps to reproduce:

Install https://addons.mozilla.org/firefox/addon/languagetool/ and click the recently introduced puzzle icon in the toolbar. The LanguageTool icon will be there, but it might be blurry. Note this is not always the case, the issue isn't 100% reproducible. A user also reported the icon to be blurry once it's in the toolbar.

Expected results:

The icon shouldn't be blurry, as we have defined several resolutions in the manifest.json:

"icons": {
"16": "assets/images/icons/icon16.png",
"32": "assets/images/icons/icon32.png",
"48": "assets/images/icons/icon48.png",
"64": "assets/images/icons/icon64.png",
"128": "assets/images/icons/icon128.png"
},

Original report at LanguageTool can be found at https://github.com/languagetool-org/languagetool/issues/7797

Comment 1

[BugBot [:suhaib / :marco/ :calixte]]

The Bugbug bot thinks this bug should belong to the 'Core::Graphics: WebRender' component, and is moving the bug to that component. Please correct in case you think the bot is wrong.

Comment 2

[Brad Werth [:bradwerth]]

Since the image was also blurry in the welcome page, it's likely an image caching issue. I've been trying to reproduce on macOS, without success. Your comment says it's not always reproducible: does that mean that reproduction sometimes happen when uninstalling and reinstalling for the same user? Or do you mean that this happens only for some users, and once it starts working for a user it continues to work?

I'll keep trying with clean profiles and emptied network caches. In the meantime, please see if you can identify a regression window using the mozregression tool.

Comment 3

[Brad Werth [:bradwerth]]

Using mozregression on macOS, I can reproduce this bug. Regressor is Bug 1799947.

Comment 4

[Mike Conley (:mconley) (:⚙️)]

Hey bradwerth,

I've been trying to reproduce on macOS, without success.

You originally had difficulty reproducing, and then you were able to, to the point where you could use mozregression - what made the difference? Do you have STR that make the issue occur more reliably?

Comment 5

[Brad Werth [:bradwerth]]

(In reply to Mike Conley (:mconley) (:⚙️) from comment #4)

Hey bradwerth,

I've been trying to reproduce on macOS, without success.

You originally had difficulty reproducing, and then you were able to, to the point where you could use mozregression - what made the difference? Do you have STR that make the issue occur more reliably?

I was misreading the original STR. I just confirmed that a clean profile in today's Nightly does show the problem. In my initial read of the STR, using my normal profile my toolbar puzzle icon button wasn't showing the icon of the newly-installed extension, so I was instead looking at the extension's icon on the toolbar itself (fine) and on the welcome page (also fine). So I wasn't looking at the right part.

Comment 6

[Mike Conley (:mconley) (:⚙️)]

Ah, yes, I can reproduce too. The issue is that the widget is still getting the 16x16px icon set even though it's placed in the menu panel. I'm going to redirect this needinfo to willdurand, who is more familiar with this part of the codebase than I am.

Comment 7

[William Durand [:willdurand]]

:mconley do you reproduce in Nightly or Release? I am wondering if this could be a variant of Bug 1811128?

Comment 8

[Mike Conley (:mconley) (:⚙️)]

I was able to reproduce it in the most recent Nightly (Feb 8, 2023).

Comment 9

[Daniel Naber]

does that mean that reproduction sometimes happen when uninstalling and reinstalling for the same user?

I couldn't find out how to reproduce it, but I have seen the issue appearing and then disappearing for the same user and the same profile. I think the issue was introduced when the puzzle icon first appeared (I use Firefox beta, so that's already some time ago).

Comment 10

[William Durand [:willdurand]]

Sigh, sorry I didn't read all the comments and now see that it's been mentioned two times. Thanks Mike!

From what I can see in the manifest.json, browser_action.default_icon is using a 16px icon so I think that's why we use the 16px. See the MDN docs about how to add different icons: https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/browser_action#choosing_icon_sizes

Since the introduction of the extensions button, browser actions should have 16px icons (when used in the toolbar) and 32px icons (in the extensions panel), and 32/64px for high resolution.

Daniel, could it be the problem here?

Comment 11

[Daniel Naber]

Daniel, could it be the problem here?

Thanks, a colleague who could reproduce the issue thinks this solves it (the add-on update is not yet released).

Comment 12

[Alex Cornestean]

Hello,

I reproduced the issue on the latest Nightly (111.0a1/20230209213208), Beta (110.0/20230206190557) and Release (109.0.1/20230127170202) under Windows 10 x64 and macOS 11.3.1.

The extension icon is definitely blurry in the extensions panel on both Windows and macOS.

When pinning the extension to toolbar, I can’t tell if it’s actually blurry on Windows on my end (or the issue did not occur this time for me), but definitely blurry on macOS.

See the attached screenshots for more details.

Comment 13

[Alex Cornestean]

Attachment: 2023-02-10_10h45_17.png

Comment 14

[Alex Cornestean]

Attachment: Not sure if blurry - Windows.png

Comment 15

[Alex Cornestean]

Attachment: Definitely blurry - macOS.png

Comment 16

[William Durand [:willdurand]]

This is a bug in the extension. I am going to move the bug to a new component and wait until a new version of the add-on fixes this problem.

In addition, I'll see if we need to update our docs.

Comment 17

[Shane Caraveo (:mixedpuppy)]

fix for this is in the extension. moving out of triage

Comment 18

[Luca Greco [:rpl] [:luca] [:lgreco]]

Closing as moved, per comment 11 the details provided by comment 10 have been enough to help the extension developers to track down the issue and prepare a fix.