1583985 - On Ubuntu, "Find in Preferences" searchbox is offset to the right, on the Privacy and Security page of about:preferences, due to wide alerts-for-breached-websites-learn-more label

Status: VERIFIED FIXED

(Firefox :: Settings UI, defect, P1)

Description

[Daniel Holbert [:dholbert]]

Two different sets of STR (different ways to trigger this):

STR A:
(1) Visit about:preferences
(2) Click "Privacy and Security" on the left side

ACTUAL RESULTS: The "Find in Preferences" field at the top right moves over a bit
EXPECTED RESULTS: Findbar shouldn't move.

STR B:
(1) Visit about:preferences
(2) Slowly type "coo" into the "Find in Preferences" box at top right

ACTUAL RESULTS: The "Find in Preferences" field moves to the right when you type "c", and then moves back after you've typed "oo".
EXPECTED RESULTS: Findbar shouldn't move.

ANALYSIS:
The findbar is right-aligned within the container there, and there's some extra-wide content on the Privacy and Security page which forces the container to be extra wide, which makes the right-aligned findbar move over. In particular, this is the wide unwrappable content which is making things wide:

[x] Show alerts about passwords for breached websites  Learn more

There are some buttons to the right of that area, and so this wide one-line label combined with those button widths ends up being wider than the intended width of the preferences area.

Comment 1

[Daniel Holbert [:dholbert]]

Attachment: screencast of STR

Comment 2

[Daniel Holbert [:dholbert]]

Attachment: screencast focusing on the label in question (showing how it forces preferences to be wider)

Comment 3

[Daniel Holbert [:dholbert]]

BTW, this is marked as a regression from bug 1575597 because that's where the wide label was added:
https://hg.mozilla.org/integration/autoland/rev/bf6c6df8d211#l5.13

That bug's patch was uplifted to Beta70, so the upcoming 70 release is currently affected (I see MattN ticked that status flag - thanks).

[Tracking Requested - why for this release]:
Visual regression in Firefox Preferences UI (our preferences search field moving around unexpectedly, as the user types in it), and is a new issue in Firefox70 (due to some new content that happens to be wider than the available space).

Comment 4

[Daniel Holbert [:dholbert]]

Also worth noting: I've only tested on Linux at this point. I don't know if other platforms are affected (they could conceivably be unaffected if they have a thinner font here, for example). If folks on other platforms could report back whether this is reproducible there, that'd be useful for prioritization I'm sure.

Comment 5

[:Gijs (he/him)]

(In reply to Daniel Holbert [:dholbert] from comment #4)

Also worth noting: I've only tested on Linux at this point. I don't know if other platforms are affected (they could conceivably be unaffected if they have a thinner font here, for example). If folks on other platforms could report back whether this is reproducible there, that'd be useful for prioritization I'm sure.

Mac doesn't seem to be affected. Ubuntu's default system font size is like 15px or something silly, whereas it's 11 on Mac and 11 or 12px on Windows - by default, users can always configure it themselves at least on Windows and Linux.

We then up it in in-content pages by sizing it to 1.36em, which exacerbates the problem.

Comment 6

[:Gijs (he/him)]

Stealing this as I have a simple upliftable patch.

Comment 7

[:Gijs (he/him)]

Attachment: Bug 1583985 - move breach alerts checkbox in markup to avoid its width enlarging the content box unnecessarily, r?MattN,jaws

Comment 8

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/1ba2f46eab88
move breach alerts checkbox in markup to avoid its width enlarging the content box unnecessarily, r=MattN

Comment 9

[Stefan Hindli [:stefan_hindli]]

https://hg.mozilla.org/mozilla-central/rev/1ba2f46eab88

Comment 10

[:Gijs (he/him)]

Comment on attachment 9095366 [details]
Bug 1583985 - move breach alerts checkbox in markup to avoid its width enlarging the content box unnecessarily, r?MattN,jaws

Beta/Release Uplift Approval Request

• User impact if declined: jumpy search box positioning in the prefs
• Is this code covered by automated tests?: No
• Has the fix been verified in Nightly?: No
• Needs manual test from QE?: No
• If yes, steps to reproduce:
• List of other uplifts needed: n/a
• Risk to taking this patch: Low
• Why is the change risky/not risky? (and alternatives if risky): This just moves some markup slightly, allowing it to extend underneath the buttons that would otherwise encroach the amount of horizontal space it has.
• String changes made/needed: no

Comment 11

[Liz Henry (:lizzard) (relman/hg->git project)]

Comment on attachment 9095366 [details]
Bug 1583985 - move breach alerts checkbox in markup to avoid its width enlarging the content box unnecessarily, r?MattN,jaws

Fix for layout; let's take this for beta 11.
Let's verify in beta.

Comment 12

[Dorel Luca [:dluca]]

https://hg.mozilla.org/releases/mozilla-beta/rev/a0d36046f60d

Comment 13

[Daniel Holbert [:dholbert]]

I Verified the fix in Nightly, FWIW. I get EXPECTED RESULTS from Nightly 71.0a1 (2019-09-28) (64-bit)

Comment 14

[Daniel Holbert [:dholbert]]

[mentioning Ubuntu in summary, since it may be the only platform that was affected per comment 4-5].

Comment 15

[Cristian Craciun]

Build ID 20190930132843
User Agent Mozilla/5.0 (X11; Linux x86_64; rv:70.0) Gecko/20100101 Firefox/70.0

Verified as fixed on the latest version of Nightly and on the latest version of Beta (70b11) on Ubuntu 18.04.