Skip to content

Commit 71f88df

Browse files
upsuperupsuper
committed
[cssom-1] Ensure inline style and corresponding declaration block updates each other properly.
This mostly follows how `DOMTokenList` works in the DOM spec, which has a similar situation that having a live object reflecting an attribute. This should fix #1559.
1 parent 7a5e0d7 commit 71f88df

1 file changed

Lines changed: 43 additions & 21 deletions

File tree

‎cssom-1/Overview.bs‎

Lines changed: 43 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -2034,6 +2034,27 @@ Note: The serialization of an empty CSS declaration block is the empty string.
20342034
Note: The serialization of a non-empty CSS declaration block does not include any surrounding whitespace, i.e., no whitespace appears
20352035
before the first property name and no whitespace appears after the final semicolon delimiter that follows the last property value.
20362036

2037+
A <a>CSS declaration block</a> has these <a>attribute change steps</a> for its <a for="CSSStyleDeclaration">owner node</a>:
2038+
2039+
<ol>
2040+
<li>If the <a for="CSSStyleDeclaration">readonly flag</a> is set, terminate these steps.
2041+
<li>If <var>localName</var> is not "<code>style</code>", or <var>namespace</var> is not null, terminate these steps.
2042+
<li>If <var>value</var> is null, empty the <a for="CSSStyleDeclaration">declarations</a>.
2043+
<li>Otherwise, let the <a for="CSSStyleDeclaration">declarations</a> be the result of <a>parse a CSS declaration block</a>
2044+
from a string <var>value</var>.
2045+
</ol>
2046+
2047+
When a <a>CSS declaration block</a> object is created, then:
2048+
2049+
<ol>
2050+
<li>Let <var>owner node</var> be the <a for="CSSStyleDeclaration">owner node</a>.
2051+
<li>If <var>owner node</var> is null, or the <a for="CSSStyleDeclaration">readonly flag</a> is set, terminate these steps.
2052+
<li>Let <var>value</var> be the result of <a lt="get an attribute by namespace and local name">getting an attribute</a>
2053+
given null, "<code>style</code>", and <var>owner node</var>.
2054+
<li>If <var>value</var> is not null, let the <a for="CSSStyleDeclaration">declarations</a> be the result of
2055+
<a>parse a CSS declaration block</a> from a string <var>value</var>.
2056+
</ol>
2057+
20372058
The <dfn id=concept-shorthands-preferred-order>preferred order</dfn> of a list of shorthand properties <var>shorthands</var> is as follows:
20382059

20392060
<ol>
@@ -2079,6 +2100,8 @@ Setting the {{CSSStyleDeclaration/cssText}} attribute must run these steps:
20792100
<li>Empty the <a for="CSSStyleDeclaration">declarations</a>.
20802101
<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
20812102
into the <a for="CSSStyleDeclaration">declarations</a>, in <a>specified order</a>.
2103+
<li>If the <a for="CSSStyleDeclaration">owner node</a> is not null, <a>set an attribute value</a> for <a for="CSSStyleDeclaration">owner node</a>
2104+
using "<code>style</code>" and the result of <a lt="serialize a CSS declaration block">serializing</a> the <a for="CSSStyleDeclaration">declarations</a>.
20822105
</ol>
20832106

