Backed out 2 changesets (bug 1690225) for causing multiple bc failures.

CLOSED TREE

Backed out changeset 381ee01f5034 (bug 1690225)
Backed out changeset cde1d10aae1c (bug 1690225)

dom/base/nsFocusManager.cpp

@@ -1160,10 +1160,6 @@ nsFocusManager::BlurredElementInfo::~BlurredElementInfo() = default;
 static bool ShouldMatchFocusVisible(
     const Element& aElement, int32_t aFocusFlags,
     const Maybe<nsFocusManager::BlurredElementInfo>& aBlurredElementInfo) {
-  // If we were explicitly requested to show the ring, do it.
-  if (aFocusFlags & nsIFocusManager::FLAG_SHOWRING) {
-    return true;
-  }
   // Any element which supports keyboard input (such as an input element, or any
   // other element which may trigger a virtual keyboard to be shown on focus if
   // a physical keyboard is not present) should always match :focus-visible when
@@ -1217,6 +1213,31 @@ static bool ShouldMatchFocusVisible(
   return false;
 }
 
+static bool ShouldFocusRingBeVisible(
+    Element& aElement, int32_t aFlags,
+    const Maybe<nsFocusManager::BlurredElementInfo>& aBlurredElementInfo) {
+  if (aFlags & nsIFocusManager::FLAG_SHOWRING) {
+    return true;
+  }
+
+  const bool focusVisibleEnabled =
+      StaticPrefs::layout_css_focus_visible_enabled();
+
+#if defined(XP_MACOSX) || defined(ANDROID)
+  if (!focusVisibleEnabled) {
+    // Preserve historical behavior if the focus visible pseudo-class is not
+    // enabled.
+    if (aFlags & nsIFocusManager::FLAG_BYMOUSE) {
+      return !nsContentUtils::ContentIsLink(&aElement) &&
+             !aElement.IsAnyOfHTMLElements(nsGkAtoms::video, nsGkAtoms::audio);
+    }
+    return true;
+  }
+#endif
+  return focusVisibleEnabled &&
+         ShouldMatchFocusVisible(aElement, aFlags, aBlurredElementInfo);
+}
+
 /* static */
 void nsFocusManager::NotifyFocusStateChange(
     Element* aElement, Element* aElementToFocus,
@@ -1232,7 +1253,7 @@ void nsFocusManager::NotifyFocusStateChange(
   if (aGettingFocus) {
     EventStates eventStateToAdd = NS_EVENT_STATE_FOCUS;
     if (aWindowShouldShowFocusRing ||
-        ShouldMatchFocusVisible(*aElement, aFlags, aBlurredElementInfo)) {
+        ShouldFocusRingBeVisible(*aElement, aFlags, aBlurredElementInfo)) {
       eventStateToAdd |= NS_EVENT_STATE_FOCUSRING;
     }
     aElement->AddStates(eventStateToAdd);

dom/tests/mochitest/general/test_focusrings.xhtml

@@ -18,6 +18,8 @@
 
 SimpleTest.waitForExplicitFinish();
 
+const kFocusVisibleEnabled = SpecialPowers.getBoolPref("layout.css.focus-visible.enabled");
+
 function snapShot(element) {
   var rect = element.getBoundingClientRect();
   adjustedRect = { left: rect.left - 6, top: rect.top - 6,
@@ -68,12 +70,12 @@ function runTest()
   is(getComputedStyle($("l1"), "").outlineWidth, "0px", "appearance on previous list after focus() with :focus");
 
   synthesizeMouse($("l1"), 4, 4, { });
-  checkFocus($("l1"), false, "appearance on list after mouse focus with :moz-focusring");
+  checkFocus($("l1"), expectedVisible && !kFocusVisibleEnabled, "appearance on list after mouse focus with :moz-focusring");
   synthesizeMouse($("l2"), 4, 4, { });
   checkFocus($("l2"), true, "appearance on list after mouse focus with :focus");
 
   synthesizeMouse($("b1"), 4, 4, { });
-  checkFocus($("b1"), false, "appearance on button after mouse focus with :moz-focusring");
+  checkFocus($("b1"), !isMac && expectedVisible && !kFocusVisibleEnabled, "appearance on button after mouse focus with :moz-focusring");
   if (navigator.platform.includes("Mac")) {
     ok(compareSnapshots(snapShot($("b1")), snapShot($("b2")), false)[0], "focus after mouse shows no ring");
   }
@@ -141,7 +143,7 @@ function testHTMLElements(list, isMac, expectedNoRingsOnWin)
 
     var expectedMatchWithMouse = shouldFocus && !expectedNoRingsOnWin;
     var mouseRingSize = ringSize;
-    if (shouldFocus) {
+    if (shouldFocus && kFocusVisibleEnabled) {
       var textControl = (function() {
         if (elem.localName == "textarea")
           return true;

layout/mathml/mathml.css

@@ -56,12 +56,17 @@ ms[rquote]:after {
  }
 
 /**************************************************************************/
-/* Links                                                                  */
+/* Links and focusable elements                                           */
 /**************************************************************************/
 :any-link {
   text-decoration: none !important;
 }
 
+*:-moz-focusring {
+  /* Don't specify the outline-color, we should always use initial value. */
+  outline: 1px dotted;
+}
+
 /**************************************************************************/
 /* attributes common to all tags                                          */
 /**************************************************************************/

layout/style/res/forms.css

@@ -492,10 +492,10 @@ input:is([type=radio], [type=checkbox]):is(:disabled, :disabled:active, :disable
   cursor: unset;
 }
 
-input:not([type=file], [type=image]):focus-visible,
-select:focus-visible,
-button:focus-visible,
-textarea:focus-visible {
+input:not([type=file], [type=image]):-moz-focusring,
+select:-moz-focusring,
+button:-moz-focusring,
+textarea:-moz-focusring {
   /* These elements can handle outline themselves when themed, so we use
    * outline-style: auto and skip rendering the outline only when themed and
    * the theme allows so */
@@ -637,7 +637,7 @@ input:is([type=reset], [type=button], [type=submit]):active:hover {
   border: 1px dotted transparent;
 }
 
-:focus-visible::-moz-focus-inner {
+:-moz-focusring::-moz-focus-inner {
   border-color: currentColor;
 }
 
@@ -728,7 +728,7 @@ optgroup:before {
   box-shadow: 0 0 1.5px 1px red;
 }
 
-:-moz-ui-invalid:focus-visible {
+:-moz-ui-invalid:-moz-focusring {
   box-shadow: 0 0 2px 2px rgba(255,0,0,0.4);
 }
 

layout/style/res/html.css

@@ -701,9 +701,15 @@ canvas {
   user-select: none;
 }
 
-iframe:focus-visible,
-body:focus-visible,
-html:focus-visible {
+/* focusable content: anything w/ tabindex >=0 is focusable */
+:-moz-focusring {
+  /* Don't specify the outline-color, we should always use initial value. */
+   outline: 1px dotted;
+}
+
+iframe:-moz-focusring,
+body:-moz-focusring,
+html:-moz-focusring {
   /* These elements historically don't show outlines when focused by default.
    * We could consider changing that if needed. */
   outline-style: none;

layout/style/res/ua.css

@@ -134,7 +134,7 @@
 }
 
 /* https://drafts.csswg.org/css-lists-3/#ua-stylesheet */
-::marker {
+*|*::marker {
   text-align: end;
   text-transform: none;
   unicode-bidi: isolate;
@@ -146,19 +146,19 @@
  * the same changes to svg.css.
  */
 
-/* Links and focusable content */
+/* Links */
 
-:any-link {
+*|*:any-link {
   cursor: pointer;
 }
 
-:focus-visible {
+*|*:any-link:-moz-focusring {
   /* Don't specify the outline-color, we should always use initial value. */
   outline: 1px dotted;
 }
 
 /* Inert subtrees */
-:-moz-inert {
+*|*:-moz-inert {
   -moz-inert: inert;
 }
 

layout/svg/svg.css

@@ -97,6 +97,11 @@ foreignObject {
   opacity: inherit;
 }
 
+*:-moz-focusring {
+  /* Don't specify the outline-color, we should always use initial value. */
+  outline: 1px dotted;
+}
+
 /* Make SVG shapes unselectable to avoid triggering AccessibleCaret on tap.
    <mesh> will be supported in bug 1238882. */
 circle, ellipse, line, mesh, path, polygon, polyline, rect {

modules/libpref/init/StaticPrefList.yaml

@@ -969,7 +969,9 @@
 #
 # This behavior matches both historical and GTK / Windows focus behavior.
 #
-# :focus-visible is intended to provide better heuristics than this.
+# :focus-visible is intended to provide better heuristics than this, so for now
+# we make this false whenever layout.css.focus-visible.enabled is enabled by
+# default.
 - name: browser.display.always_show_rings_after_key_focus
   type: bool
   value: false
@@ -6080,6 +6082,17 @@
   mirror: always
   rust: true
 
+# Whether the `:focus-visible` pseudo-class is enabled.
+#
+# NOTE: You probably want to change the default value of
+# browser.display.always_show_rings_after_key_focus whenever you change the
+# default value of this pref.
+- name: layout.css.focus-visible.enabled
+  type: RelaxedAtomicBool
+  value: true
+  mirror: always
+  rust: true
+
 # Whether the `:autofill` pseudo-class is exposed to content.
 - name: layout.css.autofill.enabled
   type: RelaxedAtomicBool

servo/components/style/gecko/non_ts_pseudo_class_list.rs

@@ -55,6 +55,8 @@ macro_rules! apply_non_ts_list {
                 ("fullscreen", Fullscreen, IN_FULLSCREEN_STATE, _),
                 ("-moz-modal-dialog", MozModalDialog, IN_MODAL_DIALOG_STATE, PSEUDO_CLASS_ENABLED_IN_UA_SHEETS),
                 ("-moz-topmost-modal-dialog", MozTopmostModalDialog, IN_TOPMOST_MODAL_DIALOG_STATE, PSEUDO_CLASS_ENABLED_IN_UA_SHEETS),
+                // TODO(emilio): This is inconsistently named (the capital R).
+                ("-moz-focusring", MozFocusRing, IN_FOCUSRING_STATE, _),
                 ("-moz-broken", MozBroken, IN_BROKEN_STATE, _),
                 ("-moz-loading", MozLoading, IN_LOADING_STATE, _),
                 ("-moz-has-dir-attr", MozHasDirAttr, IN_HAS_DIR_ATTR_STATE, PSEUDO_CLASS_ENABLED_IN_UA_SHEETS),

servo/components/style/gecko/selector_parser.rs

@@ -102,7 +102,6 @@ impl NonTSPseudoClass {
                     "-moz-full-screen" => Some(NonTSPseudoClass::Fullscreen),
                     "-moz-read-only" => Some(NonTSPseudoClass::ReadOnly),
                     "-moz-read-write" => Some(NonTSPseudoClass::ReadWrite),
-                    "-moz-focusring" => Some(NonTSPseudoClass::FocusVisible),
                     "-webkit-autofill" => Some(NonTSPseudoClass::Autofill),
                     _ => None,
                 }
@@ -137,6 +136,9 @@ impl NonTSPseudoClass {
     /// Returns whether the pseudo-class is enabled in content sheets.
     #[inline]
     fn is_enabled_in_content(&self) -> bool {
+        if let NonTSPseudoClass::FocusVisible = *self {
+            return static_prefs::pref!("layout.css.focus-visible.enabled");
+        }
         if let NonTSPseudoClass::Autofill = *self {
             return static_prefs::pref!("layout.css.autofill.enabled");
         }

servo/components/style/gecko/wrapper.rs

@@ -2042,6 +2042,7 @@ impl<'le> ::selectors::Element for GeckoElement<'le> {
             NonTSPseudoClass::MozDragOver |
             NonTSPseudoClass::MozDevtoolsHighlighted |
             NonTSPseudoClass::MozStyleeditorTransitioning |
+            NonTSPseudoClass::MozFocusRing |
             NonTSPseudoClass::MozMathIncrementScriptLevel |
             NonTSPseudoClass::InRange |
             NonTSPseudoClass::OutOfRange |

testing/web-platform/meta/css/selectors/__dir__.ini

@@ -1,2 +1,3 @@
+prefs: [layout.css.focus-visible.enabled:true]
 lsan-disabled: true
 leak-threshold: [default:3276800, tab:460800]

testing/web-platform/meta/html/canvas/element/manual/drawing-paths-to-the-canvas/drawFocusIfNeeded_001.html.ini

@@ -0,0 +1,2 @@
+[drawFocusIfNeeded_001.html]
+  prefs: [layout.css.focus-visible.enabled:true]

testing/web-platform/meta/html/canvas/element/manual/drawing-paths-to-the-canvas/drawFocusIfNeeded_004.html.ini

@@ -0,0 +1,2 @@
+[drawFocusIfNeeded_004.html]
+  prefs: [layout.css.focus-visible.enabled:true]

testing/web-platform/meta/html/canvas/element/manual/drawing-paths-to-the-canvas/drawFocusIfNeeded_005.html.ini

@@ -0,0 +1,2 @@
+[drawFocusIfNeeded_005.html]
+  prefs: [layout.css.focus-visible.enabled:true]