Merge pull request w3c#7293 from andruud/issue/7033

[css-contain-3] Improve CSSContainerRule

Author: mirisuzanne

css-contain-3/Overview.bs

@@ -568,7 +568,7 @@ Creating Named Containers: the 'container' shorthand</h3>
 Container Queries: the ''@container'' rule</h3>
 
 	The <dfn at-rule id="at-ruledef-container">@container</dfn> rule
-	is a [=conditional group rule=] whose condition is
+	is a [=conditional group rule=] whose condition contains
 	a <dfn export>container query</dfn>,
 	which is a boolean combination of [=container size queries=] and/or [=container style queries=].
 	Style declarations within the <<stylesheet>> block of an ''@container'' rule
@@ -579,26 +579,27 @@ Container Queries: the ''@container'' rule</h3>
 	The syntax of the ''@container'' rule is:
 
 	<pre class="prod def">
-	@container [ <<container-name>> ]? <<container-condition>> {
+	@container <<container-condition>> {
 	  <<stylesheet>>
 	}
 	</pre>
 
 	where:
 
 	<pre class="prod def">
+	<dfn><<container-condition>></dfn> = [ <<container-name>> ]? <<container-query>>
 	<dfn><<container-name>></dfn> = <<custom-ident>>
-	<dfn><<container-condition>></dfn> = not <<query-in-parens>>
+	<dfn><<container-query>></dfn>     = not <<query-in-parens>>
 	                      | <<query-in-parens>> [ [ and <<query-in-parens>> ]* | [ or <<query-in-parens>> ]* ]
-	<dfn><<query-in-parens>></dfn>     = ( <<container-condition>> )
+	<dfn><<query-in-parens>></dfn>     = ( <<container-query>> )
 	                      | ( <<size-feature>> )
 	                      | style( <<style-query>> )
 	                      | <<general-enclosed>>
 
-	<dfn><<style-query>></dfn>         = <<style-condition>> | <<style-feature>>
-	<dfn><<style-condition>></dfn>     = not <<style-in-parens>>
+	<dfn><<style-query>></dfn>         = not <<style-in-parens>>
 	                      | <<style-in-parens>> [ [ and <<style-in-parens>> ]* | [ or <<style-in-parens>> ]* ]
-	<dfn><<style-in-parens>></dfn>     = ( <<style-condition>> )
+	                      | <<style-feature>>
+	<dfn><<style-in-parens>></dfn>     = ( <<style-query>> )
 	                      | ( <<style-feature>> )
 	                      | <<general-enclosed>>
 	</pre>
@@ -611,13 +612,13 @@ Container Queries: the ''@container'' rule</h3>
 	is selected from among the element’s ancestor [=query containers=]
 	that are established as a valid [=query container=]
 	for all the [=container features=]
-	in the <<container-condition>>.
+	in the <<container-query>>.
 	The optional <<container-name>>
 	filters the set of [=query containers=] considered
 	to just those with a matching [=query container name=].
 
 	Once an eligible [=query container=] has been selected for an element,
-	each [=container feature=] in the <<container-condition>>
+	each [=container feature=] in the <<container-query>>
 	is evaluated against that [=query container=].
 	If no ancestor is an eligible [=query container=],
 	then the [=container query=] is ''unknown'' for that element.
@@ -1005,16 +1006,40 @@ The <code>CSSContainerRule</code> interface</h3>
 	<pre class='idl'>
 	[Exposed=Window]
 	interface CSSContainerRule : CSSConditionRule {
+	    readonly attribute CSSOMString containerName;
+	    readonly attribute CSSOMString containerQuery;
 	};
 	</pre>
 
 	<dl class='idl-attributes'>
 		<dt><code>conditionText</code> of type <code>CSSOMString</code> (CSSContainerRule-specific definition for attribute on CSSConditionRule)
 		<dd>The <code>conditionText</code> attribute (defined on the <code>CSSConditionRule</code> parent rule),
-			on getting, must return the condition that was specified,
+			on getting, must return a value as follows:
+
+			<dl class="switch">
+				<dt data-md>The ''@container'' rule has an associated <<container-name>>
+				<dd data-md>The result of getting the <code>containerName</code> and
+					<code>containerQuery</code> attributes, joined by a single whitespace.
+				<dt data-md>Otherwise
+				<dd data-md>The result of getting the <code>containerQuery</code> attribute.
+			</dl>
+
+		<dt><code>containerName</code> of type <code>CSSOMString</code>
+		<dd>The <code>containerName</code> attribute, on getting, must return a value as follows:
+
+			<dl class="switch">
+				<dt data-md>The ''@container'' rule has an associated <<container-name>>
+				<dd data-md>The result of serializing that <<container-name>>.
+				<dt data-md>Otherwise
+				<dd data-md>An empty string.
+			</dl>
+
+		<dt><code>containerQuery</code> of type <code>CSSOMString</code>
+		<dd>The <code>containerQuery</code> attribute,
+			on getting, must return the <<container-query>> that was specified,
 			without any logical simplifications,
-			so that the returned condition will evaluate to the same result
-			as the specified condition
+			so that the returned query will evaluate to the same result
+			as the specified query
 			in any conformant implementation of this specification
 			(including implementations that implement future extensions
 			allowed by the <<general-enclosed>> extensibility mechanism in this specification).
@@ -1026,8 +1051,6 @@ The <code>CSSContainerRule</code> interface</h3>
 			or simplification based on evaluating results) are not allowed.
 	</dl>
 
-	Issue(7033): Add CSSOM API for CSSContainerRule
-
 	Issue(6205): Container Queries should have a <code>matchContainer</code> method.
 	This will be modeled on {{matchMedia()}} and the {{MediaQueryList}} interface,
 	but applied to Elements rather than the Window.
@@ -1063,6 +1086,9 @@ Changes since the 18 August 2022 Working Draft</h3>
 
 	Significant changes since the <a href="https://www.w3.org/TR/2022/WD-css-contain-3-20220818/">18 August 2022 Working Draft</a> include:
 
+	* Add the {{CSSContainerRule/containerName}} and
+		{{CSSContainerRule/containerQuery}} attributes.
+		(<a href="https://github.com/w3c/csswg-drafts/issues/7033">Issue 7033</a>)
 	* Correct typo in 'container-type' syntax, to clarify that ''normal'' cannot
 		be combined with other values.
 		(<a href="https://github.com/w3c/csswg-drafts/issues/7669">Issue 7669</a>)