HTML Standard Tracker

Filter

File a bug

SVNBugCommentTime (UTC)
39287404[Gecko] [Opera] [Webkit] Make <canvas> descendants focusable to enable keyboard accessibility.2009-09-21 10:40
@@ -26060,21 +26060,21 @@ interface <dfn>CueRangeCallback</dfn> {
            attribute unsigned long <span title="dom-canvas-width">width</span>;
            attribute unsigned long <span title="dom-canvas-height">height</span>;
 
   DOMString <span title="dom-canvas-toDataURL">toDataURL</span>(optional in DOMString type, in any... args);
 
   Object <span title="dom-canvas-getContext">getContext</span>(in DOMString contextId);
 };</pre>
    </dd>
   </dl>
 
-  <p>The <code>canvas</code> element <span>represents</span> a
+  <p>The <code>canvas</code> element provides scripts with a
   resolution-dependent bitmap canvas, which can be used for rendering
   graphs, game graphics, or other visual images on the fly.</p>
 
   <p>Authors should not use the <code>canvas</code> element in a
   document when a more suitable element is available. For example, it
   is inappropriate to use a <code>canvas</code> element to render a
   page heading: if the desired presentation of the heading is
   graphically intense, it should be marked up using appropriate
   elements (typically <code>h1</code>) and then styled using CSS and
   supporting technologies such as XBL.</p>
@@ -26082,35 +26082,46 @@ interface <dfn>CueRangeCallback</dfn> {
   <p>When authors use the <code>canvas</code> element, they must also
   provide content that, when presented to the user, conveys
   essentially the same function or purpose as the bitmap canvas. This
   content may be placed as content of the <code>canvas</code>
   element. The contents of the <code>canvas</code> element, if any,
   are the element's <span>fallback content</span>.</p>
 
   <p>In interactive visual media, if <span
   title="concept-n-script">scripting is enabled</span> for the
   <code>canvas</code> element, the <code>canvas</code> element
-  represents an embedded element with a dynamically created image.</p>
+  <span>represents</span> <span>embedded content</span> consisting of
+  a dynamically created image.</p>
 
   <p>In non-interactive, static, visual media, if the
   <code>canvas</code> element has been previously painted on (e.g. if
   the page was viewed in an interactive visual medium and is now being
   printed, or if some script that ran during the page layout process
   painted on the element), then the <code>canvas</code> element
-  represents <span>embedded content</span> with the current image and
-  size. Otherwise, the element represents its <span>fallback
-  content</span> instead.</p>
+  <span>represents</span> <span>embedded content</span> with the
+  current image and size. Otherwise, the element represents its
+  <span>fallback content</span> instead.</p>
 
   <p>In non-visual media, and in visual media if <span
   title="concept-n-noscript">scripting is disabled</span> for the
   <code>canvas</code> element, the <code>canvas</code> element
-  represents its <span>fallback content</span> instead.</p>
+  <span>represents</span> its <span>fallback content</span>
+  instead.</p>
+
+  <!-- CANVAS-FOCUS-FALLBACK -->
+  <p>When a <code>canvas</code> element <span>represents</span>
+  <span>embedded content</span>, the user can still focus descendants
+  of the <code>canvas</code> element (in the <span>fallback
+  content</span>). This allows authors to make an interactive canvas
+  keyboard-focusable: authors should have a one-to-one mapping of
+  interactive regions to focusable elements in the <span>fallback
+  content</span>.</p>
 
   <p>The <code>canvas</code> element has two attributes to control the
   size of the coordinate space: <dfn
   title="attr-canvas-width"><code>width</code></dfn> and <dfn
   title="attr-canvas-height"><code>height</code></dfn>. These
   attributes, when specified, must have values that are <span
   title="valid non-negative integer">valid non-negative
   integers</span>. <span class="impl">The <span>rules for parsing
   non-negative integers</span> must be used to obtain their numeric
   values. If an attribute is missing, or if parsing its value returns
@@ -66006,24 +66017,39 @@ interface <dfn>SQLTransactionSync</dfn> {
   <p>An element that is <span>specially focusable</span> but does not
   otherwise have an <span>activation behavior</span> defined has an
   <span>activation behavior</span> that does nothing.</p>
 
   <p class="note">This means that an element that is only focusable
   because of its <code title="attr-tabindex">tabindex</code> attribute
   will fire a <code title="event-click">click</code> event in response
   to a non-mouse activation (e.g. hitting the "enter" key while the
   element is focused).</p>
 
+  <p>The <dfn title="dom-tabIndex"><code>tabIndex</code></dfn> IDL
+  attribute must <span>reflect</span> the value of the <code
+  title="attr-tabindex">tabindex</code> content attribute. If the
+  attribute is not present, or parsing its value returns an error,
+  then the IDL attribute must return 0 for elements that are focusable
+  and &#x2212;1 for elements that are not focusable.</p>
+
+  </div>
+
+  <div class="impl">
+
+  <h4 id="focus-management">Focus management</h4>
+
   <p>An element is <dfn>focusable</dfn> if the user agent's default
   behavior allows it to be focusable or if the element is
-  <span>specially focusable</span>, but only if the element is
-  <span>being rendered</span>.</p>
+  <span>specially focusable</span>, but only if the element is either
+  <span>being rendered</span> or <!-- CANVAS-FOCUS-FALLBACK --> is a
+  descendant of a <code>canvas</code> element that
+  <span>represents</span> <span>embedded content</span>.</p>
 
   <p>User agents should make the following elements
   <span>focusable</span>, unless platform conventions dictate
   otherwise:</p>
 
   <ul>
 
    <li><code>a</code> elements that have an <code
    title="attr-hyperlink-href">href</code> attribute</li>
 
@@ -66053,33 +66079,21 @@ interface <dfn>SQLTransactionSync</dfn> {
    of a pointing device</li>
 
   </ul>
 
   <p>In addition, each shape that is generated for an
   <code>area</code> element should be <span>focusable</span>, unless
   platform conventions dictate otherwise. (A single <code>area</code>
   element can correspond to multiple shapes, since image maps can be
   reused with multiple images on a page.)</p>
 
-  <p>The <dfn title="dom-tabIndex"><code>tabIndex</code></dfn> IDL
-  attribute must <span>reflect</span> the value of the <code
-  title="attr-tabindex">tabindex</code> content attribute. If the
-  attribute is not present, or parsing its value returns an error,
-  then the IDL attribute must return 0 for elements that are focusable
-  and &#x2212;1 for elements that are not focusable.</p>
-
-  </div>
-
-
-  <div class="impl">
-
-  <h4 id="focus-management">Focus management</h4>
+  <hr>
 
   <p>The <dfn>focusing steps</dfn> are as follows:</p>
 
   <ol>
 
    <li><p>If focusing the element will remove the focus from another
    element, then run the <span>unfocusing steps</span> for that
    element.</p></li>
 
    <li>

|