From 69eeb9cb6c749e8df63bd5d53cecf0ebf82481f7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Emilio=20Cobos=20=C3=81lvarez?= Date: Sun, 31 Oct 2021 21:28:58 +0000 Subject: [PATCH 01/43] Bug 1738608 - Make autofill background configurable via system color prefs. r=mstange And remove the autofill.background pref for 95 (or 96, depending on when this lands) assuming nothing terrible causes us to turn it off on 94. Differential Revision: https://phabricator.services.mozilla.com/D129988 --- layout/style/res/forms.css | 24 +++---------------- .../test_non_content_accessible_values.html | 1 + modules/libpref/init/StaticPrefList.yaml | 6 ----- modules/libpref/init/all.js | 13 ++++++++++ .../style/values/specified/color.rs | 4 ++++ widget/nsNativeBasicTheme.cpp | 11 ++++----- widget/nsXPLookAndFeel.cpp | 1 + 7 files changed, 26 insertions(+), 34 deletions(-) diff --git a/layout/style/res/forms.css b/layout/style/res/forms.css index 008bc5ad9eb1..7fdcfa915f78 100644 --- a/layout/style/res/forms.css +++ b/layout/style/res/forms.css @@ -983,27 +983,9 @@ input:is([type=date], [type=time], [type=datetime-local]):is(:disabled, :read-on } input:autofill { - filter: grayscale(21%) brightness(88%) contrast(161%) invert(10%) sepia(40%) saturate(206%); -} - -@supports -moz-bool-pref("layout.css.autofill.background") { - /* We find a few pages where using `filter` causes issues because it - * changes the z-order (see bug 1687682, bug 1727950). - * - * The idea behind using background-image instead of plain background-color, - * is that it's less likely to be overridden by the page. - * - * The color is chosen so that you get the same final color on a white - * background as the filter above (#fffcc8), but with some alpha so as to - * prevent fully illegible text. - * - * NOTE(emilio): Keep the color in sync with kAutofillColor in - * nsNativeBasicTheme! - */ - input:autofill { - filter: none; - background-image: linear-gradient(rgba(255, 249, 145, 0.5), rgba(255, 249, 145, 0.5)); - } + /* The idea behind using background-image instead of plain background-color + * is that it's less likely to be overridden by the page. */ + background-image: linear-gradient(-moz-autofill-background, -moz-autofill-background); } input:-moz-autofill-preview { diff --git a/layout/style/test/test_non_content_accessible_values.html b/layout/style/test/test_non_content_accessible_values.html index 7f4ca653f069..0f794307ddba 100644 --- a/layout/style/test/test_non_content_accessible_values.html +++ b/layout/style/test/test_non_content_accessible_values.html @@ -17,6 +17,7 @@ const NON_CONTENT_ACCESSIBLE_VALUES = { "text-select-background", "text-select-background-disabled", "text-select-background-attention", + "-moz-autofill-background", ], "display": [ "-moz-deck", diff --git a/modules/libpref/init/StaticPrefList.yaml b/modules/libpref/init/StaticPrefList.yaml index 573d61b9c052..c7c6c03204b1 100644 --- a/modules/libpref/init/StaticPrefList.yaml +++ b/modules/libpref/init/StaticPrefList.yaml @@ -6824,12 +6824,6 @@ mirror: always rust: true -# Whether to use background-image to style autofill controls. -- name: layout.css.autofill.background - type: bool - value: true - mirror: always - # Whether the `:-moz-submit-invalid` pseudo-class is exposed to content. - name: layout.css.moz-submit-invalid.enabled type: RelaxedAtomicBool diff --git a/modules/libpref/init/all.js b/modules/libpref/init/all.js index 2cec3397d333..f3ab0d3ca2bd 100644 --- a/modules/libpref/init/all.js +++ b/modules/libpref/init/all.js @@ -713,6 +713,19 @@ pref("ui.textHighlightBackground", "#ef0fff"); // The foreground color for the matched text in findbar highlighting // Used with nsISelectionController::SELECTION_FIND pref("ui.textHighlightForeground", "#ffffff"); +// The background color for :autofill-ed inputs. +// +// In the past, we used the following `filter` to paint autofill backgrounds: +// +// grayscale(21%) brightness(88%) contrast(161%) invert(10%) sepia(40%) saturate(206%); +// +// but there are some pages where using `filter` caused issues because it +// changes the z-order (see bug 1687682, bug 1727950). +// +// The color is chosen so that you get the same final color on a white +// background as the filter above (#fffcc8), but with some alpha so as to +// prevent fully illegible text. +pref("ui.-moz-autofill-background", "rgba(255, 249, 145, .5)"); // We want the ability to forcibly disable platform a11y, because // some non-a11y-related components attempt to bring it up. See bug diff --git a/servo/components/style/values/specified/color.rs b/servo/components/style/values/specified/color.rs index 790834047fd7..2636e2f628c8 100644 --- a/servo/components/style/values/specified/color.rs +++ b/servo/components/style/values/specified/color.rs @@ -411,6 +411,10 @@ pub enum SystemColor { #[parse(condition = "ParserContext::in_ua_or_chrome_sheet")] MozAccentColorForeground, + /// The background-color for :autofill-ed inputs. + #[parse(condition = "ParserContext::in_ua_or_chrome_sheet")] + MozAutofillBackground, + /// Media rebar text. MozWinMediatext, /// Communications rebar text. diff --git a/widget/nsNativeBasicTheme.cpp b/widget/nsNativeBasicTheme.cpp index 0d34e967f492..2df652d63474 100644 --- a/widget/nsNativeBasicTheme.cpp +++ b/widget/nsNativeBasicTheme.cpp @@ -488,10 +488,6 @@ std::pair nsNativeBasicTheme::ComputeButtonColors( return std::make_pair(backgroundColor, borderColor); } -// NOTE: This should be kept in sync with forms.css, see the comment in the -// input:autofill rule. -constexpr nscolor kAutofillColor = NS_RGBA(255, 249, 145, 128); - std::pair nsNativeBasicTheme::ComputeTextfieldColors( const EventStates& aState, const Colors& aColors, OutlineCoversBorder aOutlineCoversBorder) { @@ -502,9 +498,10 @@ std::pair nsNativeBasicTheme::ComputeTextfieldColors( return aColors.SystemNs(StyleSystemColor::Field); }(); - if (aState.HasState(NS_EVENT_STATE_AUTOFILL) && - StaticPrefs::layout_css_autofill_background()) { - backgroundColor = NS_ComposeColors(backgroundColor, kAutofillColor); + if (aState.HasState(NS_EVENT_STATE_AUTOFILL)) { + backgroundColor = NS_ComposeColors( + backgroundColor, + aColors.SystemNs(StyleSystemColor::MozAutofillBackground)); } const sRGBColor borderColor = diff --git a/widget/nsXPLookAndFeel.cpp b/widget/nsXPLookAndFeel.cpp index 79f8b46c43d8..d03893fb3b87 100644 --- a/widget/nsXPLookAndFeel.cpp +++ b/widget/nsXPLookAndFeel.cpp @@ -305,6 +305,7 @@ static const char sColorPrefs[][41] = { "ui.-moz-mac-tooltip", "ui.-moz-accent-color", "ui.-moz-accent-color-foreground", + "ui.-moz-autofill-background", "ui.-moz-win-mediatext", "ui.-moz-win-communicationstext", "ui.-moz-nativehyperlinktext", From e09c109ab268cc56dffff63e3c594778879d2781 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Emilio=20Cobos=20=C3=81lvarez?= Date: Sun, 31 Oct 2021 21:29:21 +0000 Subject: [PATCH 02/43] Bug 1738608 - Allow customizing dark system colors by pref as well. r=mstange Just noticed we don't quite have that capability, but it seems useful. Differential Revision: https://phabricator.services.mozilla.com/D129989 --- widget/nsXPLookAndFeel.cpp | 23 ++++++++++++++++++----- 1 file changed, 18 insertions(+), 5 deletions(-) diff --git a/widget/nsXPLookAndFeel.cpp b/widget/nsXPLookAndFeel.cpp index d03893fb3b87..4d6f3e4a2f33 100644 --- a/widget/nsXPLookAndFeel.cpp +++ b/widget/nsXPLookAndFeel.cpp @@ -419,7 +419,8 @@ void nsXPLookAndFeel::OnPrefChanged(const char* aPref, void* aClosure) { } for (const char* pref : sColorPrefs) { - if (prefName.Equals(pref)) { + // We use StringBeginsWith to handle .dark prefs too. + if (StringBeginsWith(prefName, nsDependentCString(pref))) { ColorPrefChanged(); return; } @@ -782,10 +783,9 @@ static nsresult SystemColorUseDebuggingColor(LookAndFeel::ColorID aID, } #endif -static nsresult GetColorFromPref(LookAndFeel::ColorID aID, nscolor& aResult) { - const char* prefName = sColorPrefs[size_t(aID)]; +static nsresult GetPrefColor(const char* aPref, nscolor& aResult) { nsAutoCString colorStr; - MOZ_TRY(Preferences::GetCString(prefName, colorStr)); + MOZ_TRY(Preferences::GetCString(aPref, colorStr)); if (!ServoCSSParser::ComputeColor(nullptr, NS_RGB(0, 0, 0), colorStr, &aResult)) { return NS_ERROR_FAILURE; @@ -793,6 +793,19 @@ static nsresult GetColorFromPref(LookAndFeel::ColorID aID, nscolor& aResult) { return NS_OK; } +static nsresult GetColorFromPref(LookAndFeel::ColorID aID, ColorScheme aScheme, + nscolor& aResult) { + const char* prefName = sColorPrefs[size_t(aID)]; + if (aScheme == ColorScheme::Dark) { + nsAutoCString darkPrefName(prefName); + darkPrefName.Append(".dark"); + if (NS_SUCCEEDED(GetPrefColor(darkPrefName.get(), aResult))) { + return NS_OK; + } + } + return GetPrefColor(prefName, aResult); +} + // All these routines will return NS_OK if they have a value, // in which case the nsLookAndFeel should use that value; // otherwise we'll return NS_ERROR_NOT_AVAILABLE, in which case, the @@ -825,7 +838,7 @@ nsresult nsXPLookAndFeel::GetColorValue(ColorID aID, ColorScheme aScheme, return NS_OK; } - if (NS_SUCCEEDED(GetColorFromPref(aID, aResult))) { + if (NS_SUCCEEDED(GetColorFromPref(aID, aScheme, aResult))) { cache.Insert(aID, Some(aResult)); return NS_OK; } From 12faaf7d80301662859a72bb4b07f3cd0202de0c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Emilio=20Cobos=20=C3=81lvarez?= Date: Sun, 31 Oct 2021 23:09:35 +0000 Subject: [PATCH 03/43] Bug 1738587 - Use the right background-color pref in a test. r=hiro After bug 1525107, we have a different pref for dark color-scheme colors, and chrome documents use those, following the preferred color-scheme (which in DevEdition is dark). Differential Revision: https://phabricator.services.mozilla.com/D129997 --- .../base/tests/chrome/default_background_window.xhtml | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) diff --git a/layout/base/tests/chrome/default_background_window.xhtml b/layout/base/tests/chrome/default_background_window.xhtml index cb0ad523a9e0..4bc49c0f3694 100644 --- a/layout/base/tests/chrome/default_background_window.xhtml +++ b/layout/base/tests/chrome/default_background_window.xhtml @@ -9,7 +9,7 @@