1928614 - [Toolbar Redesign] Text in address bar is white on white

Status: RESOLVED WORKSFORME

(Fenix :: Toolbar, defect, P2)

Description

[gwarser]

Steps to reproduce:

Have dark system theme, Nightly set to follow system, tap the address bar when on home page

Actual results:

The color of the address bar background is reversed, and I see white text on white background.

It's also broken like this when theme set manually to dark.

With theme set to light its broken even more - new tab page background is black, but some panels have it white, the main toolbar is light, but after tapping it, it turns dark with address bar background being light with white text.

All that (at least with dark theme) is fine when launching from the widget or after opening any page.

Expected results:

Readable address bar text.

Also, when trying to copy build ID from about page (it's difficult to report bug from Firefox on Android) I noticed that selection background is barely noticeable.

134.0a1 (Build #2016053319), hg-55a693c2543b+
GV: 134.0a1-20241030214633
AS: 134.20241030050341

on Redmi Note 10 Pro

Comment 1

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

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

Comment 2

[gwarser]

Work in progress? https://bugzilla.mozilla.org/show_bug.cgi?id=1894468

Comment 3

[Chris Peterson [:cpeterson]]

Can you please share a screenshot? Does this problem happen all the time or intermittently? What Android OS version are you running on your Redmi Note 10 Pro?

Comment 4

[:Gela]

I'm not able to reproduce this. I tried both scenarios (a. system theme set to dark and b. Fenix manually set to dark) and I'm not seeing any issues with the toolbar on my device. I'm attaching screen recordings of both scenarios.

Device: Xiaomi Redmi Note 11
OS: Android RKQ1.211001.001

Comment 5

[:Gela]

Attachment: Fenix_set_to_dark.mp4

Comment 6

[:Gela]

Attachment: system_set_to_dark.mp4

Comment 7

[gwarser]

Attachment: Screenrecorder-2024-11-13-13-50-15-902.mkv

Comment 8

[gwarser]

All that (at least with dark theme) is fine when launching from the widget or after opening any page.

When launching from the widget it's randomly light or dark, but after switching a keyboard on/off (or changing focus from/to address bar) it turns light and stays like this as long as keyboard is visible.

Comment 9

[Delia Pop (Android QA)]

Attachment: Xiaomi Redmi Note 8T.mp4

I was not able to reproduce the issue described, however, with the device in dark theme and Fenix set to Dark theme/Follow device theme, the Private Browsing mode icon from homepage is displayed in an incorrect color (dark purple instead of white). I can see the same icon in the video recording in comment 7.
The darker PB icon is present on all latest releases: Nightly 134.0a1 with the old and new toolbar, Beta 133.0b7 and Release 132.0.2.
Tested and reproduced with Xiaomi Redmi Note 8T (Android 11), Xiaomi Redmi mi11 lite (Android 11). Not reproducible with Redmi Pad SE (Android 12).

Comment 10

[Delia Pop (Android QA)]

gwarser, I'm wondering if this issue is also reproducible on Beta or Release? Could you also try disabling the new Navigation Toolbar from Secret Settings, and trying this on Nightly? Thank you in advance!

Comment 11

[gwarser]

Toggling on/off "Enable Navigation Toolbar" does not help. I cannot reproduce in stable or beta.

Comment 12

[gwarser]

It's still reproducible after resetting the browser by removing application data.

With the address bar on top, I need to tap on it to reproduce - tapping the magnifying glass icon on the bottom does not trigger the issue.

Comment 13

[gwarser]

Did you change something? It seems fixed.

Comment 14

[gwarser]

The issue is back in Build #2016056007. Or maybe after I moved the address bar to the bottom? Or maybe after adding page to shortcuts / main screen?

Comment 15

[Petru-Mugurel Lingurar [:petru]]

Looked a bit on this also.
Given how straightforward the code is

eg: we just load a drawable for the edit toolbar background the same as we do for the display toolbar but for one scenario we see the expected background while for another we don't

it looks more like an Android framework issue.
Possibly something that can be improved later with a compose rewrite of the toolbar.

Comment 16

[Petru-Mugurel Lingurar [:petru]]

Attachment: ShowcasingIssue.mp4

An mp4 instead of the mkv.

Comment 17

[Zac McKenney [:zmckenney]]

We tested this against a Redmi Note 8 & 11 and weren't able to reproduce and also it sounds intermittent. After Petru's investigation it seems like this is actually a Xiaomi themeing issue so I'm going to close as WORKSFORME. If we continue to have this issue in Firefox 135 we can reopen and investigate.

Comment 18

[gwarser]

There is a section in screen settings - "more dark mode options" - with "adjust wallpaper" (enabled) and "automatically adjust text and background" (disabled), and a list of apps with Firefox on the top, being enabled. If I toggle off the checkmark next to Firefox here, the issue disappears immediately (just switch apps and the colors are fine).

Comment 19

[Zac McKenney [:zmckenney]]

That's really helpful information! I'd imagine that is likely the issue we see with many of these themeing issues on Xiaomi devices. It seems like it's overriding the colors and causing issues.