Adding a DOM API for input protection.
--- a/user-interface-safety.html Sun Jun 24 21:04:57 2012 -0700
+++ b/user-interface-safety.html Sun Jul 01 20:16:50 2012 -0700
@@ -366,19 +366,19 @@
</pre>
<p>
A value of <code>block</code> indicates the user agent should not
- deliver the event to the resource if the click protection heuristic
- is triggered.
+ deliver the input event to the resource if the input protection
+ heuristic is triggered and a violation is detected.
</p>
<p>
A value of <code>report-only</code> indicates the user agent should
- deliver the event to the resource, even if the click protection
- heuristic is triggered. This directive-value lets servers experiment
- with policies by monitoring (rather than enforcing) a policy.
+ deliver the input event to the resource, even if a violation is
+ detected. This directive-value lets servers experiment with policies
+ by monitoring (rather than enforcing) a policy.
</p>
<p>
If the <code>report-uri</code> directive is present in the policy,
- triggering of the click protection heuristic MUST always generate a
- report, whether the event is blocked or not.
+ violations detected by the input protection heuristic MUST always
+ generate a report, whether the event is blocked or not.
</p>
<p>
User agents SHOULD NOT prompt the user when the input protection
@@ -398,7 +398,7 @@
</p>
<pre>
directive-name = "click-protection-hints"
-directive-value = ["element-id" = name] ["ui-height=" num-val] ["ui-width=" num-val] ["ui-delay=" num-val] <!-- ["tolerance=" num-val] -->
+directive-value = ["element-id" = name] ["ui-height=" num-val] ["ui-width=" num-val] ["ui-delay=" num-val] ["tolerance=" num-val]
</pre>
<p>
If the policy does not contain explicit
@@ -425,24 +425,62 @@
</p>
<p>
<code>ui-delay</code> is a numeric value that specifies the delay
- time, in milliseconds, used in the click protection heuristic.
+ time, in milliseconds, used in the input protection heuristic.
<em>TODO: delay after display, or delay after mouseover?</em>
</p>
<p>
+ <code>tolerance</code> is a numeric value from 0-99 that defines the
+ threshold at which the screenshot comparison procedure of the input
+ protection heuristic triggers a violation. A value of 0 indicates
+ that no difference between the two images is permitted. A value of
+ 99 provides little to no practical protection.
+ </p>
+ <p>
<em>TODO: add more options</em>
</p>
- <!-- <p>
- <code>tolerance</code> is a numeric value from 0-99 that defines the
- threshold at which the screenshot comparision procedure triggers the
- click protection heuristic. A value of 0 indicates that no
- difference between the two images is permitted. A value of 99
- provides little to no practical protection.
- </p> -->
</section>
</section>
-
<section>
- <h2>Click Protection Heuristic</h2>
+ <h2 id="sec-api">DOM interface</h2>
+ <p>
+ This specification introduces a new attribute for the
+ <code>UIEvent</code> interface introduced in DOM Level 2.
+ </p>
+ <section>
+ <h3><code>unsafe</code> attribute for the <code>UIEvent</code> interface</h3>
+ <dl>
+ <dt>
+ <code>unsafe</code> of type <span class="idlMemberType">boolean</span>, readonly
+ </dt>
+ <dd>
+ This is a non-configurable boolean property of input event
+ objects. The value <em class="rfc2119" title="should">should</em>
+ be "true" if a violation occurred. The value <em class="rfc2119"
+ title="should">should</em> not be set unless triggered by user
+ initiated actions.
+ </dd>
+ </dl>
+ <p>
+ The <code>unsafe</code> attribute allows web applications to monitor
+ and immediately respond to suspect violations, even in the
+ <code>report-only</code> mode. Applications may also use this
+ interface for capability detection. For example, a web application
+ may monitor user inputs on a payment button element like this:
+ </p>
+ <pre class="example">
+document.getElementById('payment-button').addEventListener("click", function(eventObj) {
+ if ("unsafe" in eventObj) {
+ if (eventObj.unsafe == true) {
+ return reportUnsafeOrShowDialog();
+ }
+ }
+ makePayment();
+};
+ </pre>
+ </section>
+ </section>
+ <section>
+ <h2>Input Protection Heuristic</h2>
<section class="informative">
<p>This section is non-normative. The algorithm described here can be implemented mostly in terms of
@@ -512,15 +550,15 @@
<li><strong>Obstruction check</strong> - By using an offscreen HTML 5 canvas element,
we take two reasonably sized (300x200 on average, but growing or shrinking depending
on document's inherent size and viewport constraints and hints provided by the
- <code>viewport-height</code> and <code>viewport-width</code> properties of <code>
- click-protection-hints</code>) screenshots of the region centered around the DOM
+ <code>ui-height</code> and <code>ui-width</code> properties of <code>
+ input-protection-hints</code>) screenshots of the region centered around the DOM
element which is about to receive the event: one from its owner document's
"point of view" (unobstructed by definition),
the other from the topmost window's. In the plugin content case, we ensure the former
"screenshot" contains the element itself only. If the number of the pixels which are
different between the screenshots don't exceed a certain configurable tolerance rate
(default 18%, or as set by the <code>tolerance</code> property of
- <code>click-protection-hints</code>), return. Otherwise we tentatively assume the
+ <code>input-protection-hints</code>), return. Otherwise we tentatively assume the
DOM element our user is interacting with has been obstructed or obscured by a
UI Redressing attempt.
@@ -539,7 +577,7 @@
<section>
<h2>Examples</h2>
-
+ <p><em>XXX TODO</em></p>
<section class="informative">
<h3>Sample Policy Definitions</h3>