[giow] (1) autofocus in <dialog>, blur() and <body>, typoes, cleanup

Affected topics: DOM APIs, HTML git-svn-id: http://svn.whatwg.org/webapps@7353 340c8d12-0b0e-0410-8428-c7bf67bfef74
whatwg · Sep 15, 2012 · 9654090 · 9654090
1 parent 8d0d292
commit 9654090
Show file tree

Hide file tree

Showing 3 changed files with 129 additions and 91 deletions.
diff --git a/complete.html b/complete.html
@@ -55211,7 +55211,7 @@ <h5 id=association-of-controls-and-forms><span class=secno>4.10.18.3 </span>Asso
   <p>When an element is <a href=#remove-an-element-from-a-document title="remove an element from a
   document">removed from a <code>Document</code></a> resulting in a
   <a href=#form-associated-element>form-associated element</a> and its <a href=#form-owner>form owner</a>
-  (if any) no longer being in the same <span>host subtree</span>, then
+  (if any) no longer being in the same <a href=#home-subtree>home subtree</a>, then
   the user agent must <a href=#reset-the-form-owner>reset the form owner</a> of that
   <a href=#form-associated-element>form-associated element</a>.</p>
 
@@ -55619,20 +55619,24 @@ <h5 id=autofocusing-a-form-control:-the-autofocus-attribute><span class=secno>4.
 
   <!-- v2: Apply this to contentEditable elements -->
 
-  <!-- v2: Make this work with modal <dialog>s:
-            - exclude <dialog> subtrees from the exclusion of multiple autofocus attributes (careful, consider nested dialogs)
-            - when a showModal() method is invoked, look for elements to autofocus in that dialog
-    -->
-
   <p>The <dfn id=attr-fe-autofocus title=attr-fe-autofocus><code>autofocus</code></dfn>
   content attribute allows the author to indicate that a control is to
-  be focused as soon as the page is loaded, allowing the user to just
-  start typing without having to manually focus the main control.</p>
+  be focused as soon as the page is loaded or as soon as the
+  <code><a href=#the-dialog-element>dialog</a></code> within which it finds itself is shown, allowing
+  the user to just start typing without having to manually focus the
+  main control.</p>
 
   <p>The <code title=attr-fe-autofocus><a href=#attr-fe-autofocus>autofocus</a></code> attribute is
   a <a href=#boolean-attribute>boolean attribute</a>.</p>
 
-  <p>There must not be more than one element in the document with the
+  <p>An element's <dfn id=nearest-ancestor-autofocus-scoping-root-element>nearest ancestor autofocus scoping root
+  element</dfn> is the element itself if the element is a
+  <code><a href=#the-dialog-element>dialog</a></code> element, or else is the element's nearest
+  ancestor <code><a href=#the-dialog-element>dialog</a></code> element, if any, or else is the
+  element's <a href=#root-element>root element</a>.</p>
+
+  <p>There must not be two elements with the same <a href=#nearest-ancestor-autofocus-scoping-root-element>nearest
+  ancestor autofocus scoping root element</a> that both have the
   <code title=attr-fe-autofocus><a href=#attr-fe-autofocus>autofocus</a></code> attribute
   specified.</p>
 
@@ -55687,7 +55691,11 @@ <h5 id=autofocusing-a-form-control:-the-autofocus-attribute><span class=secno>4.
    source</a> for this task is the <a href=#dom-manipulation-task-source>DOM manipulation task
    source</a>.</li>
 
-  </ol><p class=note>Focusing the control does not imply that the user
+  </ol><p class=note>This handles the automatic focusing during document
+  load. The <code title=dom-dialog-showModal><a href=#dom-dialog-showmodal>showModal()</a></code>
+  method of <code><a href=#the-dialog-element>dialog</a></code> elements also processes the <code title=attr-fe-autofocus><a href=#attr-fe-autofocus>autofocus</a></code> attribute.</p>
+
+  <p class=note>Focusing the control does not imply that the user
   agent must focus the browser window if it has lost focus.</p>
 
   <p>The <dfn id=dom-fe-autofocus title=dom-fe-autofocus><code>autofocus</code></dfn>
@@ -60118,6 +60126,8 @@ <h4 id=the-dialog-element><span class=secno>4.11.6 </span>The <dfn><code>dialog<
     <p>The argument, if provided, provides an anchor point to which
     the element will be fixed.</p>
 
