arkenfox / user.js

Firefox privacy, security and anti-tracking: a comprehensive user.js template for configuration and hardening
MIT License
9.96k stars 511 forks source link

FYI: ui.use_standins_for_native_colors can break styling in chrome, themes, extensions #682

Closed VoidSignal closed 5 years ago

VoidSignal commented 5 years ago

Thorin says: FYI, in FF67+ privacy.resistFingerprinting (RFP) will enforce the behavior of the ui.use_standins_for_native_colors pref, so your only solution is to get the theme and extensions devs to change their code - or you can go without RFP, but why would you do that?, seriously, don't do that!


original post

menu On the left is a fresh profile with no user.js whatsoever, on the right is a fresh profile with the latest user.js from the master. Notice how on the right Tree Style Tab appearance also doesn't match system style.

I've read through the entire user.js twice, but I have no idea what might be causing it.

VoidSignal commented 5 years ago

I'm using Arc Dark theme (the latest version from Arch Linux repositories), Xfce desktop environment. Disabling privacy.resistFingerprinting didn't solve the problem.

VoidSignal commented 5 years ago

Here's Tree Style Tab and here's Arc theme. Click on "Download From Mirror" and extract the contents of /usr/share/themes/ to wherever themes go on Ubuntu. I'd guess they go exactly into /usr/share/themes/.

But there's no need, because disabling ui.use_standins_for_native_colors fixes the issue. I guess what remains how is to warn others of possible breakage?

Edit: Is it a bug in FF or expected behavior?

VoidSignal commented 5 years ago

Okay, I'll keep you posted.

Why are they even shoveling so much into a single pref?

VoidSignal commented 5 years ago

@Thorin-Oakenpants thanks for the follow up.

I didn't play with themes in Linux. But I assume the same would apply.

I've run the test and got a different hash from everything you've listed, so you are indeed correct.

The original issue is quickly becoming irrelevant for me since I now set user_pref("widget.content.gtk-theme-override", "Arc") to enforce light variant of the system theme for page elements. This pref also affects the default appearance of Tree Style Tab which now of course matches Arc theme, not Arc Dark. In any case, I'll have to style it manually to fit it with the rest of the interface. Fortunately, there's an option for that.

At this point, I've come to the conclusion that it is an issue with Firefox itself. I have no idea why it uses system colors on web pages in the first place instead of shipping sensible cross-platform defaults. The fact that Tree Style Tab blends so nicely with the rest of the interface is the only nice consequence of that.

VoidSignal commented 5 years ago

PS: will edit your top post with your solution

This is not a solution. widget.content.gtk-theme-override does not fix context menus in about:config and about:addons and it doesn't return system styling to Tree Style Tab.

From now on let "gtk pref" = widget.content.gtk-theme-override and "colors pref" = ui.use_standins_for_native_colors.

Firefox applies system style to "widgets" (checkboxes, input fields, buttons, dropdown lists...). This is their default style that can be overridden in CSS. Gtk pref merely provides a way to change what theme is used. Widget style is not affected by colors pref and only obeys gtk pref.

Gtk pref is needed because when you use dark theme widgets often don't fit with the rest of the page when defaults are used. You also might get black text on dark background if for a certain widget text color is explicitly set to black, but background color is not set.

I'm assuming there's a JS API to read system colors, otherwise you couldn't have created that test. Gtk pref also affects what values are supplied via that API. I get vastly different results on your test when gtk pref is not set (Arc Dark is used), when it's set to Ark (Ark is used) and when colors pref is on (some spoofed values are used).

Apparently, Tree Style Tab uses that API to blend with the rest of the interface. If colors pref is on, of course it can't do that and that was what I observed initially.

Later I turned color pref off as you suggested, but I also set gtk pref to Ark for the reasons outlined above. That caused Tree Style Tab to use colors from Ark, but I wanted it to use colors from Ark Dark which is impossible unless I unset gtk pref which is undesirable. That's what I meant when I said that the issue is no longer relevant. If color pref is on, Tree Style Tab uses spoofed colors. If color pref is off it uses Ark colors. Neither is what I want and I'll have to style it manually anyway.

Here are some pics:

umatrix

reddit

You can clearly see that they have Arc Dark styling. If I set user_pref("widget.content.gtk-theme-override", "Arc") they will be styled accordingly.

VoidSignal commented 5 years ago

GTK is most likely going to be removed, AFAIK

Do you mean widget.content.gtk-theme-override will be removed soon?

Do themes have to be signed? If not you could probably just change the css rules for widgets and reload it?

I'm not sure what you mean by that.