1961031 - Some grayed or faded out favicons difficult to view with dark theme after tabs are discarded or unloaded

Status: RESOLVED FIXED

(Firefox :: Tabbed Browser, defect)

Description

[anon]

Attachment: unloading.mkv

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

Steps to reproduce:

1. Make sure browser.tabs.fadeOutExplicitlyUnloadedTabs is set to true in about:config (Firefox Nightly).
2. Select Themes in about:addons and enable Dark theme.
3. Install Auto Tab Discard ( https://addons.mozilla.org/en-US/firefox/addon/auto-tab-discard/ ).
4. Open the Auto Tab Discard Options page, clear the symbol in the option 'Prepend a symbol to the discarded tabs...', and then click the 'Save Options' button.
5. Load the following sites in new tabs and then pin them: https://tuta.com , https://www.netflix.com , https://www.espn.com
6. Load those sites again in new tabs, but don't pin them.
7. Create a new tab and leave focus on it.
8. Discard all other tabs with Auto Tab Discard.
9. Switch between vertical tabs and horizontal tabs to view the favicons of the discarded tabs, especially the pinned tabs.

Actual results:

Tabs are now grayed out when they are discarded in Firefox 139 ( https://bugzilla.mozilla.org/show_bug.cgi?id=1926973 ).

However, the favicons on some pinned tabs become very difficult to view after they are discarded when vertical tabs and dark theme are enabled (see attached video). They are also difficult to view when using horizontal tabs if the screen brightness is reduced or warmer colors are used to reduce blue light. This can be reproduced by turning on Windows Night Light in Windows 11 or using programs like f.lux, Iris, QRedshift, etc...

Expected results:

If possible, most pinned tabs favicons should be viewable after they are discarded when vertical tabs and dark theme are enabled.

Comment 1

[Kestrel]

Regression window:
https://hg.mozilla.org/integration/autoland/pushloghtml?fromchange=3a5a672cbf434cde59ddeb10decbdf3bf4314bf1&tochange=2895d98e1d2b4191040d42841f90961dd76c0eca

Regressed by Bug 1926973.

Comment 2

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

:gstoll, since you are the author of the regressor, bug 1926973, could you take a look? Also, could you set the severity field?

For more information, please visit BugBot documentation.

Comment 3

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

The bug has a release status flag that shows some version of Firefox is affected, thus it will be considered confirmed.

Comment 4

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

Set release status flags based on info from the regressing bug 1926973

Comment 5

[Greg Stoll :gstoll]

Note that you can trigger this more easily by just loading netflix.com and then right-clicking on the tab and Unloading it. (after turning on Dark theme)

I wonder if we can detect in CSS that a dark theme is being used and turn off the extra grayscale filter in that case. I'll see if that's possible and how much that improves things.

Comment 6

[Itiel]

Another option would be to use filter: grayscale(100%) brightness(20%) invert() for dark mode:
https://searchfox.org/mozilla-central/rev/c5ed4a89fd7a8c878df552e5d53fe50e0088c15b/browser/themes/shared/urlbar-searchbar.css#570,576
but see also emilio's note up above

Comment 7

[Greg Stoll :gstoll]

Oh thanks! I tried it out and the brightness(20%) didn't seem necessary. (and I don't think emilio's note applied because I don't think these are .svg's)

I've attached how this looks in various configurations with this patch.

Comment 8

[Greg Stoll :gstoll]

Attachment: horizontal tabs pinned.png

Comment 9

[Greg Stoll :gstoll]

Attachment: horizontal tabs unpinned.png

Comment 10

[Greg Stoll :gstoll]

Attachment: vertical tabs pinned.png

Comment 11

[Greg Stoll :gstoll]

Attachment: vertical tabs unpinned.png

Comment 12

[Greg Stoll :gstoll]

Attachment: Bug 1961031 - make unloaded tab icons more visible for dark themes r=#desktop-theme-reviewers!,#tabbrowser-reviewers!

Comment 13

[Itiel]

(In reply to Greg Stoll :gstoll from comment #7)

(and I don't think emilio's note applied because I don't think these are .svg's)

Can't websites serve SVGs though?

Comment 14

[Greg Stoll :gstoll]

(In reply to Itiel from comment #13)

(In reply to Greg Stoll :gstoll from comment #7)

(and I don't think emilio's note applied because I don't think these are .svg's)

Can't websites serve SVGs though?

They can, but if I'm reading emilio's note correctly he was saying there might be a better way to do this for SVGs specifically. Since websites can serve multiple kinds of favicons I don't think we can use that better way here.

Comment 15

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/e0b7b0476212
make unloaded tab icons more visible for dark themes r=desktop-theme-reviewers,tabbrowser-reviewers,dao,emilio

Comment 16

[Serban Stanca [:SerbanS]]

https://hg.mozilla.org/mozilla-central/rev/e0b7b0476212

Comment 17

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

The patch landed in nightly and beta is affected.
:gstoll, is this bug important enough to require an uplift?

• If yes, please nominate the patch for beta approval.
  • See https://wiki.mozilla.org/Release_Management/Requesting_an_Uplift for documentation on how to request an uplift.
• If no, please set status-firefox139 to wontfix.

For more information, please visit BugBot documentation.

Comment 18

[Greg Stoll :gstoll]

Attachment: Bug 1961031 - make unloaded tab icons more visible for dark themes r=#desktop-theme-reviewers!,#tabbrowser-reviewers!

Original Revision: https://phabricator.services.mozilla.com/D246761

Comment 19

[Phabricator Automation]

firefox-beta Uplift Approval Request

• User impact if declined: unloaded tab icons will be hard to see in dark mode
• Code covered by automated testing: no
• Fix verified in Nightly: yes
• Needs manual QE test: no
• Steps to reproduce for manual QE testing: n/a
• Risk associated with taking this patch: low
• Explanation of risk level: Just a CSS change that affects unloaded tabs
• String changes made/needed: no
• Is Android affected?: no

Comment 20

[anon]

With the new changes, the favicons on tabs with about URLs (about:debugging, about:addons, about:preferences, about:performance, about:downloads, etc...) may be slightly difficult to view with dark theme when they are faded out (except for vertical pinned tabs). They become even more difficult to view when using a night light program with reduced screen brightness. It might just be the case that there will always be some faded out favicons that are hard to view, but I thought I'd mention it anyways...

Note, it looks like tabs with about URLs can't be manually unloaded, but they are faded out when the browser restores tabs on startup and the tabs aren't automatically loaded (browser.sessionstore.restore_pinned_tabs_on_demand and/or browser.sessionstore.restore_on_demand are true in about:config).

Comment 21

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

A patch has been attached on this bug, which was already closed. Filing a separate bug will ensure better tracking. If this was not by mistake and further action is needed, please alert the appropriate party. (Or: if the patch doesn't change behavior -- e.g. landing a test case, or fixing a typo -- then feel free to disregard this message)

Comment 22

[Greg Stoll :gstoll]

(In reply to anon from comment #20)

With the new changes, the favicons on tabs with about URLs (about:debugging, about:addons, about:preferences, about:performance, about:downloads, etc...) may be slightly difficult to view with dark theme when they are faded out (except for vertical pinned tabs). They become even more difficult to view when using a night light program with reduced screen brightness. It might just be the case that there will always be some faded out favicons that are hard to view, but I thought I'd mention it anyways...

Note, it looks like tabs with about URLs can't be manually unloaded, but they are faded out when the browser restores tabs on startup and the tabs aren't automatically loaded (browser.sessionstore.restore_pinned_tabs_on_demand and/or browser.sessionstore.restore_on_demand are true in about:config).

Thanks for the note!

I agree that there are some kinds of favicons that this will make harder to view. I don't have a great solution for that - maybe we can make what the fading out does more configurable somehow?

But in the specific case of about URLs I don't think this will be a problem by default. browser.tabs.fadeOutExplicitlyUnloadedTabs is true by default, which means that only tabs that are explicitly unloaded by the user (and not by session restore) will be faded out. browser.tabs.fadeOutUnloadedTabs controls the behavior of fading all unloaded tabs (including those that were never loaded by session restore), but that will be false by default - we decided that would be too jarring. (although I personally like it and use it on my Firefox :-) )

So with the prefs set to their default values I don't think about pages should ever have the faded favicons.

Comment 23

[Pulsebot]

https://hg.mozilla.org/releases/mozilla-beta/rev/07e505d08461