[cssom] Make setProperty do what dbaron wants. Introduce setPropertyValue and setPropertyPriority. https://www.w3.org/Bugs/Public/show_bug.cgi?id=23066

Author: Simon Pieters

cssom/Overview.html

@@ -16,7 +16,7 @@
  <h1>CSS Object Model (CSSOM)</h1>
 
 
- <h2 class="no-num no-toc" id="w3c-doctype">Editor's Draft 5 September 2013</h2>
+ <h2 class="no-num no-toc" id="w3c-doctype">Editor's Draft 11 September 2013</h2>
 
  <dl>
 
@@ -90,7 +90,7 @@ <h2 class="no-num no-toc" id="sotd">Status of This Document</h2>
 can be found in the
 <a href="http://www.w3.org/TR/">W3C technical reports index at http://www.w3.org/TR/.</a></em>
 
-<p class="dontpublish">This is the 5 September 2013 Editor's Draft of CSSOM. Please send comments to
+<p class="dontpublish">This is the 11 September 2013 Editor's Draft of CSSOM. Please send comments to
 <a href="mailto:www-style@w3.org?subject=%5Bcssom%5D%20">www-style@w3.org</a>
 (<a href="http://lists.w3.org/Archives/Public/www-style/">archived</a>)
 with <samp>[cssom]</samp> at the start of the subject line.
@@ -2256,7 +2256,7 @@ <h3 id="css-declaration-blocks"><span class="secno">6.6 </span>CSS Declaration B
    <li><p>If <var>property</var> maps to one or more shorthand properties, let <var>shorthands</var> be an array of those shorthand properties, in 
    <a href="#concept-shorthands-preferred-order" title="concept-shorthands-preferred-order">preferred order</a>, and follow these substeps:
     <ol>
-     <li><p>Let <var>longhands</var> an array consisting of all <a href="#css-declaration" title="CSS declaration">CSS declarations</a> in <var>declaration block</var>'s
+     <li><p>Let <var>longhands</var> be an array consisting of all <a href="#css-declaration" title="CSS declaration">CSS declarations</a> in <var>declaration block</var>'s
      <a href="#concept-css-declaration-block-declarations" title="concept-css-declaration-block-declarations">declarations</a> that that are not in <var>already serialized</var> and have a
      <a href="#concept-css-declaration-property-name" title="concept-css-declaration-property-name">property name</a> that
      maps to one of the shorthand properties in <var>shorthands</var>.
@@ -2327,7 +2327,9 @@ <h4 id="the-cssstyledeclaration-interface"><span class="secno">6.6.1 </span>The
   DOMString <a href="#dom-cssstyledeclaration-getpropertyvalue" title="dom-CSSStyleDeclaration-getPropertyValue">getPropertyValue</a>(DOMString property);
   DOMString <a href="#dom-cssstyledeclaration-getpropertypriority" title="dom-CSSStyleDeclaration-getPropertyPriority">getPropertyPriority</a>(DOMString property);
   void <a href="#dom-cssstyledeclaration-setproperty" title="dom-CSSStyleDeclaration-setProperty">setProperty</a>(DOMString property, [TreatNullAs=EmptyString] DOMString value, <!--
-  -->[TreatNullAs=EmptyString] optional DOMString priority);
+  -->[TreatNullAs=EmptyString] optional DOMString priority = "");
+  void <a href="#dom-cssstyledeclaration-setpropertyvalue" title="dom-CSSStyleDeclaration-setPropertyValue">setPropertyValue</a>(DOMString property, [TreatNullAs=EmptyString] DOMString value);
+  void <a href="#dom-cssstyledeclaration-setpropertypriority" title="dom-CSSStyleDeclaration-setPropertyPriority">setPropertyPriority</a>(DOMString property, [TreatNullAs=EmptyString] DOMString priority);
   DOMString <a href="#dom-cssstyledeclaration-removeproperty" title="dom-CSSStyleDeclaration-removeProperty">removeProperty</a>(DOMString property);
   readonly attribute <a href="#cssrule">CSSRule</a>? <a href="#dom-cssstyledeclaration-parentrule" title="dom-CSSStyleDeclaration-parentRule">parentRule</a>;
            attribute DOMString <a href="#dom-cssstyledeclaration-cssfloat" title="dom-CSSStyleDeclaration-cssFloat">cssFloat</a>;<!-- setProperty's value arg has [TreatNullAs=EmptyString] -->
