Merge pull request #2269 from upsuper/cssom-style-attr

[cssom-1] Ensure inline style and corresponding declaration block ates each other properly

Author: upsuper

cssom-1/Overview.bs

@@ -1952,6 +1952,10 @@ the DOM a <a>CSS declaration block</a> is a
  <dt><dfn>owner node</dfn>
  <dd>The {{Element}} that the <a>CSS declaration block</a> is associated with, if any, or
  null otherwise.
+
+ <dt><dfn>updating flag</dfn>
+ <dd>Unset by default. Set when the <a>CSS declaration block</a> is updating
+ the <a for="CSSStyleDeclaration">owner node</a>'s <code>style</code> attribute.
 </dl>
 
 To <dfn>parse a CSS declaration block</dfn> from a string <var>string</var>, follow these steps:
@@ -2034,6 +2038,40 @@ Note: The serialization of an empty CSS declaration block is the empty string.
 Note: The serialization of a non-empty CSS declaration block does not include any surrounding whitespace, i.e., no whitespace appears
 before the first property name and no whitespace appears after the final semicolon delimiter that follows the last property value.
 
+A <a>CSS declaration block</a> has these <a>attribute change steps</a> for its <a for="CSSStyleDeclaration">owner node</a>:
+
+<ol>
+ <li>If the <a for="CSSStyleDeclaration">readonly flag</a> is set, terminate these steps.
+ <li>If the <a for="CSSStyleDeclaration">updating flag</a> is set, terminate these steps.
+ <li>If <var>localName</var> is not "<code>style</code>", or <var>namespace</var> is not null, terminate these steps.
+ <li>If <var>value</var> is null, empty the <a for="CSSStyleDeclaration">declarations</a>.
+ <li>Otherwise, let the <a for="CSSStyleDeclaration">declarations</a> be the result of <a>parse a CSS declaration block</a>
+ from a string <var>value</var>.
+</ol>
+
+When a <a>CSS declaration block</a> object is created, then:
+
+<ol>
+ <li>Let <var>owner node</var> be the <a for="CSSStyleDeclaration">owner node</a>.
+ <li>If <var>owner node</var> is null, or the <a for="CSSStyleDeclaration">readonly flag</a> is set, terminate these steps.
+ <li>Let <var>value</var> be the result of <a lt="get an attribute by namespace and local name">getting an attribute</a>
+ given null, "<code>style</code>", and <var>owner node</var>.
+ <li>If <var>value</var> is not null, let the <a for="CSSStyleDeclaration">declarations</a> be the result of
+ <a>parse a CSS declaration block</a> from a string <var>value</var>.
+</ol>
+
+To <dfn>update style attribute for</dfn> <var>declaration block</var> means to run the steps below:
+
+<ol>
+ <li>Assert: <var>declaration block</var>'s <a for="CSSStyleDeclaration">readonly flag</a> is unset.
+ <li>Let <var>owner node</var> be <var>declaration block</var>'s <a for="CSSStyleDeclaration">owner node</a>.
+ <li>If <var>owner node</var> is null, terminate these steps.
+ <li>Set <var>declaration block</var>'s <a for="CSSStyleDeclaration">updating flag</a>.
+ <li><a>Set an attribute value</a> for <var>owner node</var> using "<code>style</code>" and the result of
+ <a lt="serialize a CSS declaration block">serializing</a> <var>declaration block</var>.
+ <li>Unset <var>declaration block</var>'s <a for="CSSStyleDeclaration">updating flag</a>.
+</ol>
+
 The <dfn id=concept-shorthands-preferred-order>preferred order</dfn> of a list of shorthand properties <var>shorthands</var> is as follows:
 
 <ol>
@@ -2079,6 +2117,7 @@ Setting the {{CSSStyleDeclaration/cssText}} attribute must run these steps:
  <li>Empty the <a for="CSSStyleDeclaration">declarations</a>.
  <li><a lt="Parse a CSS declaration block">Parse</a> the given value and, if the return value is not the empty list, insert the items in the list
  into the <a for="CSSStyleDeclaration">declarations</a>, in <a>specified order</a>.
+ <li><a>Update style attribute for</a> the <a>CSS declaration block</a>.
 </ol>
 
 The <dfn attribute for=CSSStyleDeclaration>length</dfn> attribute must return the number of <a lt="CSS declaration">CSS
