Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
[] (0) WF2: Revamp of activation behavior definitions and related det…
…ails.

git-svn-id: http://svn.whatwg.org/webapps@2272 340c8d12-0b0e-0410-8428-c7bf67bfef74
  • Loading branch information
Hixie committed Oct 3, 2008
1 parent db27fe4 commit 27daf51
Show file tree
Hide file tree
Showing 2 changed files with 230 additions and 150 deletions.
184 changes: 111 additions & 73 deletions index
Expand Up @@ -16,7 +16,7 @@
<div class=head>
<p><a class=logo href=http://www.whatwg.org/ rel=home><img alt=WHATWG src=/images/logo></a></p>
<h1>HTML 5</h1>
<h2 class="no-num no-toc" id=draft-recommendation-&mdash;-date:-01-jan-1901>Draft Recommendation &mdash; 2 October 2008</h2>
<h2 class="no-num no-toc" id=draft-recommendation-&mdash;-date:-01-jan-1901>Draft Recommendation &mdash; 3 October 2008</h2>
<p>You can take part in this work. <a href=http://www.whatwg.org/mailing-list>Join the working group's discussion list.</a></p>
<p><strong>Web designers!</strong> We have a <a href=http://blog.whatwg.org/faq/>FAQ</a>, a <a href=http://forums.whatwg.org/>forum</a>, and a <a href=http://www.whatwg.org/mailing-list#help>help mailing list</a> for you!</p>
<dl><dt>Multiple-page version:</dt>
Expand Down Expand Up @@ -1863,11 +1863,6 @@
<p>The interface <dfn id=domtimestamp><code>DOMTimeStamp</code></dfn> is defined in
DOM3 Core. <a href=#refsDOM3CORE>[DOM3CORE]</a></p>

<p>The term <dfn id=activation-behavior>activation behavior</dfn> is used as defined in the
DOM3 Events specification. <a href=#refsDOM3EVENTS>[DOM3EVENTS]</a> <span class=XXX>At
the time of writing, DOM3 Events hadn't yet been updated to define
that phrase.</span></p>

<p id=alternate-style-sheets>The rules for handling alternative
style sheets are defined in the CSS object model specification. <a href=#refsCSSOM>[CSSOM]</a></p>

Expand Down Expand Up @@ -6666,13 +6661,6 @@ background: transparent"&gt;blue&lt;/span&gt;.&lt;/p&gt;</pre>

<h5 id=interactive-content><span class=secno>3.4.1.7 </span>Interactive content</h5>

<!-- Don't change the above <dfn> or the text below without checking
all cross-references. Some of them refer specifically to the
activation behavior stuff. -->

<p class=XXX>Parts of this section should eventually be
moved to DOM3 Events.</p> <!-- but see comment above -->

<!--
TESTS:
http://software.hixie.ch/utilities/js/live-dom-viewer/?%3C%21DOCTYPE%20html%3E%0A%3Cp%20tabindex%3D1%3Etest%20%3Ca%20href%3D%22%22%3E%20%3Cem%3Etest%3C/em%3E%20%3C/a%3E%0A%3Cscript%3E%0A%20function%20test%20%28e%29%20%7B%20w%28e.type%20+%20%27%20on%20%27%20+%20e.target.tagName%20+%20%27%20through%20%27%20+%20e.currentTarget.tagName%29%3B%20%7D%0A%20document.getElementsByTagName%28%27a%27%29%5B0%5D.addEventListener%28%27click%27%2C%20test%2C%20false%29%3B%0A%20document.getElementsByTagName%28%27a%27%29%5B0%5D.addEventListener%28%27DOMActivate%27%2C%20test%2C%20false%29%3B%0A%20document.getElementsByTagName%28%27p%27%29%5B0%5D.addEventListener%28%27click%27%2C%20test%2C%20false%29%3B%0A%20document.getElementsByTagName%28%27p%27%29%5B0%5D.addEventListener%28%27DOMActivate%27%2C%20test%2C%20false%29%3B%0A%3C/script%3E%0A
Expand All @@ -6684,37 +6672,90 @@ http://software.hixie.ch/utilities/js/live-dom-viewer/?%3C%21DOCTYPE%20HTML%3E%0
<p><dfn id=interactive-content-0>Interactive content</dfn> is content that is specifically
intended for user interaction.</p>

<p>Certain elements in HTML can be activated, for instance
<code><a href=#the-a-element>a</a></code> elements, <code><a href=#the-button-element>button</a></code> elements, or
<code><a href=#the-input-element>input</a></code> elements when their <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#radio-button-state title=attr-input-type-radio>Radio Button</a> state. Activation
of those elements can happen in various (UA-defined) ways, for
instance via the mouse or keyboard.</p>