@@ -2411,35 +2413,97 @@ <h4 id="the-cssstyledeclaration-interface"><span class="secno">6.6.1 </span>The
  algorithm.</li>
  <li><p>If <var>value</var> is the empty string, invoke <code title="dom-CSSStyleDeclaration-removeProperty"><a href="#dom-cssstyledeclaration-removeproperty">removeProperty()</a></code>
  with <var>property</var> as argument and terminate this algorithm.</li>
- <li><p>If <var>priority</var> is not specified, let <var>priority action</var> be "leave as is". Otherwise, if <var>priority</var> is the empty string, let
- <var>priority action</var> be "unset important". Otherwise, if <var>priority</var> is an <a class="external" data-anolis-spec="dom" href="http://dom.spec.whatwg.org/#ascii-case-insensitive">ASCII case-insensitive</a> match for the
- string "<code title="">important</code>", set <var>priority action</var> to "set important". Otherwise, terminate this algorithm.
+ <li><p>If <var>priority</var> is not the empty string and is not an <a class="external" data-anolis-spec="dom" href="http://dom.spec.whatwg.org/#ascii-case-insensitive">ASCII case-insensitive</a> match for the string
+ "<code title="">important</code>", terminate this algorithm.
  <li>
   <p>Let <var>component value list</var> be the result of <a href="#parse-a-css-value" title="parse a CSS value">parsing</a> <var>value</var>.
   <p class="note"><var>value</var> can not include "<code title="">!important</code>".</p>
  </li>
  <li><p>If <var>component value list</var> is null terminate these steps.
  <li><p>If <var>property</var> is a shorthand property, then for each longhand property <var>longhand</var> that <var>property</var> maps to, in canonical
- order, <a href="#set-a-css-property" title="set a CSS property">set the CSS property</a> <var>longhand</var> to the appropriate value(s) from <var>component value list</var>, with
- <i>priority action</i> being <var>priority action</var>, and with the list of declarations being the
+ order, <a href="#append-a-css-declaration" title="append a CSS declaration">append the CSS declaration</a> <var>longhand</var> with the appropriate value(s) from <var>component value
+ list</var>, with the <i>important</i> flag set if <var>priority</var> is not the empty string, and unset otherwise, and with the list of declarations being the
  <a href="#concept-css-declaration-block-declarations" title="concept-css-declaration-block-declarations">declarations</a>.
- <li><p>Otherwise, <a href="#set-a-css-property" title="set a CSS property">set the CSS property</a> <var>property</var> to <var>component value list</var>, with
- <i>priority action</i> being <var>priority action</var>, and with the list of declarations being the
+ <li><p>Otherwise, <a href="#append-a-css-declaration" title="append a CSS declaration">append the CSS declaration</a> <var>property</var> with value <var>component value list</var>, with
+ the <i>important</i> flag set if <var>priority</var> is not the empty string, and unset otherwise, and with the list of declarations being the
  <a href="#concept-css-declaration-block-declarations" title="concept-css-declaration-block-declarations">declarations</a>.
 </ol>
 
-<p>To <dfn id="set-a-css-property">set a CSS property</dfn> <var>property</var> to a value <var>component value list</var> and with <i>priority action</i> being either "set
-important", "unset important" or "leave as is", in a list of declarations <var>declarations</var>, follow these steps:
+<p>To <dfn id="append-a-css-declaration">append a CSS declaration</dfn> <var>property</var> with a value <var>component value list</var> and optionally with an <i>important</i> flag set, in
+a list of declarations <var>declarations</var>, follow these steps:
 
 <ol>
  <li><p>If <var>property</var> is a <a class="external" data-anolis-spec="dom" href="http://dom.spec.whatwg.org/#case-sensitive">case-sensitive</a> match for a <a href="#concept-css-declaration-property-name" title="concept-css-declaration-property-name">property
  name</a> of a <a href="#css-declaration">CSS declaration</a> in <var>declarations</var>, let <var>declaration</var> be that <a href="#css-declaration">CSS declaration</a>.
  <li><p>Otherwise, append a new <a href="#css-declaration">CSS declaration</a> with the <a href="#concept-css-declaration-property-name" title="concept-css-declaration-property-name">property name</a> <var>property</var>
  to <var>declarations</var> and let <var>declaration</var> be that <a href="#css-declaration">CSS declaration</a>.
