Consider making prefers-color-scheme respect the Firefox theme rather than the system theme

NEW
Unassigned

Status

()

enhancement
P3
normal
2 months ago
3 days ago

People

(Reporter: ntim, Unassigned)

Tracking

(Blocks 1 bug, {dev-doc-needed})

Firefox Tracking Flags

(Not tracked)

Details

(Reporter)

Description

2 months ago

I think it would make more sense given that an user can have a light system theme, but Firefox theme set to dark. Vice-versa also applies.

(Reporter)

Comment 1

2 months ago

-moz-system-dark-theme can be preserved for making the default theme match the dark mode.

Notable side effect: this would enable prefers-color-scheme: dark on OSes that don't currently have a dark mode (e.g. Linux, Windows 7 and 8).

I think this is fine. The harder part would be to communicate theme changes across processes. The theme is currently kept in XULDocument, we'd need a way to broadcast that to all content processes.

(Reporter)

Comment 4

2 months ago

(In reply to Emilio Cobos Álvarez (:emilio) from comment #3)

I think this is fine. The harder part would be to communicate theme changes across processes. The theme is currently kept in XULDocument, we'd need a way to broadcast that to all content processes.

There's already a mechanism to do communicate theme changes to the content process, the new tab page uses it.

See: https://searchfox.org/mozilla-central/source/browser/actors/LightweightThemeChild.jsm

That looks all JS, no way I call that from media query evaluation, would need to move that to C++, do you know who would know what's the best way to do that?

We could use a pref, right? I.e. set it from JS, read it in the style system.

Aye, I guess that'd do.

I think it's fine to make Firefox dark theme enable 'prefers-color-scheme: dark',
but the default behavior should be that Firefox honors the system theme (and
signals that in 'prefers-color-scheme').

(In reply to Mats Palmgren (:mats) from comment #8)

I think it's fine to make Firefox dark theme enable 'prefers-color-scheme: dark',
but the default behavior should be that Firefox honors the system theme (and
signals that in 'prefers-color-scheme').

The default behavior is that Firefox switches to the dark theme based on the system setting, so that would take care of it. Another question is what should happen if some other non-builtin theme is selected. We should probably just use the system setting then. All of that logic could live in front-end code.

See Also: → 1529897
See Also: → 1523990

I'm not opposed to this, but I would think that if we want to do it we should attempt to clarify this as an option as part of the spec in MQ5: https://drafts.csswg.org/mediaqueries-5/#prefers-color-scheme

That is, what is meant by "system" preferences could include UA preferences which take precedent over the operating system.

Priority: -- → P3

My first instinct is to not do this. It seems light/dark mode is something the user should set for the OS, knowing that setting will affect interfaces and content throughout their experience. Setting the Firefox theme doesn't seem like something that would change the experience of website content. We'd have to change user expectations.

(We want to debate this from the point of view of the users, not the technical perspective of the browser engine.)

But actually, I don't know what web designers would think of this, so I asked the question in a Tweet (super-unscientific-research). https://twitter.com/jensimmons/status/1103007418588454914

Another thought — currently Firefox defaults to the dark toolbar, the dark theme. So would we ship Firefox defaulting all websites to dark mode? Or would we change Firefox's default to the light theme? It seems like a severe choice to default (any website that has a dark mode) to dark mode, even for users who have not set dark mode in their OS, and likely haven't even heard of dark mode. It could create a lot of confusion to update Firefox, and suddenly some sites have dark background and light text.

(In reply to Jen Simmons [:jensimmons] from comment #11)

Another thought — currently Firefox defaults to the dark toolbar, the dark theme. So would we ship Firefox defaulting all websites to dark mode? Or would we change Firefox's default to the light theme? It seems like a severe choice to default (any website that has a dark mode) to dark mode, even for users who have not set dark mode in their OS, and likely haven't even heard of dark mode. It could create a lot of confusion to update Firefox, and suddenly some sites have dark background and light text.

This bit is not right, IIUC. Firefox defaults to the system setting (so dark in dark mode, light in light mode). So doing this would only affect users that configure Firefox to disagree with their system settings.

I think making the media query agree with the browser theme in that case is a sensible thing to do, but I don't feel strongly either way.

Oh I see. I thought the default theme — with its dark toolbar — was the same as a Firefox "dark theme". Actually nope. There are three themes, and the true dark mode has an even-darker toolbar than the default theme.

My mistake.

Here's a screenshot for anyone's who's confused like I was. https://monosnap.com/direct/RjZGGvY7bOQTFRdgQRyaaAR8Qrdbi1

Thanks, Emilio.

Another point of consideration (not sure if I should open a separate bug for this):

Currently prefers-color-scheme is stuck to light once resistFingerprinting is enabled, making it impossible for users to both communicate their color preference to a website and enable general fingerprinting resistance. There should be an option (pref?) to set prefers-color-scheme to light/dark/no-preference regardless of system, browser or resistFingerprinting setting or at least a way to enable "correct" (by whatever metric is decided) prefers-color-scheme, even if general fingerprinting resistance is enabled.

That should probably be a separate bug. There is already a pref (ui.systemUsesDarkTheme), it's just checked after resistFingerprinting.

OK, thanks. I filed bug 1535189 for that.

See Also: → 1535189
You need to log in before you can comment on or make changes to this bug.