1895561 - Password fields (e.g. in Bitwarden, LastPass, DashLane add-ons) have an extra/unexpected solid black border around password input fields, despite suppressing border via CSS

Status: RESOLVED FIXED

(Core :: Layout: Form Controls, defect)

Description

[Daniel Holbert [:dholbert] (mostly-away until Aug 19)]

Attachment: screenshot of bug affecting Bitwarden (Firefox release on the left, Nightly on the right)

STR:

1. Install Bitwarden Password Manager from https://addons.mozilla.org/en-US/firefox/addon/bitwarden-password-manager/
2. When the login sidebar appears, type in any email address (e.g. [e-mail]) and click Continue
3. Look at the password field

ACTUAL RESULTS:
There's an unexpected/redundant-looking black border inside the input field.

EXPECTED RESULTS:
No such black border.

See attached screenshot. Left side shows expected-results in current Firefox release. Right side shows actual-results in current Nightly 127.0a1 (2024-05-07)

Comment 1

[Daniel Holbert [:dholbert] (mostly-away until Aug 19)]

Regression range: https://hg.mozilla.org/integration/autoland/pushloghtml?fromchange=e86e777fced482506de767727a313be25003c673&tochange=74da0b0c92b47e1b3fab56d6c3c8a134df9f2d6b

--> Regressed by bug 1750072

Comment 2

[Daniel Holbert [:dholbert] (mostly-away until Aug 19)]

Looking in Browser Toolbox, it looks like the textfield in question has:

appearance: auto;

...from a UA stylsheet, and that's part of what's making it draw the border -- if I set appearance:none or appearance:textfield, then the border goes away.

I see a similar issue on LastPass as well, installed from https://addons.mozilla.org/en-US/firefox/addon/lastpass-password-manager/ - there's now a black border around the password field on the initial login screen for that add-on, which looks broken because the "Master Password" filler-text gets lifted up to overlap that unexpected-border when the field gains focus.

Comment 3

[Daniel Holbert [:dholbert] (mostly-away until Aug 19)]

emilio: given that we're in the last week of a nightly cycle, should we backout bug 1750072 for now, or is there an easy fix we can land here?

Comment 4

[Daniel Holbert [:dholbert] (mostly-away until Aug 19)]

Attachment: screenshot of bug affecting LastPass (Firefox release on left, Nightly on right)

Comment 5

[Daniel Holbert [:dholbert] (mostly-away until Aug 19)]

Attachment: screenshot of LastPass label/border overlap in NIghtly

Comment 6

[Daniel Holbert [:dholbert] (mostly-away until Aug 19)]

Attachment: screenshot of bug affecting Dashlane (Firefox release on left, Nightly on right)

This affects Dashlane as well (another popular password manager); see screenshot of their add-on's first-run account-setup flow (entering [e-mail] when prompted for an email address).

Comment 7

[Daniel Holbert [:dholbert] (mostly-away until Aug 19)]

This affects the dashlane website at https://app.dashlane.com/#/signup , too; it's not extension-specific.

Comment 8

[Daniel Holbert [:dholbert] (mostly-away until Aug 19)]

Attachment: testcase 1

Comment 9

[Daniel Holbert [:dholbert] (mostly-away until Aug 19)]

Firefox Nightly draws a border around all of the password fields in testcase 1, as of this regression. Chrome, WebKit, and Firefox release do not.

Comment 10

[Emilio Cobos Álvarez (:emilio)]

fix is trivial.

Comment 11

[Emilio Cobos Álvarez (:emilio)]

Attachment: Bug 1895561 - Password appearance should be suppressed by author borders / backgrounds, just like textfield is. r=#layout,dholbert

Comment 12

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/f6b1b8ed2ae4
Password appearance should be suppressed by author borders / backgrounds, just like textfield is. r=dholbert

Comment 13

[Web Platform Test Sync Bot [:wpt-sync] (Matrix: #interop:mozilla.org)]

Created web-platform-tests PR https://github.com/web-platform-tests/wpt/pull/46155 for changes under testing/web-platform/tests

Comment 14

[tszentpeteri]

https://hg.mozilla.org/mozilla-central/rev/f6b1b8ed2ae4

Comment 15

[Web Platform Test Sync Bot [:wpt-sync] (Matrix: #interop:mozilla.org)]

Upstream PR merged by moz-wptsync-bot