+ <li><p>If <var>declaration</var> has its <a href="#concept-css-declaration-important-flag" title="concept-css-declaration-important-flag">important flag</a> set and the <i>important</i> flag is not set,
+ terminate these steps.
  <li><p>Set <var>declaration</var>'s <a href="#concept-css-declaration-value" title="concept-css-declaration-value">value</a> to <var>component value list</var>.
- <li><p>If <i>priority action</i> is "set important", set <var>declaration</var>'s <a href="#concept-css-declaration-important-flag" title="concept-css-declaration-important-flag">important flag</a>.
- <li><p>Otherwise, if <i>priority action</i> is "unset important", unset <var>declaration</var>'s <a href="#concept-css-declaration-important-flag" title="concept-css-declaration-important-flag">important
- flag</a>.
+ <li><p>If the <i>important</i> flag is set, set <var>declaration</var>'s <a href="#concept-css-declaration-important-flag" title="concept-css-declaration-important-flag">important flag</a>.
+</ol>
+
+<p>The <dfn id="dom-cssstyledeclaration-setpropertyvalue" title="dom-CSSStyleDeclaration-setPropertyValue"><code>setPropertyValue(<var>property</var>, <var>value</var>)</code></dfn> method must run these
+steps:</p>
+<ol>
+ <li><p>If the <a href="#concept-css-declaration-block-readonly-flag" title="concept-css-declaration-block-readonly-flag">readonly flag</a> is set, <a class="external" data-anolis-spec="dom" href="http://dom.spec.whatwg.org/#concept-throw" title="concept-throw">throw</a>
+ a <code class="external" data-anolis-spec="dom"><a href="http://dom.spec.whatwg.org/#nomodificationallowederror">NoModificationAllowedError</a></code> exception and terminate these steps.</li>
+ <li><p>Let <var>property</var> be <var>property</var> <a class="external" data-anolis-spec="dom" href="http://dom.spec.whatwg.org/#converted-to-ascii-lowercase">converted to ASCII lowercase</a>.
+ <li><p>If <var>property</var> is not a <a class="external" data-anolis-spec="dom" href="http://dom.spec.whatwg.org/#case-sensitive">case-sensitive</a> match for a <a href="#supported-css-property">supported CSS property</a>, terminate this
+ algorithm.</li>
+ <li><p>If <var>value</var> is the empty string, invoke <code title="dom-CSSStyleDeclaration-removeProperty"><a href="#dom-cssstyledeclaration-removeproperty">removeProperty()</a></code>
+ with <var>property</var> as argument and terminate this algorithm.</li>
+ <li>
+  <p>Let <var>component value list</var> be the result of <a href="#parse-a-css-value" title="parse a CSS value">parsing</a> <var>value</var>.
+  <p class="note"><var>value</var> can not include "<code title="">!important</code>".</p>
+ </li>
+ <li><p>If <var>component value list</var> is null terminate these steps.
+ <li><p>If <var>property</var> is a shorthand property, then for each longhand property <var>longhand</var> that <var>property</var> maps to, in canonical
+ order, <a href="#set-a-css-declaration-value" title="set a CSS declaration value">set the CSS declaration value</a> <var>longhand</var> to the appropriate value(s) from <var>component
+ value list</var>, and with the list of declarations being the <a href="#concept-css-declaration-block-declarations" title="concept-css-declaration-block-declarations">declarations</a>.
+ <li><p>Otherwise, <a href="#set-a-css-declaration-value" title="set a CSS declaration value">set the CSS declaration value</a> <var>property</var> to the value <var>component value
+ list</var>, and with the list of declarations being the <a href="#concept-css-declaration-block-declarations" title="concept-css-declaration-block-declarations">declarations</a>.
+</ol>
+
+<p>To <dfn id="set-a-css-declaration-value">set a CSS declaration value</dfn> to a value <var>component value list</var> in a list of declarations <var>declarations</var>, follow these steps:
+
+<ol>
+ <li><p>If <var>property</var> is a <a class="external" data-anolis-spec="dom" href="http://dom.spec.whatwg.org/#case-sensitive">case-sensitive</a> match for a <a href="#concept-css-declaration-property-name" title="concept-css-declaration-property-name">property
+ name</a> of a <a href="#css-declaration">CSS declaration</a> in <var>declarations</var>, let <var>declaration</var> be that <a href="#css-declaration">CSS declaration</a>.
+ <li><p>Otherwise, append a new <a href="#css-declaration">CSS declaration</a> with the <a href="#concept-css-declaration-property-name" title="concept-css-declaration-property-name">property name</a> <var>property</var>
+ to <var>declarations</var> and let <var>declaration</var> be that <a href="#css-declaration">CSS declaration</a>.
+ <li><p>Set <var>declaration</var>'s <a href="#concept-css-declaration-value" title="concept-css-declaration-value">value</a> to <var>component value list</var>.
+</ol>
+
+<p>The <dfn id="dom-cssstyledeclaration-setpropertypriority" title="dom-CSSStyleDeclaration-setPropertyPriority"><code>setPropertyPriority(<var>property</var>, <var>priority</var>)</code></dfn> method must run
+these steps:</p>
+
+<ol>
+ <li><p>If the <a href="#concept-css-declaration-block-readonly-flag" title="concept-css-declaration-block-readonly-flag">readonly flag</a> is set, <a class="external" data-anolis-spec="dom" href="http://dom.spec.whatwg.org/#concept-throw" title="concept-throw">throw</a>
+ a <code class="external" data-anolis-spec="dom"><a href="http://dom.spec.whatwg.org/#nomodificationallowederror">NoModificationAllowedError</a></code> exception and terminate these steps.</li>
+ <li><p>Let <var>property</var> be <var>property</var> <a class="external" data-anolis-spec="dom" href="http://dom.spec.whatwg.org/#converted-to-ascii-lowercase">converted to ASCII lowercase</a>.
+ <li><p>If <var>property</var> is not a <a class="external" data-anolis-spec="dom" href="http://dom.spec.whatwg.org/#case-sensitive">case-sensitive</a> match for a <a href="#supported-css-property">supported CSS property</a>, terminate this
+ algorithm.</li>
+ <li><p>If <var>priority</var> is not the empty string and is not an <a class="external" data-anolis-spec="dom" href="http://dom.spec.whatwg.org/#ascii-case-insensitive">ASCII case-insensitive</a> match for the string
+ "<code title="">important</code>", terminate this algorithm.
+ <li><p>If <var>property</var> is a shorthand property, then for each longhand property <var>longhand</var> that <var>property</var> maps to, in canonical
+ order, <a href="#set-a-css-declaration-priority" title="set a CSS declaration priority">set the CSS declaration priority</a> <var>longhand</var> with the <i>important</i> flag set if
+ <var>priority</var> is not the empty string, and unset otherwise, and with the list of declarations being the
+ <a href="#concept-css-declaration-block-declarations" title="concept-css-declaration-block-declarations">declarations</a>.
+ <li><p>Otherwise, <a href="#set-a-css-declaration-priority" title="set a CSS declaration priority">set the CSS declaration priority</a> <var>property</var> with the <i>important</i> flag set
+ if <var>priority</var> is not the empty string, and unset otherwise, and with the list of declarations being the
+ <a href="#concept-css-declaration-block-declarations" title="concept-css-declaration-block-declarations">declarations</a>.
+</ol>
+
+<p>To <dfn id="set-a-css-declaration-priority">set a CSS declaration priority</dfn> <var>property</var> optionally with an <i>important</i> flag set, in a list of declarations
+<var>declarations</var>, follow these steps:
+
+<ol>
+ <li><p>If <var>property</var> is a <a class="external" data-anolis-spec="dom" href="http://dom.spec.whatwg.org/#case-sensitive">case-sensitive</a> match for a <a href="#concept-css-declaration-property-name" title="concept-css-declaration-property-name">property
+ name</a> of a <a href="#css-declaration">CSS declaration</a> in <var>declarations</var>, let <var>declaration</var> be that <a href="#css-declaration">CSS declaration</a>.
+ <li><p>Otherwise, terminate these steps.
+ <li><p>If the <i>important</i> flag is set, set <var>declaration</var>'s <a href="#concept-css-declaration-important-flag" title="concept-css-declaration-important-flag">important flag</a>. Otherwise,
+ unset <var>declaration</var>'s <a href="#concept-css-declaration-important-flag" title="concept-css-declaration-important-flag">important flag</a>.
 </ol>
 
 <p>The <dfn id="dom-cssstyledeclaration-removeproperty" title="dom-CSSStyleDeclaration-removeProperty"><code>removeProperty(<var>property</var>)</code></dfn> method must run these steps:</p>