Structure class algos as additional steps

Author: noamr

css-view-transitions-1/Overview.bs

@@ -1225,6 +1225,8 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
 	Note: These are used to update, and later remove styles
 	from a [=/document=]'s [=document/dynamic view transition style sheet=].
 
+	Other specs can supply <dfn>additional capture steps</dfn>, which is an algorithm that acepts a [=captured element=] and an [=element=].
+
 ## [=Perform pending transition operations=] ## {#perform-pending-transition-operations-algorithm}
 
 	<div algorithm>
@@ -1398,6 +1400,8 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
 
 			1. Set |namedElements|[|transitionName|] to |capture|.
 
+			1. Perform [=additional capture steps=] given |capture| and |element|.
+
 		1. [=list/For each=] |element| in |captureElements|:
 
 			1. Set |element|'s [=captured in a view transition=] to false.
@@ -1439,6 +1443,8 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
 					This might not be the right layering for all cases. See <a href="https://github.com/w3c/csswg-drafts/issues/8941">issue 8941</a>.
 
 			1. Set |namedElements|[|transitionName|]'s [=new element=] to |element|.
+
+			1. Perform [=additional capture steps=] given |namedElements|[|transitionName|] and |element|.
 	</div>
 
 ### [=Setup transition pseudo-elements=] ### {#setup-transition-pseudo-elements-algorithm}

css-view-transitions-2/Overview.bs

@@ -32,6 +32,8 @@ spec:css-view-transitions-1;
 	text: call the update callback; type: dfn;
 	text: perform pending transition operations; type: dfn;
 	text: setup view transition; type: dfn;
+	text: additional capture steps; type: dfn;
+	text: named view transition pseudo-element; type: dfn;
 spec:dom; type:dfn; text:document
 spec:css22; type:dfn; text:element
 spec:selectors-4; type:dfn;
@@ -125,6 +127,8 @@ spec:infra; type:dfn; text:list
 
 ## Examples ## {#examples}
 
+### Cross-document view-transitions ### {#cross-doc-example}
+
 	<div class=example>
 		To generate the same cross-fade as in the first example [[css-view-transitions-1#examples]],
 		but across documents, we don't need JavaScript.
@@ -259,20 +263,21 @@ for multiple elements without having to replicate the corresponding pseudo-eleme
 	Animation type: discrete
 	</pre>
 
-	The 'view-transition-class' works alongside 'view-transition-name', and is read at the same time
-	'view-transition-name' is read. But unlike 'view-transition-name', 'view-transition-class' doesn't
-	have to be unique - an element can have several view-transition classes, and the same 'view-transition-class'
-	can apply to multiple elements. While 'view-transition-name' is used to match between the element
-	in the old state with its corresponding element in the new state, 'view-transition-class' is used
+	The 'view-transition-class' can be used to apply the same style rule to multiple [=named view transition pseudo-elements=] which may have a different 'view-transition-name'.
+	While 'view-transition-name' is used to match between the element in the old state with its corresponding element in the new state, 'view-transition-class' is used
 	only to apply styles using the view-transition pseudo-elements
 	(''::view-transition-group()'', ''::view-transition-image-pair()'', ''::view-transition-old()'', ''::view-transition-new()'').
 
+	Note that 'view-transition-class' by itself doesn't mark an element for capturing, it is only used as an additional
+	way to style an element that already has a 'view-transition-name'.
+
 	<dl dfn-type=value dfn-for=view-transition-class>
 		: <dfn>none</dfn>
-		:: No class would apply to the [=named view-transition pseudo-elements=] generated for this element.
+		:: No class would apply to the [=named view transition pseudo-elements=] generated for this element.
 
 		: <dfn><<custom-ident>>*</dfn>
-		:: All of the specified <<custom-ident>> values (apart from <css>none</css>) apply as classes for the [=/element=].
+		:: All of the specified <<custom-ident>> values (apart from <css>none</css>) are applied when used in [=named view transition pseudo-element=] selectors.
+			<css>none</css> is an invalid <<custom-ident>> for 'view-transition-class', even when combined with other <<custom-ident>>s.
 
 			Note: If the same 'view-transition-name' is specified for an element both in the old and new states of the transition,
 			only the 'view-transition-class' values from the new state apply. This also applies for cross-document view-transitions:
@@ -332,11 +337,11 @@ document.startViewTransition({update: updateTheDOMSomehow});
 ```
 </div>
 
-# Additions to view-transition pseudo-elements # {#pseudo-element-additions}
+# Additions to named view-transition pseudo-elements # {#pseudo-element-additions}
 
-	The <dfn>named view transition pseudo-elements</dfn>
+	The [=named view transition pseudo-elements=]
 	(''view-transition-group()'', ''view-transition-image-pair()'', ''view-transition-old()'', ''view-transition-new()'')
-	are extended to support the following syntax for each |pseudo|:
+	are extended to support the following syntax:
 
 	<pre class=prod>
 		::view-transition-group(<<pt-name-selector>><<pt-class-selector>>)
@@ -353,8 +358,8 @@ document.startViewTransition({update: updateTheDOMSomehow});
 	</pre>
 
 	A [=named view transition pseudo-element=] [=selector=] which has one or more <<custom-ident>> values
-	in its <<pt-class-selector>> would only match an element if the element's [=captured element/class list=]
-	[=list/contains=] all of those values.
+	in its <<pt-class-selector>> would only match an element if the [=captured element/class list=] value in
+	[=ViewTransition/named elements=] for the pseudo-element's 'view-transition-name' [=list/contains=] all of those values.
 
 	The specificity of a [=named view transition pseudo-element=] [=selector=]
 	with a <<pt-class-selector>>
@@ -495,23 +500,18 @@ The {{CSSViewTransitionRule}} represents a ''@view-transition'' rule.
 
 ## Additions to [=captured element=] struct ## {#additions-to-captured-element-struct}
 
+The [=captured element=] struct should contain these fields, in addition to the existing ones:
+
 	<dl>
 		: <dfn for="captured element">class list</dfn>
 		:: a [=/list=] of strings, initially empty.
 	</dl>
 
-## Additions to capture algorithms: ## {#additions-to-capture-algorithms}
-<div algorithm="capture old classes">
-When capturing the old state of the view transition, perform the following step when iterating on |captureElements| given |element| and |capture|:
+## Algorithms to capture 'view-transition-class': ## {#vt-class-algorithms}
+<div algorithm="additional capture steps">
+This spec provides the following [=additional capture steps=] given a [=captured element=] |capture| and an [=element=] |element|:
 
 	1. Set |capture|'s [=captured element/class list=] to the [=computed value=] of |element|'s 'view-transition-class'.
-
-</div>
-
-<div algorithm="capture new classes">
-When capturing the new state of the view transition, perform the following step when iterating on |captureElements| given |element| and |namedElements|:
-
-	1. Set |namedElement|[|transitionName|]'s [=captured element/class list=] to the [=computed value=] of |element|'s 'view-transition-class'.
 </div>
 
 ## Monkey patches to HTML ## {#monkey-patch-to-html}