<p>When activation is performed via some method other than clicking
the pointing device, the default action of the event that triggers
the activation must, instead of being activating the element
directly, be to <a href=#fire-a-click-event>fire a <code title="">click</code>
event</a> on the same element.</p>

<p>The default action of this <code title=event-click>click</code>
event, or of the real <code title=event-click>click</code> event
if the element was activated by clicking a pointing device, must be
to <span title="fire a DOMActivate event">fire a further <code title=event-DOMActivate>DOMActivate</code> event</span> at the
same element, whose own default action is to go through all the
elements the <code title=event-DOMActivate>DOMActivate</code>
event bubbled through (starting at the target node and going towards
the <code>Document</code> node), looking for an element with an
<a href=#activation-behavior>activation behavior</a>; the first element, in reverse tree
order, to have one, must have its activation behavior executed.</p>

<p class=note>The above doesn't happen for arbitrary synthetic
<p>Certain elements in HTML have an <a href=#activation-behavior>activation
behavior</a>, which means the user agent should allow the user to
manually trigger them in some way, for instance using keyboard or
voice input (though not mouse clicks, which are handled above). When
the user triggers an element with a defined <a href=#activation-behavior>activation
behavior</a>, the default action of the interaction event<!-- XXX
--> must be to <a href=#run-synthetic-click-activation-steps>run synthetic click activation steps</a> on
the element.</p>

<p>When a user agent is to <dfn id=run-synthetic-click-activation-steps>run synthetic click activation
steps</dfn> on an element, the user agent must <a href=#run-pre-click-activation-steps>run pre-click
activation steps</a> on the element, then <a href=#fire-a-click-event>fire a <code title=event-click>click</code> event</a> at the element. The
default action of this <span title=event-click>click</span> event
must be to <a href=#run-post-click-activation-steps>run post-click activation steps</a> on the
element. If the event is canceled, the user agent must <a href=#run-canceled-activation-steps>run
canceled activation steps</a> on the element instead.</p>

<p>Given an element <var title="">target</var>, the <dfn id=nearest-activatable-element>nearest
activatable element</dfn> is the element returned by the following
algorithm:</p>

<ol><li><p>If <var title="">target</var> has a defined <a href=#activation-behavior>activation
behavior</a>, then return <var title="">target</var> and abort
these steps.</li>

<li><p>If <var title="">target</var> has a parent element, then set
<var title="">target</var> to that parent element and return to the
first step.</li>

<li><p>Otherwise, there is no <a href=#nearest-activatable-element>nearest activatable
element</a>.</li>

</ol><p>When a pointing device is clicked, the user agent must run these
steps:</p>

<ol><li><p>Let <var title="">e</var> be the <span title="">nearest
activatable element</span> of the element designated by the user,
if any.</li>

<li><p>If there is an element <var title="">e</var>, <a href=#run-pre-click-activation-steps>run
pre-click activation steps</a> on it.</li>

<li>

<p>Dispatching the required <code title=event-click>click</code>
event.</p>

<p class=XXX>Another specification presumably requires the
firing of the <span title=event-click>click</span> event?</p>

<p>If there is an element <var title="">e</var>, then the default
action of the <span title=event-click>click</span> event must be
to <a href=#run-post-click-activation-steps>run post-click activation steps</a> on element <var title="">e</var>.</p>

<p>If there is an element <var title="">e</var> but the event is
canceled, the user agent must <a href=#run-canceled-activation-steps>run canceled activation
steps</a> on element <var title="">e</var>.</p>

</li>

</ol><p class=note>The above doesn't happen for arbitrary synthetic
events dispatched by author script. However, the <code title=dom-click><a href=#dom-click>click()</a></code> method can be used to make it
happen programmatically.</p>

<p>For certain form controls, this process is complicated further by
<a href=http://www.whatwg.org/specs/web-forms/current-work/#the-click>changes
that must happen around the click event</a>. <a href=#refsWF2>[WF2]</a></p> <!-- XXX WF2: when this is merged into
this spec, update xrefs -->
<p>When a user agent is to <dfn id=run-post-click-activation-steps>run post-click activation
steps</dfn> on an element, the user agent must <a href=#fire-a-simple-event>fire a simple
event</a> called <code title=event-DOMActivate>DOMActivate</code> at that element. The
default action of this event must be to <a href=#run-final-activation-steps>run final activation
steps</a> on that element. If the event is canceled, the user
agent must <a href=#run-canceled-activation-steps>run canceled activation steps</a> on the element
instead.</p>

<p>When a user agent is to <dfn id=run-pre-click-activation-steps>run pre-click activation steps</dfn>
on an element, it must run the <dfn id=pre-click-activation-steps>pre-click activation steps</dfn>
defined for that element, if any.</p>