@@ -2164,6 +2203,7 @@ The <dfn method for=CSSStyleDeclaration>setProperty(<var>property</var>, <var>va
  <li>Otherwise, <a lt="set a CSS declaration">set 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 for="CSSStyleDeclaration">declarations</a>.
+ <li><a>Update style attribute for</a> the <a>CSS declaration block</a>.
 </ol>
 
 To <dfn>set 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
@@ -2202,6 +2242,7 @@ steps:
  value list</var>, and with the list of declarations being the <a for="CSSStyleDeclaration">declarations</a>.
  <li>Otherwise, <a lt="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 for="CSSStyleDeclaration">declarations</a>.
+ <li><a>Update style attribute for</a> the <a>CSS declaration block</a>.
 </ol>
 
 To <dfn>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:
@@ -2234,6 +2275,7 @@ these steps:
  <li>Otherwise, <a lt="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 for="CSSStyleDeclaration">declarations</a>.
+ <li><a>Update style attribute for</a> the <a>CSS declaration block</a>.
 </ol>
 
 To <dfn>set a CSS declaration priority</dfn> <var>property</var> optionally with an <i>important</i> flag set, in a list of declarations
@@ -2255,11 +2297,17 @@ The <dfn method for=CSSStyleDeclaration>removeProperty(<var>property</var>)</dfn
  let <var>property</var> be <var>property</var> <a lt="ASCII lowercase">converted to ASCII lowercase</a>.
  <li>Let <var>value</var> be the return value of invoking {{CSSStyleDeclaration/getPropertyValue()}}
  with <var>property</var> as argument.
- <li>If <var>property</var> is a shorthand property, for each longhand property <var>longhand</var> that <var>property</var> maps to, invoke
- {{CSSStyleDeclaration/removeProperty()}} with <var>longhand</var> as argument.
+ <li>Let <var>removed</var> be false.
+ <li>If <var>property</var> is a shorthand property, for each longhand property <var>longhand</var> that <var>property</var> maps to:
+  <ol>
+   <li>If <var>longhand</var> is not a <a for="CSS declaration">property name</a> of a <a>CSS declaration</a>
+   in the <a for="CSSStyleDeclaration">declarations</a>, <a for=iteration>continue</a>.
+   <li>Remove that <a>CSS declaration</a> and let <var>removed</var> be true.
+  </ol>
  <li>Otherwise, if <var>property</var> is a <a>case-sensitive</a> match for a
  <a for="CSS declaration">property name</a> of a <a>CSS declaration</a> in the
- <a for="CSSStyleDeclaration">declarations</a>, remove that <a>CSS declaration</a>.
+ <a for="CSSStyleDeclaration">declarations</a>, remove that <a>CSS declaration</a> and let <var>removed</var> be true.
+ <li>If <var>removed</var> is true, <a>Update style attribute for</a> the <a>CSS declaration block</a>.
  <li>Return <var>value</var>.
 </ol>
 
@@ -2678,24 +2726,9 @@ interface ElementCSSInlineStyle {
 };
 </pre>
 
-The <dfn attribute for=ElementCSSInlineStyle>style</dfn> attribute must return a live <a>CSS declaration block</a> with the following
-properties:
-<dl>
- <dt><a for="CSSStyleDeclaration">readonly flag</a>
- <dd>Unset.
- <dt><a for="CSSStyleDeclaration">declarations</a>
- <dd>The result of <a lt="Parse a CSS declaration block">parsing</a> the <code>style</code> content attribute, in
- <a>specified order</a>. If the <code>style</code> content attribute is absent, the object represents an
- empty list of <a>CSS declarations</a>. Mutating the <a for="CSSStyleDeclaration">declarations</a>
- must set the <code>style</code> content attribute on the <a>context object</a> to the
- <a lt="serialize a CSS declaration block">serialization</a> of the <a for="CSSStyleDeclaration">declarations</a>. If the
- <code>style</code> content attribute is set, changed or removed, the <a for="CSSStyleDeclaration">declarations</a> must be
- updated as appropriate.
- <dt><a for="CSSStyleDeclaration">parent CSS rule</a>
- <dd>Null.
- <dt><a for="CSSStyleDeclaration">owner node</a>
- <dd>The <a>context object</a>.
-</dl>
+The <dfn attribute for=ElementCSSInlineStyle>style</dfn> attribute must return a <a>CSS declaration block</a> object whose
+<a for="CSSStyleDeclaration">readonly flag</a> is unset, whose <a for="CSSStyleDeclaration">parent CSS rule</a> is null, and
+whose <a for="CSSStyleDeclaration">owner node</a> is the <a>context object</a>.
 
 If the user agent supports HTML, the following IDL applies: [[HTML]]