1811611 - App tabs have conflicting or unreadable system UI coloring (between location bar vs. system tray), if Fenix theme disagrees with system theme

Status: NEW

(Fenix :: Design System and Theming, defect)

Description

[Christian Sadilek [:csadilek]]

From github: https://github.com/mozilla-mobile/fenix/issues/22150.

Steps to reproduce

1. Activate "Dark theme" in Android system settings (in the "Display" section)
2. In Firefox or Firefox Nightly, enter the Settings area and make the following three configurations:

• Default browser: enabled
• Open links in apps: enabled (under "Advanced" near the bottom)
• Back at the top, tap "Customize" and choose Light as your theme.

3. Force-quit Firefox (by swiping its "card" offscreen in the app-switcher). If you already have the gmail app open, force-close it as well.
4. Open the Gmail app (which should look "dark"), and click a link. This will make Firefox open that link in a dedicated "app tab" inside of the Gmail app.
5. Look at the coloring of the location bar, and the system tray/UI at the top and bottom of your screen.

Expected behaviour

The Android system UI at the top and bottom of the screen should be themed dark, to match the app (Gmail) that I am still inside of, just like the location bar is.

Actual behaviour

• The Android system tray and the system UI at the very bottom of the screen are "light". This is bad/unexpected.
• The location bar is dark, matching the app that I am inside of (Gmail). This is good.
• This makes for an awkward contrast at the bottom of the screen, with the dark location bar smooshed up against some light system UI.

Device name

Google Pixel 4a

Android version

Android 12

Firefox release type

Firefox Nightly

Firefox version

95.0.a1

Device logs

No response

Additional information

This affects Nightly as well as release.

Chrome gives EXPECTED RESULTS. i.e. if I set Chrome as my default browser and perform the same theme-customization there (giving Chrome a "light theme"), then the app tab rendered by Chrome is nonetheless fully "dark" (including the system UI) when I click a link in the Gmail app.

I'm guessing that the issue here is Firefox is signalling its own configured theme to the OS (which makes the OS draw light system UI). It seems like we shouldn't do that for app tabs, since we're actively trying to blend in to whatever app we're acting as a "guest" inside of. We should instead be signalling the "host" app's theme to the OS, in the same way that we apparently use that theme to draw our app-tab location bar.

┆Issue is synchronized with this Jira Task

Change performed by the Move to Bugzilla add-on.

Comment 1

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

The severity field is not set for this bug.
:cpeterson, could you have a look please?

For more information, please visit auto_nag documentation.

Comment 2

[Mark]

Bug 1873022 is duplicate of this bug?