<p>When a user agent is to <dfn id=run-canceled-activation-steps>run canceled activation steps</dfn>
on an element, it must run the <dfn id=canceled-activation-steps>canceled activation steps</dfn>
defined for that element, if any.</p>

<p>When a user agent is to <dfn id=run-final-activation-steps>run final activation steps</dfn> on
an element, it must run the <dfn id=activation-behavior>activation behavior</dfn> defined
for that element. Activation behaviors can refer to the <code title=event-click>click</code> and <code title=event-DOMActivate>DOMActivate</code> events that were fired
by the steps above leading up to this point.</p>



Expand Down Expand Up @@ -11368,8 +11409,8 @@ first matching case):&lt;/p&gt;
<code>INVALID_ACCESS_ERR</code> exception and abort these
steps.</li>

<li><p>If the target of the <code title=event-DOMActivate>DOMActivate</code> event is an
<code><a href=#the-img-element>img</a></code> element with an <code title=attr-img-ismap><a href=#attr-img-ismap>ismap</a></code> attribute specified, then
<li><p>If the target of the <code title=event-click>click</code>
event is an <code><a href=#the-img-element>img</a></code> element with an <code title=attr-img-ismap><a href=#attr-img-ismap>ismap</a></code> attribute specified, then
server-side image map processing must be performed, as follows:</p>

<ol><!-- http://software.hixie.ch/utilities/js/live-dom-viewer/?%3C%21DOCTYPE%20html%3E%0A...%3Ca%20href%3D%22%23%22%3E%3Cimg%20ismap%20usemap%3D%22%23a%22%20src%3D/resources/images/smallcats%3E%3C/a%3E%0A%3Cmap%20name%3Da%3E%3Carea%20shape%3Drect%20coords%3D0%2C0%2C50%2C50%20href%3Db%3E%3C/map%3E --><li>If the <code title=event-DOMActivate>DOMActivate</code>
Expand All @@ -11394,12 +11435,7 @@ first matching case):&lt;/p&gt;
suffix</a></var>, then take that into account when following the
hyperlink.</li>

</ol><p class=note>One way that a user agent can enable users to follow
hyperlinks is by allowing <code><a href=#the-a-element>a</a></code> elements to be clicked, or
focussed and activated by the keyboard. This <a href=#interactive-content-0 title="interactive content">will cause</a> the aforementioned
<a href=#activation-behavior>activation behavior</a> to be invoked.</p>

<p>The DOM attributes <dfn id=dom-a-href title=dom-a-href><code>href</code></dfn>, <dfn id=dom-a-ping title=dom-a-ping><code>ping</code></dfn>, <dfn id=dom-a-target title=dom-a-target><code>target</code></dfn>, <dfn id=dom-a-rel title=dom-a-rel><code>rel</code></dfn>, <dfn id=dom-a-media title=dom-a-media><code>media</code></dfn>, <dfn id=dom-a-hreflang title=dom-a-hreflang><code>hreflang</code></dfn>, and <dfn id=dom-a-type title=dom-a-type><code>type</code></dfn>, must each
</ol><p>The DOM attributes <dfn id=dom-a-href title=dom-a-href><code>href</code></dfn>, <dfn id=dom-a-ping title=dom-a-ping><code>ping</code></dfn>, <dfn id=dom-a-target title=dom-a-target><code>target</code></dfn>, <dfn id=dom-a-rel title=dom-a-rel><code>rel</code></dfn>, <dfn id=dom-a-media title=dom-a-media><code>media</code></dfn>, <dfn id=dom-a-hreflang title=dom-a-hreflang><code>hreflang</code></dfn>, and <dfn id=dom-a-type title=dom-a-type><code>type</code></dfn>, must each
<a href=#reflect>reflect</a> the respective content attributes of the same
name.</p>

Expand Down Expand Up @@ -20578,12 +20614,7 @@ function AddCloud(data, x, y) { ... }</pre>
hyperlinks">follow the hyperlink</a> defined by the
<code><a href=#the-area-element>area</a></code> element, if any.</li>

</ol><p class=note>One way that a user agent can enable users to follow
hyperlinks is by allowing <code><a href=#the-area-element>area</a></code> elements to be clicked,
or focussed and activated by the keyboard. This <a href=#interactive-content-0 title="interactive content">will cause</a> the aforementioned
<a href=#activation-behavior>activation behavior</a> to be invoked.</p>