+    <p>This method honors the <code title=attr-fe-autofocus><a href=#attr-fe-autofocus>autofocus</a></code> attribute.</p>
+
    </dd>
 
    <dt><var title="">dialog</var> . <code title=dom-dialog-close><a href=#dom-dialog-close>close</a></code>( [ <var title="">result</var> ] )</dt>
@@ -60200,6 +60210,15 @@ <h4 id=the-dialog-element><span class=secno>4.11.6 </span>The <dfn><code>dialog<
    <li><p>Push <var title="">dialog</var> onto <var title="">dialog</var>'s <code><a href=#document>Document</a></code>'s <a href=#pending-dialog-stack>pending
    dialog stack</a>.</li>
 
+   <li><p>Let <var title="">control</var> be the first element in tree
+   order whose nearest ancestor <code><a href=#the-dialog-element>dialog</a></code> element is <var title="">dialog</var> and that has an <code title=attr-fe-autofocus><a href=#attr-fe-autofocus>autofocus</a></code> attribute
+   specified, if any.</li>
+
+   <li><p>If there is no <var title="">control</var>, then abort these
+   steps.</li>
+
+   <li><p>Run the <a href=#focusing-steps>focusing steps</a> for <var title="">control</var>.</li>
+
   </ol><p>If at any time a <code><a href=#the-dialog-element>dialog</a></code> element is <a href=#remove-an-element-from-a-document title="remove an element from a document">removed from a
   <code>Document</code></a>, then if that <code><a href=#the-dialog-element>dialog</a></code> is in
   that <code><a href=#document>Document</a></code>'s <a href=#pending-dialog-stack>pending dialog stack</a>, the
@@ -78139,14 +78158,15 @@ <h4 id=focus-management><span class=secno>8.4.2 </span>Focus management</h4>
   from the <code><a href=#the-details-element>details</a></code> or <code><a href=#the-summary-element>summary</a></code> element being
   focusable.</p>
 
-  <hr><p>The <dfn id=focusing-steps>focusing steps</dfn> are as follows:</p>
+  <hr><p>The <dfn id=focusing-steps>focusing steps</dfn> for an element are as follows:</p>
 
   <ol><li><p>If the element is not <a href=#in-a-document title="in a Document">in a
    <code>Document</code></a>, or if the element's
    <code><a href=#document>Document</a></code> has no <a href=#browsing-context>browsing context</a>, or if
    the element's <code><a href=#document>Document</a></code>'s <a href=#browsing-context>browsing context</a>
    has no <a href=#top-level-browsing-context>top-level browsing context</a>, or if the element
-   is not <a href=#focusable>focusable</a>, then abort these steps.</p>
+   is not <a href=#focusable>focusable</a>, or if the element is already
+   focused, then abort these steps.</p>
 
    <li><p>If focusing the element will remove the focus from another
    element, then run the <a href=#unfocusing-steps>unfocusing steps</a> for that
@@ -78182,7 +78202,8 @@ <h4 id=focus-management><span class=secno>8.4.2 </span>Focus management</h4>
   steps</a> for an element whenever the user moves the focus to a
   <a href=#focusable>focusable</a> element.</p>
 
-  <p>The <dfn id=unfocusing-steps>unfocusing steps</dfn> are as follows:</p>
+  <p>The <dfn id=unfocusing-steps>unfocusing steps</dfn> for an element are as
+  follows:</p>
 
   <ol><li><p>If the element is an <code><a href=#the-input-element>input</a></code> element, and the
    <code title=event-input-change><a href=#event-input-change>change</a></code> event applies to the
@@ -78199,10 +78220,8 @@ <h4 id=focus-management><span class=secno>8.4.2 </span>Focus management</h4>
   </ol><p>When an element that is focused stops being a
   <a href=#focusable>focusable</a> element, or stops being focused without
   another element being explicitly focused in its stead, the user
-  agent should synchronously run the <a href=#focusing-steps>focusing steps</a> for
-  <a href=#the-body-element-0>the body element</a>, if there is one; if there is not,
-  then the user agent should synchronously run the <a href=#unfocusing-steps>unfocusing
-  steps</a> for the affected element only.</p>
+  agent should synchronously run the <a href=#unfocusing-steps>unfocusing steps</a> for
+  the affected element only.</p>
 
   <p class=example>For example, this might happen because the
   element is removed from its <code><a href=#document>Document</a></code>, or has a <code title=attr-hidden><a href=#the-hidden-attribute>hidden</a></code> attribute added. It would also
