[html5] r8513 - [giow] (3) Define how focus navigation works Fixing https://www.w3.org/Bugs/Publ [...]
whatwg at whatwg.org
whatwg at whatwg.org
Wed Feb 26 16:30:15 PST 2014
Author: ianh
Date: 2014-02-26 16:30:13 -0800 (Wed, 26 Feb 2014)
New Revision: 8513
Modified:
complete.html
index
source
Log:
[giow] (3) Define how focus navigation works
Fixing https://www.w3.org/Bugs/Public/show_bug.cgi?id=24719
Affected topics: HTML
Modified: complete.html
===================================================================
--- complete.html 2014-02-25 18:33:50 UTC (rev 8512)
+++ complete.html 2014-02-27 00:30:13 UTC (rev 8513)
@@ -298,7 +298,7 @@
<header class=head id=head><p><a href=http://www.whatwg.org/ class=logo><img width=101 src=/images/logo alt=WHATWG height=101></a></p>
<hgroup><h1 class=allcaps>HTML</h1>
- <h2 class="no-num no-toc">Living Standard — Last Updated 25 February 2014</h2>
+ <h2 class="no-num no-toc">Living Standard — Last Updated 27 February 2014</h2>
</hgroup><dl><dt><strong>Web developer edition:</strong></dt>
<dd><strong><a href=http://developers.whatwg.org/>http://developers.whatwg.org/</a></strong></dd>
<dt>Multiple-page version:</dt>
@@ -1076,9 +1076,10 @@
<ol>
<li><a href=#introduction-7><span class=secno>8.4.1 </span>Introduction</a></li>
<li><a href=#data-model><span class=secno>8.4.2 </span>Data model</a></li>
- <li><a href=#sequential-focus-navigation-and-the-tabindex-attribute><span class=secno>8.4.3 </span>Sequential focus navigation and the <code title=attr-tabindex>tabindex</code> attribute</a></li>
+ <li><a href=#the-tabindex-attribute><span class=secno>8.4.3 </span>The <code title=attr-tabindex>tabindex</code> attribute</a></li>
<li><a href=#processing-model-5><span class=secno>8.4.4 </span>Processing model</a></li>
- <li><a href=#focus-management-apis><span class=secno>8.4.5 </span>Focus management APIs</a></ol></li>
+ <li><a href=#sequential-focus-navigation><span class=secno>8.4.5 </span>Sequential focus navigation</a></li>
+ <li><a href=#focus-management-apis><span class=secno>8.4.6 </span>Focus management APIs</a></ol></li>
<li><a href=#assigning-keyboard-shortcuts><span class=secno>8.5 </span>Assigning keyboard shortcuts</a>
<ol>
<li><a href=#introduction-8><span class=secno>8.5.1 </span>Introduction</a></li>
@@ -76602,38 +76603,44 @@
</ol></div>
- <h4 id=sequential-focus-navigation-and-the-tabindex-attribute><span class=secno>8.4.3 </span>Sequential focus navigation and the <code title=attr-tabindex><a href=#attr-tabindex>tabindex</a></code> attribute</h4>
+ <h4 id=the-tabindex-attribute><span class=secno>8.4.3 </span>The <code title=attr-tabindex><a href=#attr-tabindex>tabindex</a></code> attribute</h4>
- <!-- XXX dfn sequential focus navigation -->
- <!-- e.g. when tabbing into a <span>browsing context container</span>, you defer to the Document's idea of what the first focusable area is -->
-
+<!--CLEANUP-->
<p>The <dfn id=attr-tabindex title=attr-tabindex><code>tabindex</code></dfn> content attribute allows authors to
- control whether an element is supposed to be focusable, whether it is supposed to be reachable
- using sequential focus navigation, and what is to be the relative order of the element for the
+ indicate that an element is supposed to be <a href=#focusable-area title="focusable area">focusable</a>, and whether it is supposed to be reachable
+ using <a href=#sequential-focus-navigation>sequential focus navigation</a> and, if so, what is to be the relative order of the element for the
purposes of sequential focus navigation. The name "tab index" comes from the common use of the
"tab" key to navigate through the focusable elements. The term "tabbing" refers to moving forward
through the focusable elements that can be reached using sequential focus navigation.</p>
- <p>The <code title=attr-tabindex><a href=#attr-tabindex>tabindex</a></code> attribute, if specified, must have a value that
- is a <a href=#valid-integer>valid integer</a>.</p>
+ <p>When the attribute is omitted, the user agent applies defaults. (There is no way to make an
+ element that is <a href=#being-rendered>being rendered</a> be not focusable at all without <a href=#concept-element-disabled title=concept-element-disabled>disabling</a> it or making it <a href=#inert>inert</a>.)</p>
+ <p>The <code title=attr-tabindex><a href=#attr-tabindex>tabindex</a></code> attribute, if specified, must have a value
+ that is a <a href=#valid-integer>valid integer</a>. Positive numbers specify the relative position of the
+ element's <a href=#focusable-area title="focusable area">focusable areas</a> in the <a href=#sequential-focus-navigation-order>sequential focus
+ navigation order</a>, and negative numbers indicate that the control is to be unreachable by
+ <a href=#sequential-focus-navigation>sequential focus navigation</a>.</p>
+
<div class=impl>
<p>Each element can have a <dfn id=specially-focusable>tabindex focus flag</dfn> set, as defined
below. This flag is a factor that contributes towards determining whether an element is a
<i><a href=#focusable-area>focusable area</a></i>, as described in the previous section.</p>
- <p>If the attribute is specified, it must be parsed using the <a href=#rules-for-parsing-integers>rules for parsing
- integers</a>. The attribute's values have the following meanings:</p>
+ <p>If the <code title=attr-tabindex><a href=#attr-tabindex>tabindex</a></code> attribute is specified on an element, it
+ must be parsed using the <a href=#rules-for-parsing-integers>rules for parsing integers</a>. The attribute's values, or lack
+ thereof, must be interpreted as follows:</p>
<dl><dt>If the attribute is omitted or parsing the value returns an error</dt>
<dd>
+<!--CLEANUP-->
<p>The user agent should follow platform conventions to determine if the element's
<a href=#specially-focusable>tabindex focus flag</a> is set and, if so, whether the element and any <i title="focusable area"><a href=#focusable-area>focusable areas</a></i> that have the element as their <i><a href=#dom-anchor>DOM anchor</a></i> can
- be reached using sequential focus navigation, and if so, what their relative order should
- be.</p>
+ be reached using <a href=#sequential-focus-navigation>sequential focus navigation</a>, and if so, what their relative position
+ in the <a href=#sequential-focus-navigation-order>sequential focus navigation order</a> is to be.</p>
<p>Modulo platform conventions, it is suggested that for the following elements, the
<a href=#specially-focusable>tabindex focus flag</a> be set:</p>
@@ -76677,9 +76684,8 @@
<dd>
- <p>The user agent must set the element's <a href=#specially-focusable>tabindex focus flag</a>, but should not allow
- the element, or any <i title="focusable area"><a href=#focusable-area>focusable areas</a></i> that have the element as
- their <i><a href=#dom-anchor>DOM anchor</a></i>, to be reached using sequential focus navigation.</p>
+ <p>The user agent must set the element's <a href=#specially-focusable>tabindex focus flag</a>, but should omit the
+ element from the <a href=#sequential-focus-navigation-order>sequential focus navigation order</a>.</p>
<p class=note>One valid reason to ignore the requirement that sequential focus navigation not
allow the author to lead to the element would be if the user's only mechanism for moving the
@@ -76697,8 +76703,8 @@
<!--CLEANUP-->
<p>The user agent must set the element's <a href=#specially-focusable>tabindex focus flag</a>, should allow the
element and any <i title="focusable area"><a href=#focusable-area>focusable areas</a></i> that have the element as
- their <i><a href=#dom-anchor>DOM anchor</a></i> to be reached using sequential focus navigation, and should follow platform conventions
- to determine the element's relative order.</p>
+ their <i><a href=#dom-anchor>DOM anchor</a></i> to be reached using <a href=#sequential-focus-navigation>sequential focus navigation</a>, following platform conventions
+ to determine the element's relative position in the <a href=#sequential-focus-navigation-order>sequential focus navigation order</a>.</p>
</dd>
@@ -76710,8 +76716,8 @@
<p>The user agent must set the element's <a href=#specially-focusable>tabindex focus flag</a>, should allow the
element and any <i title="focusable area"><a href=#focusable-area>focusable areas</a></i> that have the element as their
<i><a href=#dom-anchor>DOM anchor</a></i> to be reached using sequential focus navigation, and should place the
- element — referenced as <var title="">candidate</var> below — and the aforementioned <i title="focusable area"><a href=#focusable-area>focusable areas</a></i> in the sequential
- focus navigation order so that they are:</p>
+ element — referenced as <var title="">candidate</var> below — and the aforementioned <i title="focusable area"><a href=#focusable-area>focusable areas</a></i> in the <a href=#sequential-focus-navigation>sequential
+ focus navigation</a> order so that, relative to other <i title="focusable area"><a href=#focusable-area>focusable areas</a></i> in the <a href=#sequential-focus-navigation-order>sequential focus navigation order</a>, they are:</p>
<ul><!--CLEANUP--><li>before any <i><a href=#focusable-area>focusable area</a></i> whose <i><a href=#dom-anchor>DOM anchor</a></i> is an element whose <code title=attr-tabindex><a href=#attr-tabindex>tabindex</a></code>
attribute has been omitted or whose value, when parsed, returns an error,</li>
@@ -76755,7 +76761,6 @@
</div>
-
<div class=impl>
<h4 id=processing-model-5><span class=secno>8.4.4 </span>Processing model</h4>
@@ -77115,11 +77120,150 @@
event. This might include <a href=#run-synthetic-click-activation-steps title="run synthetic click activation steps">running synthetic
click activation steps</a> for <var title="">target node</var>.</li>
+ </ol><h4 id=sequential-focus-navigation><span class=secno>8.4.5 </span><dfn>Sequential focus navigation</dfn></h4>
+
+ <p>Each <i><a href=#control-group>control group</a></i> has a <dfn id=sequential-focus-navigation-order>sequential focus navigation order</dfn>, which orders some
+ or all of the <i title="focusable area"><a href=#focusable-area>focusable areas</a></i> in the <a href=#control-group>control group</a>
+ relative to each other. The order in the <a href=#sequential-focus-navigation-order>sequential focus navigation order</a> does not
+ have to be related to the order in the <i><a href=#control-group>control group</a></i> itself. If a <i><a href=#focusable-area>focusable area</a></i> is
+ omitted from the <a href=#sequential-focus-navigation-order>sequential focus navigation order</a> of its <i><a href=#control-group>control group</a></i>, then
+ it is unreachable via <a href=#sequential-focus-navigation>sequential focus navigation</a>.</p>
+
+ <p>When the user requests that focus move from the <a href=#currently-focused-area-of-a-top-level-browsing-context>currently focused area of a top-level
+ browsing context</a> to the next or previous <i><a href=#focusable-area>focusable area</a></i> (e.g. as the default action
+ of pressing the <kbd>tab</kbd> key), or when the user requests that focus sequentially move to a
+ <a href=#top-level-browsing-context>top-level browsing context</a> in the first place (e.g. from the browser's location bar),
+ the user agent must use the following algorithm:</p>
+
+ <ol><li><p>Let <var title="">starting point</var> be the <a href=#currently-focused-area-of-a-top-level-browsing-context>currently focused area of a top-level
+ browsing context</a>, if the user requested to move focus sequentially from there, or else the
+ <a href=#top-level-browsing-context>top-level browsing context</a> itself, if the user instead requested to move focus from
+ outside the <a href=#top-level-browsing-context>top-level browsing context</a>.</li>
+
+ <li>
+
+ <p>Let <var title="">direction</var> be <i>forward</i> if the user requested the <em>next</em>
+ control, and <i>backward</i> if the user requested the previous control.</p>
+
+ <p class=note>Typically, pressing <kbd>tab</kbd> requests the next control, and pressing
+ <kbd><kbd>shift</kbd>+<kbd>tab</kbd></kbd> requests the previous control.</p>
+
+ </li>
+
+ <li>
+
+ <p><i>Loop</i>: Let <var title="">selection mechanism</var> be <i>sequential</i> if the <var title="">starting point</var> is a <a href=#browsing-context>browsing context</a> or if <var title="">starting
+ point</var> is in its <i><a href=#control-group>control group</a></i>'s <a href=#sequential-focus-navigation-order>sequential focus navigation order</a>.</p>
+
+ <p>Otherwise, <var title="">starting point</var> is not in its <i><a href=#control-group>control group</a></i>'s
+ <a href=#sequential-focus-navigation-order>sequential focus navigation order</a>; let <var title="">selection mechanism</var> be
+ <i>DOM</i>.</p>
+
+ </li>
+
+ <li><p>Let <var title="">candidate</var> be the result of running the <a href=#sequential-navigation-search-algorithm>sequential
+ navigation search algorithm</a> with <var title="">starting point</var>, <var title="">direction</var>, and <var title="">selection mechanism</var> as the
+ arguments.</li>
+
+ <li><p>If <var title="">candidate</var> is not null, then run the <a href=#focusing-steps>focusing steps</a>
+ for <var title="">candidate</var> and abort these steps.</li>
+
+ <li>
+
+ <p>Otherwise, if <var title="">starting point</var> is the <a href=#top-level-browsing-context>top-level browsing
+ context</a>, or a <i><a href=#focusable-area>focusable area</a></i> in the <a href=#top-level-browsing-context>top-level browsing context</a>, the
+ user agent should transfer focus to its own controls appropriately (if any), honouring <var title="">direction</var>, and then abort these steps.</p>
+
+ <p class=example>For example, if <var title="">direction</var> is <i>backward</i>, then the
+ last focusable control before the browser's rendering area would be the control to focus.</p>
+
+ <p>If the user agent has no focusable controls — a kiosk-mode browser, for instance
+ — <!--and <var title="">starting point</var> is not the <span>top-level browsing
+ context</span>,--> then the user agent may instead restart these steps with the <var title="">starting point</var> being the <a href=#top-level-browsing-context>top-level browsing context</a> itself.</p>
+
+ <!-- in theory, the top-level browsing context _always_ has at least one focusable area: the
+ viewport. Even a "blocked by a modal dialog" doesn't disable the viewport (since the Document is
+ its DOM anchor, and the Document isn't made inert by "blocked by a modal dialog"). Note that
+ nested browsing contexts can have inert viewports, though (if the browsing context container
+ itself is inert, for example) -->
+
+ </li>
+
+ <li><p>Otherwise, <var title="">starting point</var> is a <i><a href=#focusable-area>focusable area</a></i> in a
+ <a href=#nested-browsing-context>nested browsing context</a>. Let <var title="">starting point</var> be that
+ <a href=#nested-browsing-context>nested browsing context</a>'s <a href=#browsing-context-container>browsing context container</a>, and return to the
+ step labeled <i>loop</i>.</p>
+ <!--
+ http://software.hixie.ch/utilities/js/live-dom-viewer/saved/2856
+ http://software.hixie.ch/utilities/js/live-dom-viewer/saved/2857
+ -->
+ </li>
+
+ </ol><p>The <dfn id=sequential-navigation-search-algorithm>sequential navigation search algorithm</dfn> consists of the following steps. This
+ algorithm takes three arguments: <var title="">starting point</var>, <var title="">direction</var>,
+ and <var title="">selection mechanism</var>.</p>
+
+ <ol><li>
+
+ <p>Pick the appropriate cell from the following table, and follow the instructions in that
+ cell.</p>
+
+ <p>The appropriate cell is the one that is from the column whose header describes <var title="">direction</var> and from the first row whose header describes <var title="">starting point</var> and <var title="">selection mechanism</var>.</p>
+
+ <table><thead><tr><th>
+ <th> <var title="">direction</var> is <i>forward</i>
+ <th> <var title="">direction</var> is <i>backward</i>
+ <tbody><tr><th><var title="">starting point</var> is a <a href=#browsing-context>browsing context</a>
+ <td>Let <var title="">candidate</var> be the first <a href=#suitable-sequentially-focusable-area>suitable sequentially focusable area</a> in <var title="">starting point</var>'s <a href=#active-document>active document</a>'s <a href=#primary-control-group>primary control group</a>, if any; or else null
+ <td>Let <var title="">candidate</var> be the last <a href=#suitable-sequentially-focusable-area>suitable sequentially focusable area</a> in <var title="">starting point</var>'s <a href=#active-document>active document</a>'s <a href=#primary-control-group>primary control group</a>, if any; or else null
+ <tr><th><var title="">selection mechanism</var> is <i>DOM</i>
+ <td>Let <var title="">candidate</var> be the first <a href=#suitable-sequentially-focusable-area>suitable sequentially focusable area</a> in the <a href=#home-control-group>home control group</a> following <var title="">starting point</var>, if any; or else null
+ <td>Let <var title="">candidate</var> be the last <a href=#suitable-sequentially-focusable-area>suitable sequentially focusable area</a> in the <a href=#home-control-group>home control group</a> preceding <var title="">starting point</var>, if any; or else null
+ <tr><th><var title="">selection mechanism</var> is <i>sequential</i>
+ <td>Let <var title="">candidate</var> be the first <a href=#suitable-sequentially-focusable-area>suitable sequentially focusable area</a> in the <a href=#home-sequential-focus-navigation-order>home sequential focus navigation order</a> following <var title="">starting point</var>, if any; or else null
+ <td>Let <var title="">candidate</var> be the last <a href=#suitable-sequentially-focusable-area>suitable sequentially focusable area</a> in the <a href=#home-sequential-focus-navigation-order>home sequential focus navigation order</a> preceding <var title="">starting point</var>, if any; or else null
+
+ </table><p>A <dfn id=suitable-sequentially-focusable-area>suitable sequentially focusable area</dfn> is a <i><a href=#focusable-area>focusable area</a></i> whose <i><a href=#dom-anchor>DOM
+ anchor</a></i> is not <a href=#inert>inert</a> and that is in its <i><a href=#control-group>control group</a></i>'s <a href=#sequential-focus-navigation-order>sequential
+ focus navigation order</a>.</p>
+
+ <p>The <dfn id=primary-control-group>primary control group</dfn> of a <a href=#control-group-owner-object>control group owner object</a> <var title="">X</var> is the <i><a href=#control-group>control group</a></i> of <var title="">X</var> if <var title="">X</var> has no <a href=#dialog-group>dialog group</a> or if its <a href=#dialog-group>dialog group</a> has no
+ designated <a href=#focused-dialog-of-the-dialog-group>focused dialog of the dialog group</a>, otherwise, it is the <a href=#primary-control-group>primary
+ control group</a> of <var title="">X</var>'s <a href=#dialog-group>dialog group</a>'s designated
+ <a href=#focused-dialog-of-the-dialog-group>focused dialog of the dialog group</a>.</p>
+
+ <p>The <dfn id=home-control-group>home control group</dfn> is the <i><a href=#control-group>control group</a></i> to which <var title="">starting point</var> belongs.</p>
+
+ <p>The <dfn id=home-sequential-focus-navigation-order>home sequential focus navigation order</dfn> is the <a href=#sequential-focus-navigation-order>sequential focus
+ navigation order</a> to which <var title="">starting point</var> belongs.</p>
+
+ <p class=note>The <a href=#home-sequential-focus-navigation-order>home sequential focus navigation order</a> is the <a href=#home-control-group>home
+ control group</a>'s <a href=#sequential-focus-navigation-order>sequential focus navigation order</a>, but is only used when the
+ <var title="">starting point</var> is in that <a href=#sequential-focus-navigation-order>sequential focus navigation order</a>
+ (when it's not, <var title="">selection mechanism</var> will be <i>DOM</i>).</p>
+
+ </li>
+
+ <li>
+
+ <p>If <var title="">candidate</var> is a <a href=#browsing-context-container>browsing context container</a>, then let <var title="">new candidate</var> be the result of running the <a href=#sequential-navigation-search-algorithm>sequential navigation search
+ algorithm</a> with <var title="">candidate</var>'s <a href=#nested-browsing-context>nested browsing context</a> as
+ the first argument, <var title="">direction</var> as the second, and <i>sequential</i> <!--
+ shift-tab from the end in http://software.hixie.ch/utilities/js/live-dom-viewer/saved/2855 -->
+ as the third.</p>
+
+ <p>If <var title="">new candidate</var> is null, then let <var title="">starting point</var>
+ be <var title="">candidate</var>, and return to the top of this algorithm. Otherwise, let <var title="">candidate</var> be <var title="">new candidate</var>.</p>
+
+ </li>
+
+ <li><p>Return <var title="">candidate</var>.</li>
+
</ol></div>
<!--TOPIC:DOM APIs-->
- <h4 id=focus-management-apis><span class=secno>8.4.5 </span>Focus management APIs</h4>
+ <h4 id=focus-management-apis><span class=secno>8.4.6 </span>Focus management APIs</h4>
<dl class=domintro><dt><var title="">document</var> . <code title=dom-document-activeElement><a href=#dom-document-activeelement>activeElement</a></code></dt>
Modified: index
===================================================================
--- index 2014-02-25 18:33:50 UTC (rev 8512)
+++ index 2014-02-27 00:30:13 UTC (rev 8513)
@@ -298,7 +298,7 @@
<header class=head id=head><p><a href=http://www.whatwg.org/ class=logo><img width=101 src=/images/logo alt=WHATWG height=101></a></p>
<hgroup><h1 class=allcaps>HTML</h1>
- <h2 class="no-num no-toc">Living Standard — Last Updated 25 February 2014</h2>
+ <h2 class="no-num no-toc">Living Standard — Last Updated 27 February 2014</h2>
</hgroup><dl><dt><strong>Web developer edition:</strong></dt>
<dd><strong><a href=http://developers.whatwg.org/>http://developers.whatwg.org/</a></strong></dd>
<dt>Multiple-page version:</dt>
@@ -1076,9 +1076,10 @@
<ol>
<li><a href=#introduction-7><span class=secno>8.4.1 </span>Introduction</a></li>
<li><a href=#data-model><span class=secno>8.4.2 </span>Data model</a></li>
- <li><a href=#sequential-focus-navigation-and-the-tabindex-attribute><span class=secno>8.4.3 </span>Sequential focus navigation and the <code title=attr-tabindex>tabindex</code> attribute</a></li>
+ <li><a href=#the-tabindex-attribute><span class=secno>8.4.3 </span>The <code title=attr-tabindex>tabindex</code> attribute</a></li>
<li><a href=#processing-model-5><span class=secno>8.4.4 </span>Processing model</a></li>
- <li><a href=#focus-management-apis><span class=secno>8.4.5 </span>Focus management APIs</a></ol></li>
+ <li><a href=#sequential-focus-navigation><span class=secno>8.4.5 </span>Sequential focus navigation</a></li>
+ <li><a href=#focus-management-apis><span class=secno>8.4.6 </span>Focus management APIs</a></ol></li>
<li><a href=#assigning-keyboard-shortcuts><span class=secno>8.5 </span>Assigning keyboard shortcuts</a>
<ol>
<li><a href=#introduction-8><span class=secno>8.5.1 </span>Introduction</a></li>
@@ -76602,38 +76603,44 @@
</ol></div>
- <h4 id=sequential-focus-navigation-and-the-tabindex-attribute><span class=secno>8.4.3 </span>Sequential focus navigation and the <code title=attr-tabindex><a href=#attr-tabindex>tabindex</a></code> attribute</h4>
+ <h4 id=the-tabindex-attribute><span class=secno>8.4.3 </span>The <code title=attr-tabindex><a href=#attr-tabindex>tabindex</a></code> attribute</h4>
- <!-- XXX dfn sequential focus navigation -->
- <!-- e.g. when tabbing into a <span>browsing context container</span>, you defer to the Document's idea of what the first focusable area is -->
-
+<!--CLEANUP-->
<p>The <dfn id=attr-tabindex title=attr-tabindex><code>tabindex</code></dfn> content attribute allows authors to
- control whether an element is supposed to be focusable, whether it is supposed to be reachable
- using sequential focus navigation, and what is to be the relative order of the element for the
+ indicate that an element is supposed to be <a href=#focusable-area title="focusable area">focusable</a>, and whether it is supposed to be reachable
+ using <a href=#sequential-focus-navigation>sequential focus navigation</a> and, if so, what is to be the relative order of the element for the
purposes of sequential focus navigation. The name "tab index" comes from the common use of the
"tab" key to navigate through the focusable elements. The term "tabbing" refers to moving forward
through the focusable elements that can be reached using sequential focus navigation.</p>
- <p>The <code title=attr-tabindex><a href=#attr-tabindex>tabindex</a></code> attribute, if specified, must have a value that
- is a <a href=#valid-integer>valid integer</a>.</p>
+ <p>When the attribute is omitted, the user agent applies defaults. (There is no way to make an
+ element that is <a href=#being-rendered>being rendered</a> be not focusable at all without <a href=#concept-element-disabled title=concept-element-disabled>disabling</a> it or making it <a href=#inert>inert</a>.)</p>
+ <p>The <code title=attr-tabindex><a href=#attr-tabindex>tabindex</a></code> attribute, if specified, must have a value
+ that is a <a href=#valid-integer>valid integer</a>. Positive numbers specify the relative position of the
+ element's <a href=#focusable-area title="focusable area">focusable areas</a> in the <a href=#sequential-focus-navigation-order>sequential focus
+ navigation order</a>, and negative numbers indicate that the control is to be unreachable by
+ <a href=#sequential-focus-navigation>sequential focus navigation</a>.</p>
+
<div class=impl>
<p>Each element can have a <dfn id=specially-focusable>tabindex focus flag</dfn> set, as defined
below. This flag is a factor that contributes towards determining whether an element is a
<i><a href=#focusable-area>focusable area</a></i>, as described in the previous section.</p>
- <p>If the attribute is specified, it must be parsed using the <a href=#rules-for-parsing-integers>rules for parsing
- integers</a>. The attribute's values have the following meanings:</p>
+ <p>If the <code title=attr-tabindex><a href=#attr-tabindex>tabindex</a></code> attribute is specified on an element, it
+ must be parsed using the <a href=#rules-for-parsing-integers>rules for parsing integers</a>. The attribute's values, or lack
+ thereof, must be interpreted as follows:</p>
<dl><dt>If the attribute is omitted or parsing the value returns an error</dt>
<dd>
+<!--CLEANUP-->
<p>The user agent should follow platform conventions to determine if the element's
<a href=#specially-focusable>tabindex focus flag</a> is set and, if so, whether the element and any <i title="focusable area"><a href=#focusable-area>focusable areas</a></i> that have the element as their <i><a href=#dom-anchor>DOM anchor</a></i> can
- be reached using sequential focus navigation, and if so, what their relative order should
- be.</p>
+ be reached using <a href=#sequential-focus-navigation>sequential focus navigation</a>, and if so, what their relative position
+ in the <a href=#sequential-focus-navigation-order>sequential focus navigation order</a> is to be.</p>
<p>Modulo platform conventions, it is suggested that for the following elements, the
<a href=#specially-focusable>tabindex focus flag</a> be set:</p>
@@ -76677,9 +76684,8 @@
<dd>
- <p>The user agent must set the element's <a href=#specially-focusable>tabindex focus flag</a>, but should not allow
- the element, or any <i title="focusable area"><a href=#focusable-area>focusable areas</a></i> that have the element as
- their <i><a href=#dom-anchor>DOM anchor</a></i>, to be reached using sequential focus navigation.</p>
+ <p>The user agent must set the element's <a href=#specially-focusable>tabindex focus flag</a>, but should omit the
+ element from the <a href=#sequential-focus-navigation-order>sequential focus navigation order</a>.</p>
<p class=note>One valid reason to ignore the requirement that sequential focus navigation not
allow the author to lead to the element would be if the user's only mechanism for moving the
@@ -76697,8 +76703,8 @@
<!--CLEANUP-->
<p>The user agent must set the element's <a href=#specially-focusable>tabindex focus flag</a>, should allow the
element and any <i title="focusable area"><a href=#focusable-area>focusable areas</a></i> that have the element as
- their <i><a href=#dom-anchor>DOM anchor</a></i> to be reached using sequential focus navigation, and should follow platform conventions
- to determine the element's relative order.</p>
+ their <i><a href=#dom-anchor>DOM anchor</a></i> to be reached using <a href=#sequential-focus-navigation>sequential focus navigation</a>, following platform conventions
+ to determine the element's relative position in the <a href=#sequential-focus-navigation-order>sequential focus navigation order</a>.</p>
</dd>
@@ -76710,8 +76716,8 @@
<p>The user agent must set the element's <a href=#specially-focusable>tabindex focus flag</a>, should allow the
element and any <i title="focusable area"><a href=#focusable-area>focusable areas</a></i> that have the element as their
<i><a href=#dom-anchor>DOM anchor</a></i> to be reached using sequential focus navigation, and should place the
- element — referenced as <var title="">candidate</var> below — and the aforementioned <i title="focusable area"><a href=#focusable-area>focusable areas</a></i> in the sequential
- focus navigation order so that they are:</p>
+ element — referenced as <var title="">candidate</var> below — and the aforementioned <i title="focusable area"><a href=#focusable-area>focusable areas</a></i> in the <a href=#sequential-focus-navigation>sequential
+ focus navigation</a> order so that, relative to other <i title="focusable area"><a href=#focusable-area>focusable areas</a></i> in the <a href=#sequential-focus-navigation-order>sequential focus navigation order</a>, they are:</p>
<ul><!--CLEANUP--><li>before any <i><a href=#focusable-area>focusable area</a></i> whose <i><a href=#dom-anchor>DOM anchor</a></i> is an element whose <code title=attr-tabindex><a href=#attr-tabindex>tabindex</a></code>
attribute has been omitted or whose value, when parsed, returns an error,</li>
@@ -76755,7 +76761,6 @@
</div>
-
<div class=impl>
<h4 id=processing-model-5><span class=secno>8.4.4 </span>Processing model</h4>
@@ -77115,11 +77120,150 @@
event. This might include <a href=#run-synthetic-click-activation-steps title="run synthetic click activation steps">running synthetic
click activation steps</a> for <var title="">target node</var>.</li>
+ </ol><h4 id=sequential-focus-navigation><span class=secno>8.4.5 </span><dfn>Sequential focus navigation</dfn></h4>
+
+ <p>Each <i><a href=#control-group>control group</a></i> has a <dfn id=sequential-focus-navigation-order>sequential focus navigation order</dfn>, which orders some
+ or all of the <i title="focusable area"><a href=#focusable-area>focusable areas</a></i> in the <a href=#control-group>control group</a>
+ relative to each other. The order in the <a href=#sequential-focus-navigation-order>sequential focus navigation order</a> does not
+ have to be related to the order in the <i><a href=#control-group>control group</a></i> itself. If a <i><a href=#focusable-area>focusable area</a></i> is
+ omitted from the <a href=#sequential-focus-navigation-order>sequential focus navigation order</a> of its <i><a href=#control-group>control group</a></i>, then
+ it is unreachable via <a href=#sequential-focus-navigation>sequential focus navigation</a>.</p>
+
+ <p>When the user requests that focus move from the <a href=#currently-focused-area-of-a-top-level-browsing-context>currently focused area of a top-level
+ browsing context</a> to the next or previous <i><a href=#focusable-area>focusable area</a></i> (e.g. as the default action
+ of pressing the <kbd>tab</kbd> key), or when the user requests that focus sequentially move to a
+ <a href=#top-level-browsing-context>top-level browsing context</a> in the first place (e.g. from the browser's location bar),
+ the user agent must use the following algorithm:</p>
+
+ <ol><li><p>Let <var title="">starting point</var> be the <a href=#currently-focused-area-of-a-top-level-browsing-context>currently focused area of a top-level
+ browsing context</a>, if the user requested to move focus sequentially from there, or else the
+ <a href=#top-level-browsing-context>top-level browsing context</a> itself, if the user instead requested to move focus from
+ outside the <a href=#top-level-browsing-context>top-level browsing context</a>.</li>
+
+ <li>
+
+ <p>Let <var title="">direction</var> be <i>forward</i> if the user requested the <em>next</em>
+ control, and <i>backward</i> if the user requested the previous control.</p>
+
+ <p class=note>Typically, pressing <kbd>tab</kbd> requests the next control, and pressing
+ <kbd><kbd>shift</kbd>+<kbd>tab</kbd></kbd> requests the previous control.</p>
+
+ </li>
+
+ <li>
+
+ <p><i>Loop</i>: Let <var title="">selection mechanism</var> be <i>sequential</i> if the <var title="">starting point</var> is a <a href=#browsing-context>browsing context</a> or if <var title="">starting
+ point</var> is in its <i><a href=#control-group>control group</a></i>'s <a href=#sequential-focus-navigation-order>sequential focus navigation order</a>.</p>
+
+ <p>Otherwise, <var title="">starting point</var> is not in its <i><a href=#control-group>control group</a></i>'s
+ <a href=#sequential-focus-navigation-order>sequential focus navigation order</a>; let <var title="">selection mechanism</var> be
+ <i>DOM</i>.</p>
+
+ </li>
+
+ <li><p>Let <var title="">candidate</var> be the result of running the <a href=#sequential-navigation-search-algorithm>sequential
+ navigation search algorithm</a> with <var title="">starting point</var>, <var title="">direction</var>, and <var title="">selection mechanism</var> as the
+ arguments.</li>
+
+ <li><p>If <var title="">candidate</var> is not null, then run the <a href=#focusing-steps>focusing steps</a>
+ for <var title="">candidate</var> and abort these steps.</li>
+
+ <li>
+
+ <p>Otherwise, if <var title="">starting point</var> is the <a href=#top-level-browsing-context>top-level browsing
+ context</a>, or a <i><a href=#focusable-area>focusable area</a></i> in the <a href=#top-level-browsing-context>top-level browsing context</a>, the
+ user agent should transfer focus to its own controls appropriately (if any), honouring <var title="">direction</var>, and then abort these steps.</p>
+
+ <p class=example>For example, if <var title="">direction</var> is <i>backward</i>, then the
+ last focusable control before the browser's rendering area would be the control to focus.</p>
+
+ <p>If the user agent has no focusable controls — a kiosk-mode browser, for instance
+ — <!--and <var title="">starting point</var> is not the <span>top-level browsing
+ context</span>,--> then the user agent may instead restart these steps with the <var title="">starting point</var> being the <a href=#top-level-browsing-context>top-level browsing context</a> itself.</p>
+
+ <!-- in theory, the top-level browsing context _always_ has at least one focusable area: the
+ viewport. Even a "blocked by a modal dialog" doesn't disable the viewport (since the Document is
+ its DOM anchor, and the Document isn't made inert by "blocked by a modal dialog"). Note that
+ nested browsing contexts can have inert viewports, though (if the browsing context container
+ itself is inert, for example) -->
+
+ </li>
+
+ <li><p>Otherwise, <var title="">starting point</var> is a <i><a href=#focusable-area>focusable area</a></i> in a
+ <a href=#nested-browsing-context>nested browsing context</a>. Let <var title="">starting point</var> be that
+ <a href=#nested-browsing-context>nested browsing context</a>'s <a href=#browsing-context-container>browsing context container</a>, and return to the
+ step labeled <i>loop</i>.</p>
+ <!--
+ http://software.hixie.ch/utilities/js/live-dom-viewer/saved/2856
+ http://software.hixie.ch/utilities/js/live-dom-viewer/saved/2857
+ -->
+ </li>
+
+ </ol><p>The <dfn id=sequential-navigation-search-algorithm>sequential navigation search algorithm</dfn> consists of the following steps. This
+ algorithm takes three arguments: <var title="">starting point</var>, <var title="">direction</var>,
+ and <var title="">selection mechanism</var>.</p>
+
+ <ol><li>
+
+ <p>Pick the appropriate cell from the following table, and follow the instructions in that
+ cell.</p>
+
+ <p>The appropriate cell is the one that is from the column whose header describes <var title="">direction</var> and from the first row whose header describes <var title="">starting point</var> and <var title="">selection mechanism</var>.</p>
+
+ <table><thead><tr><th>
+ <th> <var title="">direction</var> is <i>forward</i>
+ <th> <var title="">direction</var> is <i>backward</i>
+ <tbody><tr><th><var title="">starting point</var> is a <a href=#browsing-context>browsing context</a>
+ <td>Let <var title="">candidate</var> be the first <a href=#suitable-sequentially-focusable-area>suitable sequentially focusable area</a> in <var title="">starting point</var>'s <a href=#active-document>active document</a>'s <a href=#primary-control-group>primary control group</a>, if any; or else null
+ <td>Let <var title="">candidate</var> be the last <a href=#suitable-sequentially-focusable-area>suitable sequentially focusable area</a> in <var title="">starting point</var>'s <a href=#active-document>active document</a>'s <a href=#primary-control-group>primary control group</a>, if any; or else null
+ <tr><th><var title="">selection mechanism</var> is <i>DOM</i>
+ <td>Let <var title="">candidate</var> be the first <a href=#suitable-sequentially-focusable-area>suitable sequentially focusable area</a> in the <a href=#home-control-group>home control group</a> following <var title="">starting point</var>, if any; or else null
+ <td>Let <var title="">candidate</var> be the last <a href=#suitable-sequentially-focusable-area>suitable sequentially focusable area</a> in the <a href=#home-control-group>home control group</a> preceding <var title="">starting point</var>, if any; or else null
+ <tr><th><var title="">selection mechanism</var> is <i>sequential</i>
+ <td>Let <var title="">candidate</var> be the first <a href=#suitable-sequentially-focusable-area>suitable sequentially focusable area</a> in the <a href=#home-sequential-focus-navigation-order>home sequential focus navigation order</a> following <var title="">starting point</var>, if any; or else null
+ <td>Let <var title="">candidate</var> be the last <a href=#suitable-sequentially-focusable-area>suitable sequentially focusable area</a> in the <a href=#home-sequential-focus-navigation-order>home sequential focus navigation order</a> preceding <var title="">starting point</var>, if any; or else null
+
+ </table><p>A <dfn id=suitable-sequentially-focusable-area>suitable sequentially focusable area</dfn> is a <i><a href=#focusable-area>focusable area</a></i> whose <i><a href=#dom-anchor>DOM
+ anchor</a></i> is not <a href=#inert>inert</a> and that is in its <i><a href=#control-group>control group</a></i>'s <a href=#sequential-focus-navigation-order>sequential
+ focus navigation order</a>.</p>
+
+ <p>The <dfn id=primary-control-group>primary control group</dfn> of a <a href=#control-group-owner-object>control group owner object</a> <var title="">X</var> is the <i><a href=#control-group>control group</a></i> of <var title="">X</var> if <var title="">X</var> has no <a href=#dialog-group>dialog group</a> or if its <a href=#dialog-group>dialog group</a> has no
+ designated <a href=#focused-dialog-of-the-dialog-group>focused dialog of the dialog group</a>, otherwise, it is the <a href=#primary-control-group>primary
+ control group</a> of <var title="">X</var>'s <a href=#dialog-group>dialog group</a>'s designated
+ <a href=#focused-dialog-of-the-dialog-group>focused dialog of the dialog group</a>.</p>
+
+ <p>The <dfn id=home-control-group>home control group</dfn> is the <i><a href=#control-group>control group</a></i> to which <var title="">starting point</var> belongs.</p>
+
+ <p>The <dfn id=home-sequential-focus-navigation-order>home sequential focus navigation order</dfn> is the <a href=#sequential-focus-navigation-order>sequential focus
+ navigation order</a> to which <var title="">starting point</var> belongs.</p>
+
+ <p class=note>The <a href=#home-sequential-focus-navigation-order>home sequential focus navigation order</a> is the <a href=#home-control-group>home
+ control group</a>'s <a href=#sequential-focus-navigation-order>sequential focus navigation order</a>, but is only used when the
+ <var title="">starting point</var> is in that <a href=#sequential-focus-navigation-order>sequential focus navigation order</a>
+ (when it's not, <var title="">selection mechanism</var> will be <i>DOM</i>).</p>
+
+ </li>
+
+ <li>
+
+ <p>If <var title="">candidate</var> is a <a href=#browsing-context-container>browsing context container</a>, then let <var title="">new candidate</var> be the result of running the <a href=#sequential-navigation-search-algorithm>sequential navigation search
+ algorithm</a> with <var title="">candidate</var>'s <a href=#nested-browsing-context>nested browsing context</a> as
+ the first argument, <var title="">direction</var> as the second, and <i>sequential</i> <!--
+ shift-tab from the end in http://software.hixie.ch/utilities/js/live-dom-viewer/saved/2855 -->
+ as the third.</p>
+
+ <p>If <var title="">new candidate</var> is null, then let <var title="">starting point</var>
+ be <var title="">candidate</var>, and return to the top of this algorithm. Otherwise, let <var title="">candidate</var> be <var title="">new candidate</var>.</p>
+
+ </li>
+
+ <li><p>Return <var title="">candidate</var>.</li>
+
</ol></div>
<!--TOPIC:DOM APIs-->
- <h4 id=focus-management-apis><span class=secno>8.4.5 </span>Focus management APIs</h4>
+ <h4 id=focus-management-apis><span class=secno>8.4.6 </span>Focus management APIs</h4>
<dl class=domintro><dt><var title="">document</var> . <code title=dom-document-activeElement><a href=#dom-document-activeelement>activeElement</a></code></dt>
Modified: source
===================================================================
--- source 2014-02-25 18:33:50 UTC (rev 8512)
+++ source 2014-02-27 00:30:13 UTC (rev 8513)
@@ -85702,29 +85702,35 @@
</div>
- <h4>Sequential focus navigation and the <code data-x="attr-tabindex">tabindex</code> attribute</h4>
+ <h4>The <code data-x="attr-tabindex">tabindex</code> attribute</h4>
- <!-- XXX dfn sequential focus navigation -->
- <!-- e.g. when tabbing into a <span>browsing context container</span>, you defer to the Document's idea of what the first focusable area is -->
-
+<!--CLEANUP-->
<p>The <dfn data-x="attr-tabindex"><code>tabindex</code></dfn> content attribute allows authors to
- control whether an element is supposed to be focusable, whether it is supposed to be reachable
- using sequential focus navigation, and what is to be the relative order of the element for the
+ indicate that an element is supposed to be <span data-x="focusable area">focusable</span>, and whether it is supposed to be reachable
+ using <span>sequential focus navigation</span> and, if so, what is to be the relative order of the element for the
purposes of sequential focus navigation. The name "tab index" comes from the common use of the
"tab" key to navigate through the focusable elements. The term "tabbing" refers to moving forward
through the focusable elements that can be reached using sequential focus navigation.</p>
- <p>The <code data-x="attr-tabindex">tabindex</code> attribute, if specified, must have a value that
- is a <span>valid integer</span>.</p>
+ <p>When the attribute is omitted, the user agent applies defaults. (There is no way to make an
+ element that is <span>being rendered</span> be not focusable at all without <span
+ data-x="concept-element-disabled">disabling</span> it or making it <span>inert</span>.)</p>
+ <p>The <code data-x="attr-tabindex">tabindex</code> attribute, if specified, must have a value
+ that is a <span>valid integer</span>. Positive numbers specify the relative position of the
+ element's <span data-x="focusable area">focusable areas</span> in the <span>sequential focus
+ navigation order</span>, and negative numbers indicate that the control is to be unreachable by
+ <span>sequential focus navigation</span>.</p>
+
<div class="impl">
<p>Each element can have a <dfn id="specially-focusable">tabindex focus flag</dfn> set, as defined
below. This flag is a factor that contributes towards determining whether an element is a
<i>focusable area</i>, as described in the previous section.</p>
- <p>If the attribute is specified, it must be parsed using the <span>rules for parsing
- integers</span>. The attribute's values have the following meanings:</p>
+ <p>If the <code data-x="attr-tabindex">tabindex</code> attribute is specified on an element, it
+ must be parsed using the <span>rules for parsing integers</span>. The attribute's values, or lack
+ thereof, must be interpreted as follows:</p>
<dl>
@@ -85732,11 +85738,12 @@
<dd>
+<!--CLEANUP-->
<p>The user agent should follow platform conventions to determine if the element's
<span>tabindex focus flag</span> is set and, if so, whether the element and any <i
data-x="focusable area">focusable areas</i> that have the element as their <i>DOM anchor</i> can
- be reached using sequential focus navigation, and if so, what their relative order should
- be.</p>
+ be reached using <span>sequential focus navigation</span>, and if so, what their relative position
+ in the <span>sequential focus navigation order</span> is to be.</p>
<p>Modulo platform conventions, it is suggested that for the following elements, the
<span>tabindex focus flag</span> be set:</p>
@@ -85785,9 +85792,8 @@
<dd>
- <p>The user agent must set the element's <span>tabindex focus flag</span>, but should not allow
- the element, or any <i data-x="focusable area">focusable areas</i> that have the element as
- their <i>DOM anchor</i>, to be reached using sequential focus navigation.</p>
+ <p>The user agent must set the element's <span>tabindex focus flag</span>, but should omit the
+ element from the <span>sequential focus navigation order</span>.</p>
<p class="note">One valid reason to ignore the requirement that sequential focus navigation not
allow the author to lead to the element would be if the user's only mechanism for moving the
@@ -85805,8 +85811,8 @@
<!--CLEANUP-->
<p>The user agent must set the element's <span>tabindex focus flag</span>, should allow the
element and any <i data-x="focusable area">focusable areas</i> that have the element as
- their <i>DOM anchor</i> to be reached using sequential focus navigation, and should follow platform conventions
- to determine the element's relative order.</p>
+ their <i>DOM anchor</i> to be reached using <span>sequential focus navigation</span>, following platform conventions
+ to determine the element's relative position in the <span>sequential focus navigation order</span>.</p>
</dd>
@@ -85818,8 +85824,8 @@
<p>The user agent must set the element's <span>tabindex focus flag</span>, should allow the
element and any <i data-x="focusable area">focusable areas</i> that have the element as their
<i>DOM anchor</i> to be reached using sequential focus navigation, and should place the
- element — referenced as <var data-x="">candidate</var> below — and the aforementioned <i data-x="focusable area">focusable areas</i> in the sequential
- focus navigation order so that they are:</p>
+ element — referenced as <var data-x="">candidate</var> below — and the aforementioned <i data-x="focusable area">focusable areas</i> in the <span>sequential
+ focus navigation</span> order so that, relative to other <i data-x="focusable area">focusable areas</i> in the <span>sequential focus navigation order</span>, they are:</p>
<ul><!--CLEANUP-->
@@ -85870,7 +85876,6 @@
</div>
-
<div class="impl">
<h4>Processing model</h4>
@@ -86302,6 +86307,176 @@
</ol>
+
+
+ <h4><dfn>Sequential focus navigation</dfn></h4>
+
+ <p>Each <i>control group</i> has a <dfn>sequential focus navigation order</dfn>, which orders some
+ or all of the <i data-x="focusable area">focusable areas</i> in the <span>control group</span>
+ relative to each other. The order in the <span>sequential focus navigation order</span> does not
+ have to be related to the order in the <i>control group</i> itself. If a <i>focusable area</i> is
+ omitted from the <span>sequential focus navigation order</span> of its <i>control group</i>, then
+ it is unreachable via <span>sequential focus navigation</span>.</p>
+
+ <p>When the user requests that focus move from the <span>currently focused area of a top-level
+ browsing context</span> to the next or previous <i>focusable area</i> (e.g. as the default action
+ of pressing the <kbd>tab</kbd> key), or when the user requests that focus sequentially move to a
+ <span>top-level browsing context</span> in the first place (e.g. from the browser's location bar),
+ the user agent must use the following algorithm:</p>
+
+ <ol>
+
+ <li><p>Let <var data-x="">starting point</var> be the <span>currently focused area of a top-level
+ browsing context</span>, if the user requested to move focus sequentially from there, or else the
+ <span>top-level browsing context</span> itself, if the user instead requested to move focus from
+ outside the <span>top-level browsing context</span>.</p></li>
+
+ <li>
+
+ <p>Let <var data-x="">direction</var> be <i>forward</i> if the user requested the <em>next</em>
+ control, and <i>backward</i> if the user requested the previous control.</p>
+
+ <p class="note">Typically, pressing <kbd>tab</kbd> requests the next control, and pressing
+ <kbd><kbd>shift</kbd>+<kbd>tab</kbd></kbd> requests the previous control.</p>
+
+ </li>
+
+ <li>
+
+ <p><i>Loop</i>: Let <var data-x="">selection mechanism</var> be <i>sequential</i> if the <var
+ data-x="">starting point</var> is a <span>browsing context</span> or if <var data-x="">starting
+ point</var> is in its <i>control group</i>'s <span>sequential focus navigation order</span>.</p>
+
+ <p>Otherwise, <var data-x="">starting point</var> is not in its <i>control group</i>'s
+ <span>sequential focus navigation order</span>; let <var data-x="">selection mechanism</var> be
+ <i>DOM</i>.</p>
+
+ </li>
+
+ <li><p>Let <var data-x="">candidate</var> be the result of running the <span>sequential
+ navigation search algorithm</span> with <var data-x="">starting point</var>, <var
+ data-x="">direction</var>, and <var data-x="">selection mechanism</var> as the
+ arguments.</p></li>
+
+ <li><p>If <var data-x="">candidate</var> is not null, then run the <span>focusing steps</span>
+ for <var data-x="">candidate</var> and abort these steps.</p></li>
+
+ <li>
+
+ <p>Otherwise, if <var data-x="">starting point</var> is the <span>top-level browsing
+ context</span>, or a <i>focusable area</i> in the <span>top-level browsing context</span>, the
+ user agent should transfer focus to its own controls appropriately (if any), honouring <var
+ data-x="">direction</var>, and then abort these steps.</p>
+
+ <p class="example">For example, if <var data-x="">direction</var> is <i>backward</i>, then the
+ last focusable control before the browser's rendering area would be the control to focus.</p>
+
+ <p>If the user agent has no focusable controls — a kiosk-mode browser, for instance
+ — <!--and <var data-x="">starting point</var> is not the <span>top-level browsing
+ context</span>,--> then the user agent may instead restart these steps with the <var
+ data-x="">starting point</var> being the <span>top-level browsing context</span> itself.</p>
+
+ <!-- in theory, the top-level browsing context _always_ has at least one focusable area: the
+ viewport. Even a "blocked by a modal dialog" doesn't disable the viewport (since the Document is
+ its DOM anchor, and the Document isn't made inert by "blocked by a modal dialog"). Note that
+ nested browsing contexts can have inert viewports, though (if the browsing context container
+ itself is inert, for example) -->
+
+ </li>
+
+ <li><p>Otherwise, <var data-x="">starting point</var> is a <i>focusable area</i> in a
+ <span>nested browsing context</span>. Let <var data-x="">starting point</var> be that
+ <span>nested browsing context</span>'s <span>browsing context container</span>, and return to the
+ step labeled <i>loop</i>.</p>
+ <!--
+ http://software.hixie.ch/utilities/js/live-dom-viewer/saved/2856
+ http://software.hixie.ch/utilities/js/live-dom-viewer/saved/2857
+ -->
+ </li>
+
+ </ol>
+
+
+ <p>The <dfn>sequential navigation search algorithm</dfn> consists of the following steps. This
+ algorithm takes three arguments: <var data-x="">starting point</var>, <var data-x="">direction</var>,
+ and <var data-x="">selection mechanism</var>.</p>
+
+ <ol>
+
+ <li>
+
+ <p>Pick the appropriate cell from the following table, and follow the instructions in that
+ cell.</p>
+
+ <p>The appropriate cell is the one that is from the column whose header describes <var
+ data-x="">direction</var> and from the first row whose header describes <var
+ data-x="">starting point</var> and <var data-x="">selection mechanism</var>.</p>
+
+ <table>
+ <thead>
+ <tr>
+ <th>
+ <th> <var data-x="">direction</var> is <i>forward</i>
+ <th> <var data-x="">direction</var> is <i>backward</i>
+ <tbody>
+ <tr>
+ <th><var data-x="">starting point</var> is a <span>browsing context</span>
+ <td>Let <var data-x="">candidate</var> be the first <span>suitable sequentially focusable area</span> in <var data-x="">starting point</var>'s <span>active document</span>'s <span>primary control group</span>, if any; or else null
+ <td>Let <var data-x="">candidate</var> be the last <span>suitable sequentially focusable area</span> in <var data-x="">starting point</var>'s <span>active document</span>'s <span>primary control group</span>, if any; or else null
+ <tr>
+ <th><var data-x="">selection mechanism</var> is <i>DOM</i>
+ <td>Let <var data-x="">candidate</var> be the first <span>suitable sequentially focusable area</span> in the <span>home control group</span> following <var data-x="">starting point</var>, if any; or else null
+ <td>Let <var data-x="">candidate</var> be the last <span>suitable sequentially focusable area</span> in the <span>home control group</span> preceding <var data-x="">starting point</var>, if any; or else null
+ <tr>
+ <th><var data-x="">selection mechanism</var> is <i>sequential</i>
+ <td>Let <var data-x="">candidate</var> be the first <span>suitable sequentially focusable area</span> in the <span>home sequential focus navigation order</span> following <var data-x="">starting point</var>, if any; or else null
+ <td>Let <var data-x="">candidate</var> be the last <span>suitable sequentially focusable area</span> in the <span>home sequential focus navigation order</span> preceding <var data-x="">starting point</var>, if any; or else null
+
+ </table>
+
+ <p>A <dfn>suitable sequentially focusable area</dfn> is a <i>focusable area</i> whose <i>DOM
+ anchor</i> is not <span>inert</span> and that is in its <i>control group</i>'s <span>sequential
+ focus navigation order</span>.</p>
+
+ <p>The <dfn>primary control group</dfn> of a <span>control group owner object</span> <var
+ data-x="">X</var> is the <i>control group</i> of <var data-x="">X</var> if <var
+ data-x="">X</var> has no <span>dialog group</span> or if its <span>dialog group</span> has no
+ designated <span>focused dialog of the dialog group</span>, otherwise, it is the <span>primary
+ control group</span> of <var data-x="">X</var>'s <span>dialog group</span>'s designated
+ <span>focused dialog of the dialog group</span>.</p>
+
+ <p>The <dfn>home control group</dfn> is the <i>control group</i> to which <var
+ data-x="">starting point</var> belongs.</p>
+
+ <p>The <dfn>home sequential focus navigation order</dfn> is the <span>sequential focus
+ navigation order</span> to which <var data-x="">starting point</var> belongs.</p>
+
+ <p class="note">The <span>home sequential focus navigation order</span> is the <span>home
+ control group</span>'s <span>sequential focus navigation order</span>, but is only used when the
+ <var data-x="">starting point</var> is in that <span>sequential focus navigation order</span>
+ (when it's not, <var data-x="">selection mechanism</var> will be <i>DOM</i>).</p>
+
+ </li>
+
+ <li>
+
+ <p>If <var data-x="">candidate</var> is a <span>browsing context container</span>, then let <var
+ data-x="">new candidate</var> be the result of running the <span>sequential navigation search
+ algorithm</span> with <var data-x="">candidate</var>'s <span>nested browsing context</span> as
+ the first argument, <var data-x="">direction</var> as the second, and <i>sequential</i> <!--
+ shift-tab from the end in http://software.hixie.ch/utilities/js/live-dom-viewer/saved/2855 -->
+ as the third.</p>
+
+ <p>If <var data-x="">new candidate</var> is null, then let <var data-x="">starting point</var>
+ be <var data-x="">candidate</var>, and return to the top of this algorithm. Otherwise, let <var
+ data-x="">candidate</var> be <var data-x="">new candidate</var>.</p>
+
+ </li>
+
+ <li><p>Return <var data-x="">candidate</var>.</p></li>
+
+ </ol>
+
</div>
More information about the Commit-Watchers
mailing list