Bug 1355438 - [Form Autofill] Implement an internal-only pseudo-class for highlighting elements with an autofilled value. r=heycam
MozReview-Commit-ID: BUqAWSekPsh
--- a/dom/base/nsDOMWindowUtils.cpp
+++ b/dom/base/nsDOMWindowUtils.cpp
@@ -4225,17 +4225,17 @@ nsDOMWindowUtils::IsTimeoutTracking(uint
struct StateTableEntry
{
const char* mStateString;
EventStates mState;
};
static constexpr StateTableEntry kManuallyManagedStates[] = {
- // none yet; but for example: { "highlight", NS_EVENT_STATE_HIGHLIGHT },
+ { "-moz-autofill", NS_EVENT_STATE_AUTOFILL },
{ nullptr, EventStates() },
};
static_assert(!kManuallyManagedStates[ArrayLength(kManuallyManagedStates) - 1]
.mStateString,
"last kManuallyManagedStates entry must be a sentinel with "
"mStateString == nullptr");
--- a/dom/events/EventStates.h
+++ b/dom/events/EventStates.h
@@ -283,16 +283,18 @@ private:
// Handler for click to play plugin (vulnerable w/no update)
#define NS_EVENT_STATE_VULNERABLE_NO_UPDATE NS_DEFINE_EVENT_STATE_MACRO(42)
// Element has focus-within.
#define NS_EVENT_STATE_FOCUS_WITHIN NS_DEFINE_EVENT_STATE_MACRO(43)
// Element is ltr (for :dir pseudo-class)
#define NS_EVENT_STATE_LTR NS_DEFINE_EVENT_STATE_MACRO(44)
// Element is rtl (for :dir pseudo-class)
#define NS_EVENT_STATE_RTL NS_DEFINE_EVENT_STATE_MACRO(45)
+// Element is filled by Autofill feature.
+#define NS_EVENT_STATE_AUTOFILL NS_DEFINE_EVENT_STATE_MACRO(50)
// Event state that is used for values that need to be parsed but do nothing.
#define NS_EVENT_STATE_IGNORE NS_DEFINE_EVENT_STATE_MACRO(63)
/**
* NOTE: do not go over 63 without updating EventStates::InternalType!
*/
@@ -301,17 +303,17 @@ private:
// Event states that can be added and removed through
// Element::{Add,Remove}ManuallyManagedStates.
//
// Take care when manually managing state bits. You are responsible for
// setting or clearing the bit when an Element is added or removed from a
// document (e.g. in BindToTree and UnbindFromTree), if that is an
// appropriate thing to do for your state bit.
#define MANUALLY_MANAGED_STATES ( \
- mozilla::EventStates() /* none so far */ \
+ NS_EVENT_STATE_AUTOFILL \
)
// Event states that are managed externally to an element (by the
// EventStateManager, or by other code). As opposed to those in
// INTRINSIC_STATES, which are are computed by the element itself
// and returned from Element::IntrinsicState.
#define EXTERNALLY_MANAGED_STATES ( \
MANUALLY_MANAGED_STATES | \
--- a/layout/style/nsCSSPseudoClassList.h
+++ b/layout/style/nsCSSPseudoClassList.h
@@ -203,16 +203,20 @@ CSS_STATE_PSEUDO_CLASS(mozHandlerBlocked
CSS_STATE_PSEUDO_CLASS(mozHandlerCrashed, ":-moz-handler-crashed",
CSS_PSEUDO_CLASS_ENABLED_IN_UA_SHEETS_AND_CHROME, "",
NS_EVENT_STATE_HANDLER_CRASHED)
CSS_STATE_PSEUDO_CLASS(mozMathIncrementScriptLevel,
":-moz-math-increment-script-level", 0, "",
NS_EVENT_STATE_INCREMENT_SCRIPT_LEVEL)
+CSS_STATE_PSEUDO_CLASS(mozAutofill, ":-moz-autofill",
+ CSS_PSEUDO_CLASS_ENABLED_IN_UA_SHEETS_AND_CHROME, "",
+ NS_EVENT_STATE_AUTOFILL)
+
// CSS 3 UI
// http://www.w3.org/TR/2004/CR-css3-ui-20040511/#pseudo-classes
CSS_STATE_PSEUDO_CLASS(required, ":required", 0, "", NS_EVENT_STATE_REQUIRED)
CSS_STATE_PSEUDO_CLASS(optional, ":optional", 0, "", NS_EVENT_STATE_OPTIONAL)
CSS_STATE_PSEUDO_CLASS(valid, ":valid", 0, "", NS_EVENT_STATE_VALID)
CSS_STATE_PSEUDO_CLASS(invalid, ":invalid", 0, "", NS_EVENT_STATE_INVALID)
CSS_STATE_PSEUDO_CLASS(inRange, ":in-range", 0, "", NS_EVENT_STATE_INRANGE)
CSS_STATE_PSEUDO_CLASS(outOfRange, ":out-of-range", 0, "", NS_EVENT_STATE_OUTOFRANGE)
--- a/layout/style/res/forms.css
+++ b/layout/style/res/forms.css
@@ -1204,8 +1204,12 @@ input[type=number]::-moz-number-spin-dow
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
}
input[type="number"] > div > div > div:hover {
/* give some indication of hover state for the up/down buttons */
background-color: lightblue;
}
+
+:-moz-autofill {
+ filter: grayscale(21%) brightness(88%) contrast(161%) invert(10%) sepia(40%) saturate(206%);
+}