@@ -78314,7 +78333,6 @@ <h4 id=element-level-focus-apis><span class=secno>8.4.4 </span>Element-level foc
     <p>Unfocuses the element. Use of this method is discouraged. Focus
     another element instead.</p>
 
-<!--FORK-->
     <p>Do not use this method to hide the focus ring if you find the
     focus ring unsightly. Instead, use a CSS rule to override the
     'outline' property. (Be aware, however, that this makes the page
@@ -78345,22 +78363,18 @@ <h4 id=element-level-focus-apis><span class=secno>8.4.4 </span>Element-level foc
   <ol><li><p>If the element is marked as <i><a href=#locked-for-focus>locked for focus</a></i>, then abort
    these steps.</li>
 
-   <li><p>If the element is not <a href=#focusable>focusable</a>, then abort these
-   steps.</li>
-
    <li><p>Mark the element as <dfn id=locked-for-focus>locked for focus</dfn>.</li>
 
-   <li><p>If the element is not already focused, run the <a href=#focusing-steps>focusing
-   steps</a> for the element.</li>
+   <li><p>Run the <a href=#focusing-steps>focusing steps</a> for the
+   element.</li>
 
    <li><p>Unmark the element as <i><a href=#locked-for-focus>locked for focus</a></i>.</li>
 
   </ol><p>The <dfn id=dom-blur title=dom-blur><code>blur()</code></dfn> method, when
-  invoked, should run the <a href=#focusing-steps>focusing steps</a> for <a href=#the-body-element-0>the
-  body element</a>, if there is one; if there is not, then it
-  should run the <a href=#unfocusing-steps>unfocusing steps</a> for the element on
-  which the method was called instead. User agents may selectively or
-  uniformly ignore calls to this method for usability reasons.</p>
+  invoked, should run the <a href=#unfocusing-steps>unfocusing steps</a> for the
+  element on which the method was called instead. User agents may
+  selectively or uniformly ignore calls to this method for usability
+  reasons.</p>
 
   <p class=example>For example, if the <code title=dom-blur><a href=#dom-blur>blur()</a></code> method is unwisely being used to
   remove the focus ring for aesthetics reasons, the page would become

diff --git a/index b/index
@@ -55211,7 +55211,7 @@ out of 233&thinsp;257&thinsp;824 bytes available&lt;/meter&gt;&lt;/p&gt;</pre>
   <p>When an element is <a href=#remove-an-element-from-a-document title="remove an element from a
   document">removed from a <code>Document</code></a> resulting in a
   <a href=#form-associated-element>form-associated element</a> and its <a href=#form-owner>form owner</a>
-  (if any) no longer being in the same <span>host subtree</span>, then
+  (if any) no longer being in the same <a href=#home-subtree>home subtree</a>, then
   the user agent must <a href=#reset-the-form-owner>reset the form owner</a> of that
   <a href=#form-associated-element>form-associated element</a>.</p>
 
@@ -55619,20 +55619,24 @@ out of 233&thinsp;257&thinsp;824 bytes available&lt;/meter&gt;&lt;/p&gt;</pre>
 
   <!-- v2: Apply this to contentEditable elements -->
 
-  <!-- v2: Make this work with modal <dialog>s:
-            - exclude <dialog> subtrees from the exclusion of multiple autofocus attributes (careful, consider nested dialogs)
-            - when a showModal() method is invoked, look for elements to autofocus in that dialog
-    -->
-
   <p>The <dfn id=attr-fe-autofocus title=attr-fe-autofocus><code>autofocus</code></dfn>
   content attribute allows the author to indicate that a control is to
-  be focused as soon as the page is loaded, allowing the user to just
-  start typing without having to manually focus the main control.</p>
+  be focused as soon as the page is loaded or as soon as the
+  <code><a href=#the-dialog-element>dialog</a></code> within which it finds itself is shown, allowing
+  the user to just start typing without having to manually focus the
+  main control.</p>
 
   <p>The <code title=attr-fe-autofocus><a href=#attr-fe-autofocus>autofocus</a></code> attribute is
   a <a href=#boolean-attribute>boolean attribute</a>.</p>
 
-  <p>There must not be more than one element in the document with the
+  <p>An element's <dfn id=nearest-ancestor-autofocus-scoping-root-element>nearest ancestor autofocus scoping root
+  element</dfn> is the element itself if the element is a
+  <code><a href=#the-dialog-element>dialog</a></code> element, or else is the element's nearest
+  ancestor <code><a href=#the-dialog-element>dialog</a></code> element, if any, or else is the
+  element's <a href=#root-element>root element</a>.</p>
+
+  <p>There must not be two elements with the same <a href=#nearest-ancestor-autofocus-scoping-root-element>nearest
+  ancestor autofocus scoping root element</a> that both have the
   <code title=attr-fe-autofocus><a href=#attr-fe-autofocus>autofocus</a></code> attribute
   specified.</p>
 
@@ -55687,7 +55691,11 @@ out of 233&thinsp;257&thinsp;824 bytes available&lt;/meter&gt;&lt;/p&gt;</pre>
    source</a> for this task is the <a href=#dom-manipulation-task-source>DOM manipulation task
    source</a>.</li>
 
-  </ol><p class=note>Focusing the control does not imply that the user
+  </ol><p class=note>This handles the automatic focusing during document
+  load. The <code title=dom-dialog-showModal><a href=#dom-dialog-showmodal>showModal()</a></code>
+  method of <code><a href=#the-dialog-element>dialog</a></code> elements also processes the <code title=attr-fe-autofocus><a href=#attr-fe-autofocus>autofocus</a></code> attribute.</p>
+
+  <p class=note>Focusing the control does not imply that the user
   agent must focus the browser window if it has lost focus.</p>
 
   <p>The <dfn id=dom-fe-autofocus title=dom-fe-autofocus><code>autofocus</code></dfn>
@@ -60118,6 +60126,8 @@ fur
     <p>The argument, if provided, provides an anchor point to which
     the element will be fixed.</p>
 
+    <p>This method honors the <code title=attr-fe-autofocus><a href=#attr-fe-autofocus>autofocus</a></code> attribute.</p>
+
    </dd>
 
    <dt><var title="">dialog</var> . <code title=dom-dialog-close><a href=#dom-dialog-close>close</a></code>( [ <var title="">result</var> ] )</dt>
@@ -60200,6 +60210,15 @@ fur
    <li><p>Push <var title="">dialog</var> onto <var title="">dialog</var>'s <code><a href=#document>Document</a></code>'s <a href=#pending-dialog-stack>pending
    dialog stack</a>.</li>
 
+   <li><p>Let <var title="">control</var> be the first element in tree
+   order whose nearest ancestor <code><a href=#the-dialog-element>dialog</a></code> element is <var title="">dialog</var> and that has an <code title=attr-fe-autofocus><a href=#attr-fe-autofocus>autofocus</a></code> attribute
+   specified, if any.</li>
+
+   <li><p>If there is no <var title="">control</var>, then abort these
+   steps.</li>
+
+   <li><p>Run the <a href=#focusing-steps>focusing steps</a> for <var title="">control</var>.</li>
+
   </ol><p>If at any time a <code><a href=#the-dialog-element>dialog</a></code> element is <a href=#remove-an-element-from-a-document title="remove an element from a document">removed from a
   <code>Document</code></a>, then if that <code><a href=#the-dialog-element>dialog</a></code> is in
   that <code><a href=#document>Document</a></code>'s <a href=#pending-dialog-stack>pending dialog stack</a>, the
@@ -78139,14 +78158,15 @@ interface <dfn id=navigatorstorageutils>NavigatorStorageUtils</dfn> {
   from the <code><a href=#the-details-element>details</a></code> or <code><a href=#the-summary-element>summary</a></code> element being
   focusable.</p>
 
-  <hr><p>The <dfn id=focusing-steps>focusing steps</dfn> are as follows:</p>
+  <hr><p>The <dfn id=focusing-steps>focusing steps</dfn> for an element are as follows:</p>
 
   <ol><li><p>If the element is not <a href=#in-a-document title="in a Document">in a
    <code>Document</code></a>, or if the element's
    <code><a href=#document>Document</a></code> has no <a href=#browsing-context>browsing context</a>, or if
    the element's <code><a href=#document>Document</a></code>'s <a href=#browsing-context>browsing context</a>
    has no <a href=#top-level-browsing-context>top-level browsing context</a>, or if the element
-   is not <a href=#focusable>focusable</a>, then abort these steps.</p>
+   is not <a href=#focusable>focusable</a>, or if the element is already
+   focused, then abort these steps.</p>
 
    <li><p>If focusing the element will remove the focus from another
    element, then run the <a href=#unfocusing-steps>unfocusing steps</a> for that
@@ -78182,7 +78202,8 @@ interface <dfn id=navigatorstorageutils>NavigatorStorageUtils</dfn> {
   steps</a> for an element whenever the user moves the focus to a
   <a href=#focusable>focusable</a> element.</p>
 
-  <p>The <dfn id=unfocusing-steps>unfocusing steps</dfn> are as follows:</p>
+  <p>The <dfn id=unfocusing-steps>unfocusing steps</dfn> for an element are as
+  follows:</p>
 
   <ol><li><p>If the element is an <code><a href=#the-input-element>input</a></code> element, and the
    <code title=event-input-change><a href=#event-input-change>change</a></code> event applies to the
@@ -78199,10 +78220,8 @@ interface <dfn id=navigatorstorageutils>NavigatorStorageUtils</dfn> {
   </ol><p>When an element that is focused stops being a
   <a href=#focusable>focusable</a> element, or stops being focused without
   another element being explicitly focused in its stead, the user
-  agent should synchronously run the <a href=#focusing-steps>focusing steps</a> for
-  <a href=#the-body-element-0>the body element</a>, if there is one; if there is not,
-  then the user agent should synchronously run the <a href=#unfocusing-steps>unfocusing
-  steps</a> for the affected element only.</p>
+  agent should synchronously run the <a href=#unfocusing-steps>unfocusing steps</a> for
+  the affected element only.</p>
 
   <p class=example>For example, this might happen because the
   element is removed from its <code><a href=#document>Document</a></code>, or has a <code title=attr-hidden><a href=#the-hidden-attribute>hidden</a></code> attribute added. It would also
@@ -78314,7 +78333,6 @@ interface <dfn id=navigatorstorageutils>NavigatorStorageUtils</dfn> {
     <p>Unfocuses the element. Use of this method is discouraged. Focus
     another element instead.</p>
 
-<!--FORK-->
     <p>Do not use this method to hide the focus ring if you find the
     focus ring unsightly. Instead, use a CSS rule to override the
     'outline' property. (Be aware, however, that this makes the page
@@ -78345,22 +78363,18 @@ interface <dfn id=navigatorstorageutils>NavigatorStorageUtils</dfn> {
   <ol><li><p>If the element is marked as <i><a href=#locked-for-focus>locked for focus</a></i>, then abort
    these steps.</li>
 
-   <li><p>If the element is not <a href=#focusable>focusable</a>, then abort these
-   steps.</li>
-
    <li><p>Mark the element as <dfn id=locked-for-focus>locked for focus</dfn>.</li>
 
-   <li><p>If the element is not already focused, run the <a href=#focusing-steps>focusing
-   steps</a> for the element.</li>
+   <li><p>Run the <a href=#focusing-steps>focusing steps</a> for the
+   element.</li>
 
    <li><p>Unmark the element as <i><a href=#locked-for-focus>locked for focus</a></i>.</li>
 
   </ol><p>The <dfn id=dom-blur title=dom-blur><code>blur()</code></dfn> method, when
-  invoked, should run the <a href=#focusing-steps>focusing steps</a> for <a href=#the-body-element-0>the
-  body element</a>, if there is one; if there is not, then it
-  should run the <a href=#unfocusing-steps>unfocusing steps</a> for the element on
-  which the method was called instead. User agents may selectively or
-  uniformly ignore calls to this method for usability reasons.</p>
+  invoked, should run the <a href=#unfocusing-steps>unfocusing steps</a> for the
+  element on which the method was called instead. User agents may
+  selectively or uniformly ignore calls to this method for usability
+  reasons.</p>
 
   <p class=example>For example, if the <code title=dom-blur><a href=#dom-blur>blur()</a></code> method is unwisely being used to
   remove the focus ring for aesthetics reasons, the page would become