<p>The DOM attributes <dfn id=dom-area-alt title=dom-area-alt><code>alt</code></dfn>, <dfn id=dom-area-coords title=dom-area-coords><code>coords</code></dfn>, <dfn id=dom-area-href title=dom-area-href><code>href</code></dfn>, <dfn id=dom-area-target title=dom-area-target><code>target</code></dfn>, <dfn id=dom-area-ping title=dom-area-ping><code>ping</code></dfn>, <dfn id=dom-area-rel title=dom-area-rel><code>rel</code></dfn>, <dfn id=dom-area-media title=dom-area-media><code>media</code></dfn>, <dfn id=dom-area-hreflang title=dom-area-hreflang><code>hreflang</code></dfn>, and <dfn id=dom-area-type title=dom-area-type><code>type</code></dfn>, each must
</ol><p>The DOM attributes <dfn id=dom-area-alt title=dom-area-alt><code>alt</code></dfn>, <dfn id=dom-area-coords title=dom-area-coords><code>coords</code></dfn>, <dfn id=dom-area-href title=dom-area-href><code>href</code></dfn>, <dfn id=dom-area-target title=dom-area-target><code>target</code></dfn>, <dfn id=dom-area-ping title=dom-area-ping><code>ping</code></dfn>, <dfn id=dom-area-rel title=dom-area-rel><code>rel</code></dfn>, <dfn id=dom-area-media title=dom-area-media><code>media</code></dfn>, <dfn id=dom-area-hreflang title=dom-area-hreflang><code>hreflang</code></dfn>, and <dfn id=dom-area-type title=dom-area-type><code>type</code></dfn>, each must
<a href=#reflect>reflect</a> the respective content attributes of the same
name.</p>

Expand Down Expand Up @@ -22832,6 +22863,26 @@ function AddCloud(data, x, y) { ... }</pre>
descendant in <a href=#tree-order>tree order</a> is the <code><a href=#the-label-element>label</a></code>
element's <a href=#labeled-control>labeled control</a>.</p>

<p>The <code><a href=#the-label-element>label</a></code> element's exact default presentation and
behavior, in particular what its <a href=#activation-behavior>activation behavior</a>
might be, if anything, should match the platform's label
behavior.</p>

<div class=example>

<p>For example, on platforms where clicking a checkbox label checks
the checkbox, clicking the <code><a href=#the-label-element>label</a></code> in the following
snippet could trigger the user agent to <span>run synthetic click
activation steps on the <code><a href=#the-input-element>input</a></code> element, as if
the element itself had been triggered by the user:</span></p>

<pre>&lt;label&gt;&lt;input type=checkbox name=lost&gt; Lost&lt;/label&gt;</pre>

<p>On other platforms, the behavior might be just to focus the
control, or do nothing.</p>

</div>

<p>The <code title=attr-fae-form><a href=#attr-fae-form>form</a></code> attribute is used to
explicitly associate the <code><a href=#the-label-element>label</a></code> element with its
<a href=#form-owner>form owner</a>.</p>
Expand All @@ -22852,14 +22903,6 @@ function AddCloud(data, x, y) { ... }</pre>
form-associated elements</span>, on getting, must return that
<code>NodeList</code> object.</p>

<!-- The label element's exact default presentation and behaviour
should match the platform's label behaviour. For example, on
platforms where clicking a checkbox label checks the checkbox,
clicking a label element should cause a click event to be
synthesised and fired at the checkbox. XXX should define activation
behaviour here; clicking on nested link? nested label? label when it
has a checkbox? etc -->


<h4 id=the-input-element><span class=secno>4.10.4 </span>The <dfn><code>input</code></dfn> element</h4>

Expand Down Expand Up @@ -37915,16 +37958,11 @@ at the first element with the given ID must be treated as if it was cloned and r

<h3 id=activation><span class=secno>6.3 </span>Activation</h3>

<p>The <dfn id=dom-click title=dom-click>click()</dfn> method must <a href=#fire-a-click-event>fire a
<code>click</code> event</a> at the element, whose default action
is the <span title="fire a DOMActivate event">firing of a further
<code title=event-DOMActivate>DOMActivate</code> event</span> at
the same element, whose own default action is to go through all the
elements the <code title=event-DOMActivate>DOMActivate</code>
event bubbled through (starting at the target node and going towards
the <code>Document</code> node), looking for an element with an
<a href=#activation-behavior>activation behavior</a>; the first element, in reverse tree
order, to have one, must have its activation behavior executed.</p>
<p>The <dfn id=dom-click title=dom-click>click()</dfn> method must, if the
element has a defined <a href=#activation-behavior>activation behavior</a>, <a href=#run-synthetic-click-activation-steps>run
synthetic click activation steps</a> on the element. Otherwise,
the user agent must <a href=#fire-a-click-event>fire a <code>click</code> event</a> at
the element.</p>



Expand Down

0 comments on commit 27daf51

Please sign in to comment.