Improve autofocus and delegatesFocus interaction

Now, when focusing a shadow host with delegates focus set, we try to focus the first focusable area with the autofocus attribute set, instead of just the first focusable area. (If no focusable area has autofocus set, then we use the first one, like before.) Closes #833.
whatwg · Oct 13, 2021 · 383e1a9 · 383e1a9
1 parent 9fa2a91
commit 383e1a9
Showing 1 changed file with 52 additions and 21 deletions.
diff --git a/source b/source
@@ -2966,6 +2966,7 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
      <li>The <dfn data-x-href="https://dom.spec.whatwg.org/#concept-tree-child" data-x="concept-tree-child">child</dfn> concept</li>
      <li>The <dfn data-x-href="https://dom.spec.whatwg.org/#concept-tree-root">root</dfn> and <dfn data-x-href="https://dom.spec.whatwg.org/#concept-shadow-including-root">shadow-including root</dfn> concepts</li>
      <li>The <dfn data-x-href="https://dom.spec.whatwg.org/#concept-tree-inclusive-ancestor">inclusive ancestor</dfn>,
+             <dfn data-x-href="https://dom.spec.whatwg.org/#concept-tree-descendant">descendant</dfn>,
              <dfn data-x-href="https://dom.spec.whatwg.org/#concept-shadow-including-descendant">shadow-including descendant</dfn>,
              <dfn data-x-href="https://dom.spec.whatwg.org/#concept-shadow-including-inclusive-descendant">shadow-including inclusive descendant</dfn>, and
              <dfn data-x-href="https://dom.spec.whatwg.org/#concept-shadow-including-inclusive-ancestor">shadow-including inclusive ancestor</dfn> concepts</li>
@@ -74985,8 +74986,8 @@ END:VCARD</pre>
 
   <p>To <dfn>get the focusable area</dfn> for a <var>focus target</var> that is either an element
   that is not a <span>focusable area</span>, or is a <span>browsing context</span>, given an
-  optional string <var>focus trigger</var>, run the first matching set of steps from the following
-  list:</p>
+  optional string <var>focus trigger</var> (default "<code data-x="">other</code>"), run the first
+  matching set of steps from the following list:</p>
 
   <dl class="switch">
    <dt>If <var>focus target</var> is an <code>area</code> element with one or more shapes that are
@@ -75022,28 +75023,28 @@ END:VCARD</pre>
 
    <dd>
     <ol>
-     <li>If <var>focus target</var> is a <span>shadow-including inclusive ancestor</span> of the
+     <li><p>If <var>focus target</var> is a <span>shadow-including inclusive ancestor</span> of the
      <span>currently focused area of a top-level browsing context</span>'s <span>DOM anchor</span>,
-     then return null.</li>
+     then return null.</p></li>
 
-     <li>
-      <p>Otherwise:</p>
+     <li><p>Let <var>autofocus delegate</var> be the <span>autofocus delegate</span> for <var>focus
+     target</var> given <var>focus trigger</var>.</p></li>
 
-      <ol>
-       <li>If <var>focus trigger</var> is "<code data-x="">click</code>", then let <var>possible
-       focus delegates</var> be the list of all <span>click focusable</span> <span
-       data-x="focusable area">focusable areas</span> whose <span>DOM anchor</span> is a descendant
-       of <var>focus target</var> in the <span>flat tree</span>.</li>
-
-       <li>Otherwise, let <var>possible focus delegates</var> be the list of all <span
-       data-x="focusable area">focusable areas</span> whose <span>DOM anchor</span> is a descendant
-       of <var>focus target</var> in the <span>flat tree</span>.</li>
-
-       <li>Return the first <span>focusable area</span> in <span>tree order</span> of their <span
-       data-x="DOM anchor">DOM anchors</span> in <var>possible focus delegates</var>, or null if
-       <var>possible focus delegates</var> is empty.</li>
-      </ol>
-     </li>
+     <li><p>If <var>autofocus delegate</var> is not null, then return <var>autofocus
+     delegate</var>.</p></li>
+
+     <li><p>If <var>focus trigger</var> is "<code data-x="">click</code>", then let <var>possible
+     focus delegates</var> be the list of all <span>click focusable</span> <span
+     data-x="focusable area">focusable areas</span> whose <span>DOM anchor</span> is a descendant
+     of <var>focus target</var> in the <span>flat tree</span>.</p></li>
+
+     <li><p>Otherwise, let <var>possible focus delegates</var> be the list of all <span
+     data-x="focusable area">focusable areas</span> whose <span>DOM anchor</span> is a descendant
+     of <var>focus target</var> in the <span>flat tree</span>.</p></li>
+
+     <li><p>Return the first <span>focusable area</span> in <span>tree order</span> of who their
+     <span data-x="DOM anchor">DOM anchors</span> are in <var>possible focus delegates</var>, or
+     null if <var>possible focus delegates</var> is empty.</p></li>
     </ol>
 
     <p class="note">For <span data-x="sequentially focusable">sequential focusability</span>, the
@@ -75058,6 +75059,36 @@ END:VCARD</pre>
    <dd><p>Return null.</p></dd>
   </dl>
 
+  <p>The <dfn>autofocus delegate</dfn> for a <var>focus target</var> given a <var>focus
+  trigger</var> is given by the following steps:</p>
+
+  <ol>
+   <li>
+    <p>For each <span>descendant</span> <var>descendant</var> of <var>focus target</var>, in
+    <span>tree order</span>:</p>
+
+    <ol>
+     <li><p>If <var>descendant</var> does not have an <code
+     data-x="attr-fe-autofocus">autofocus</code> content attribute, then
+     <span>continue</span>.</p></li>
+
+     <li><p>Let <var>focusable area</var> be <var>descendant</var>, if <var>descendant</var> is a
+     <span>focusable area</span>; otherwise let <var>focusable area</var> be the result of <span
+     data-x="get the focusable area">getting the focusable area</span> for <var>descendant</var>
+     given <var>focus trigger</var>.</p></li>
+
+     <li><p>If <var>focusable area</var> is null, then <span>continue</span>.</p></li>
+
+     <li><p>If <var>focusable area</var> is not <span>click focusable</span> and <var>focus
+     trigger</var> is "<code data-x="">click</code>", then <span>continue</span>.</p></li>
+
+     <li><p>Return <var>focusable area</var>.</p></li>
+    </ol>
+   </li>
+
+   <li><p>Return null.</p></li>
+  </ol>
+
   <p>The <dfn export>focusing steps</dfn> for an object <var>new focus target</var> that is either a
   <span>focusable area</span>, or an element that is not a <span>focusable area</span>, or a
   <span>browsing context</span>, are as follows. They can optionally be run with a <var>fallback