20842107
The <dfn attribute for=CSSStyleDeclaration>length</dfn> attribute must return the number of <a lt="CSS declaration">CSS
@@ -2164,6 +2187,8 @@ The <dfn method for=CSSStyleDeclaration>setProperty(<var>property</var>, <var>va
21642187
<li>Otherwise, <a lt="set a CSS declaration">set the CSS declaration</a> <var>property</var> with value <var>component value list</var>, with
21652188
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
21662189
<a for="CSSStyleDeclaration">declarations</a>.
2190+
<li>If the <a for="CSSStyleDeclaration">owner node</a> is not null, <a>set an attribute value</a> for <a for="CSSStyleDeclaration">owner node</a>
2191+
using "<code>style</code>" and the result of <a lt="serialize a CSS declaration block">serializing</a> the <a for="CSSStyleDeclaration">declarations</a>.
21672192
</ol>
21682193

21692194
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 +2227,8 @@ steps:
22022227
value list</var>, and with the list of declarations being the <a for="CSSStyleDeclaration">declarations</a>.
22032228
<li>Otherwise, <a lt="set a CSS declaration value">set the CSS declaration value</a> <var>property</var> to the value <var>component value
22042229
list</var>, and with the list of declarations being the <a for="CSSStyleDeclaration">declarations</a>.
2230+
<li>If the <a for="CSSStyleDeclaration">owner node</a> is not null, <a>set an attribute value</a> for <a for="CSSStyleDeclaration">owner node</a>
2231+
using "<code>style</code>" and the result of <a lt="serialize a CSS declaration block">serializing</a> the <a for="CSSStyleDeclaration">declarations</a>.
22052232
</ol>
22062233

22072234
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 +2261,8 @@ these steps:
22342261
<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
22352262
if <var>priority</var> is not the empty string, and unset otherwise, and with the list of declarations being the
22362263
<a for="CSSStyleDeclaration">declarations</a>.
2264+
<li>If the <a for="CSSStyleDeclaration">owner node</a> is not null, <a>set an attribute value</a> for <a for="CSSStyleDeclaration">owner node</a>
2265+
using "<code>style</code>" and the result of <a lt="serialize a CSS declaration block">serializing</a> the <a for="CSSStyleDeclaration">declarations</a>.
22372266
</ol>
22382267

22392268
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 +2284,19 @@ The <dfn method for=CSSStyleDeclaration>removeProperty(<var>property</var>)</dfn
22552284
let <var>property</var> be <var>property</var> <a lt="ASCII lowercase">converted to ASCII lowercase</a>.
22562285
<li>Let <var>value</var> be the return value of invoking {{CSSStyleDeclaration/getPropertyValue()}}
22572286
with <var>property</var> as argument.
2258-
<li>If <var>property</var> is a shorthand property, for each longhand property <var>longhand</var> that <var>property</var> maps to, invoke
2259-
{{CSSStyleDeclaration/removeProperty()}} with <var>longhand</var> as argument.
2287+
<li>Let <var>removed</var> be false.
2288+
<li>If <var>property</var> is a shorthand property, for each longhand property <var>longhand</var> that <var>property</var> maps to:
2289+
<ol>
2290+
<li>If <var>longhand</var> is not a <a for="CSS declaration">property name</a> of a <a>CSS declaration</a>
2291+
in the <a for="CSSStyleDeclaration">declarations</a>, <a for=iteration>continue</a>.
2292+
<li>Remove that <a>CSS declaration</a> and let <var>removed</var> be true.
2293+
</ol>
22602294
<li>Otherwise, if <var>property</var> is a <a>case-sensitive</a> match for a
22612295
<a for="CSS declaration">property name</a> of a <a>CSS declaration</a> in the
2262-
<a for="CSSStyleDeclaration">declarations</a>, remove that <a>CSS declaration</a>.
2296+
<a for="CSSStyleDeclaration">declarations</a>, remove that <a>CSS declaration</a> and let <var>removed</var> be true.
2297+
<li>If <var>removed</var> is true and <a for="CSSStyleDeclaration">owner node</a> is not null, <a>set an attribute value</a>
2298+
for <a for="CSSStyleDeclaration">owner node</a> using "<code>style</code>" and the result of
2299+
<a lt="serialize a CSS declaration block">serializing</a> the <a for="CSSStyleDeclaration">declarations</a>.
22632300
<li>Return <var>value</var>.
22642301
</ol>
22652302

@@ -2678,24 +2715,9 @@ interface ElementCSSInlineStyle {
26782715
};
26792716
</pre>
26802717

2681-
The <dfn attribute for=ElementCSSInlineStyle>style</dfn> attribute must return a live <a>CSS declaration block</a> with the following
2682-
properties:
2683-
<dl>
2684-
<dt><a for="CSSStyleDeclaration">readonly flag</a>
2685-
<dd>Unset.
2686-
<dt><a for="CSSStyleDeclaration">declarations</a>
2687-
<dd>The result of <a lt="Parse a CSS declaration block">parsing</a> the <code>style</code> content attribute, in
2688-
<a>specified order</a>. If the <code>style</code> content attribute is absent, the object represents an
2689-
empty list of <a>CSS declarations</a>. Mutating the <a for="CSSStyleDeclaration">declarations</a>
2690-
must set the <code>style</code> content attribute on the <a>context object</a> to the
2691-
<a lt="serialize a CSS declaration block">serialization</a> of the <a for="CSSStyleDeclaration">declarations</a>. If the
2692-
<code>style</code> content attribute is set, changed or removed, the <a for="CSSStyleDeclaration">declarations</a> must be
2693-
updated as appropriate.
2694-
<dt><a for="CSSStyleDeclaration">parent CSS rule</a>
2695-
<dd>Null.
2696-
<dt><a for="CSSStyleDeclaration">owner node</a>
2697-
<dd>The <a>context object</a>.
2698-
</dl>
2718+
The <dfn attribute for=ElementCSSInlineStyle>style</dfn> attribute must return a <a>CSS declaration block</a> object whose
2719+
<a for="CSSStyleDeclaration">readonly flag</a> is unset, whose <a for="CSSStyleDeclaration">parent CSS rule</a> is null, and
2720+
whose <a for="CSSStyleDeclaration">owner node</a> is the <a>context object</a>.
26992721

27002722
If the user agent supports HTML, the following IDL applies: [[HTML]]
27012723

0 commit comments

Comments
 (0)