Rename snapshot-root to snapshot containing block

Also determine that the snapshot CB is an absolute/fixed positioning
containing block for its descendants.

Closes #8505

Author: noamr

css-view-transitions-1/Overview.bs

@@ -627,20 +627,23 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
 	a [=pseudo-element root=].
 	Its [=originating element=] is the document's [=document element=].
 
-	Its [=containing block=] is the [=snapshot root=].
+	Its [=containing block=] is the [=snapshot containing block=].
+
+	The [=snapshot containing block=] is considered to be an [=absolute positioning containing block=]
+	and a [=fixed positioning containing block=] for ''::view-transition'' and its descendants.
 
 	The following is added to the [=global view transition user agent style sheet=]:
 
 	```css
 	:root::view-transition {
-		position: fixed;
+		position: absolute;
 		inset: 0;
 	}
 	```
 
 	<div class="note">
-		The aim of the style is to size the pseudo-element to cover the [=snapshot root=]
-		and position all ''::view-transition-group()'' pseudo-elements relative to the [=snapshot root origin=].
+		The aim of the style is to size the pseudo-element to cover the [=snapshot containing block=]
+		and position all ''::view-transition-group()'' pseudo-elements relative to the [=snapshot containing block origin=].
 	</div>
 
 ### <dfn>::view-transition-group( <<pt-name-selector>> )</dfn> ### {#::view-transition-group}
@@ -782,39 +785,39 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
 
 	The initial phase is the first item in the sequence.
 
-## The snapshot root ## {#snapshot-root-concept}
+## The snapshot containing block ## {#snapshot-root-concept}
 
-	The <dfn>snapshot root</dfn> is a rectangle that covers all areas of the window that could potentially display web content.
+	The <dfn>snapshot containing block</dfn> is a rectangle that covers all areas of the window that could potentially display web content.
 	This area is consistent regardless of root scrollbars or interactive widgets.
 
 	Issue: "Interactive widgets" refers to UI described within a property definition in [[css-viewport#interactive-widget-section]].
 	This should be extracted into an exported definition that can be used independently of the property.
 
 	<figure>
 		<img src="diagrams/phone-browser.svg" width="200" height="335" alt="A diagram of a phone screen, including a top status bar, a browser URL bar, web-content area with a floating scrollbar, a virtual keyboard, and a bottom bar with an OS back button">
-		<img src="diagrams/phone-browser-snapshot-root.svg" width="200" height="335" alt="The previous diagram, but highlights the area that's the 'snapshot root', which includes everything except the top status bar and the bottom bar with the OS back button">
+		<img src="diagrams/phone-browser-snapshot-root.svg" width="200" height="335" alt="The previous diagram, but highlights the area that's the 'snapshot containing block', which includes everything except the top status bar and the bottom bar with the OS back button">
 		<figcaption>
-			An example of the [=snapshot root=] on a mobile OS.
+			An example of the [=snapshot containing block=] on a mobile OS.
 			The snapshot includes the URL bar, as this can be scrolled away.
 			The keyboard is included as this appears and disappears.
-			The top and bottom bars are part of the OS rather than the browser, so they're not included in the snapshot root.
+			The top and bottom bars are part of the OS rather than the browser, so they're not included in the snapshot containing block.
 		</figcaption>
 	</figure>
 
 	<figure>
 		<img src="diagrams/desktop-browser.svg" width="132" height="79" alt="A diagram of a desktop browser window, including a tab bar, a URL bar, and a web-content area featuring both horizontal and vertical scrollbars" style="height:auto; width: 600px">
-		<img src="diagrams/desktop-browser-snapshot-root.svg" width="132" height="79" alt="The previous diagram, but highlights the area that's the 'snapshot root', which includes the web content area and the scrollbars" style="height:auto; width: 600px">
+		<img src="diagrams/desktop-browser-snapshot-root.svg" width="132" height="79" alt="The previous diagram, but highlights the area that's the 'snapshot containing block', which includes the web content area and the scrollbars" style="height:auto; width: 600px">
 		<figcaption>
-			An example of the [=snapshot root=] on a desktop OS.
+			An example of the [=snapshot containing block=] on a desktop OS.
 			This includes the scrollbars, but does not include the URL bar, as web content never appears in that area.
 		</figcaption>
 	</figure>
 
 	This means the snapshot canvas size is likely to be consistent for the [=document element=]'s [=captured element/old image=] and [=captured element/new element=].
 
-	The <dfn>snapshot root origin</dfn> refers to the top-left corner of the [=snapshot root=].
+	The <dfn>snapshot containing block origin</dfn> refers to the top-left corner of the [=snapshot containing block=].
 
-	The <dfn>snapshot root size</dfn> refers to the width and height of the [=snapshot root=] as a [=/tuple=] of two numbers.
+	The <dfn>snapshot containing block size</dfn> refers to the width and height of the [=snapshot containing block=] as a [=/tuple=] of two numbers.
 
 ## The [=view-transition layer=] stacking layer ## {#view-transition-stacking-layer}
 
@@ -908,7 +911,7 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
 			When this is true, [=this=]'s [=active view transition=]'s [=ViewTransition/transition root pseudo-element=] renders as a child of [=this=]'s [=document element=],
 			and [=this=]'s [=document element=] is its [=originating element=].
 
-			Note: The position of the [=ViewTransition/transition root pseudo-element=] within the [=document element=] does not matter, as the [=ViewTransition/transition root pseudo-element=]'s [=containing block=] is the [=snapshot root=].
+			Note: The position of the [=ViewTransition/transition root pseudo-element=] within the [=document element=] does not matter, as the [=ViewTransition/transition root pseudo-element=]'s [=containing block=] is the [=snapshot containing block=].
 	</dl>
 
 # API # {#api}
@@ -1064,11 +1067,11 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
 		:: a ''::view-transition''.
 			Initially a new ''::view-transition''.
 
-		: <dfn>initial snapshot root size</dfn>
+		: <dfn>initial snapshot containing block size</dfn>
 		:: a [=tuple=] of two numbers (width and height), or null.
 			Initially null.
 
-			Note: This is used to detect changes in the [=snapshot root size=],
+			Note: This is used to detect changes in the [=snapshot containing block size=],
 			which causes the transition to [=skip the view transition|skip=].
 			[Discussion of this behavior](https://github.com/w3c/csswg-drafts/issues/8045).
 	</dl>
@@ -1189,7 +1192,7 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
 
 						Note: This happens if |transition| was [=skip the view transition|skipped=] before this point.
 
-					1. If |transition|'s [=ViewTransition/initial snapshot root size=] is not equal to the [=snapshot root size=],
+					1. If |transition|'s [=ViewTransition/initial snapshot containing block size=] is not equal to the [=snapshot containing block size=],
 						then [=skip the view transition=] for |transition|, and return.
 
 					1. Set [=document/transition suppressing rendering=] to false.
@@ -1232,7 +1235,7 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
 
 		1. Let |document| be |transition|'s [=relevant global object's=] [=associated document=].
 
-		1. Set |transition|'s [=ViewTransition/initial snapshot root size=] to the [=snapshot root size=].
+		1. Set |transition|'s [=ViewTransition/initial snapshot containing block size=] to the [=snapshot containing block size=].
 
 		1. [=list/For each=] |element| of every [=/element=] that is [=/connected=],
 			and has a [=node document=] equal to to |document|,
@@ -1267,12 +1270,12 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
 
 				: 'transform'
 				:: A transform that would map |element|'s [=border box=] from
-					the [=snapshot root origin=] to its current visual position.
+					the [=snapshot containing block origin=] to its current visual position.
 				:: This value is identity for the [=document element=].
 
 				: 'width'
 				: 'height'
-				:: The size of the [=snapshot root=] if |element| is the [=document element=],
+				:: The size of the [=snapshot containing block=] if |element| is the [=document element=],
 					otherwise, the width and height of |element|'s border box.
 
 				: 'object-view-box'
@@ -1531,8 +1534,8 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
 
 		1. If |element| is the [=document element=], then:
 
-			1. Render the region of the |element| and the [=top layer=] that intersects the [=snapshot root=],
-				on a transparent canvas the size of the [=snapshot root=],
+			1. Render the region of the |element| and the [=top layer=] that intersects the [=snapshot containing block=],
+				on a transparent canvas the size of the [=snapshot containing block=],
 				following the [=capture rendering characteristics=], and these additional characteristics:
 
 				- Areas outside |element|'s [=scrolling box=] should be rendered as if they were scrolled to, without moving or resizing the [=layout viewport=].
@@ -1560,7 +1563,7 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
 					</figure>
 
 			1. Return the canvas as an image.
-				The natural size of the image is equal to the [=snapshot root=].
+				The natural size of the image is equal to the [=snapshot containing block=].
 
 		1. Otherwise:
 
@@ -1655,7 +1658,7 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
 
 			1. Return.
 
-		1. If |transition|'s [=ViewTransition/initial snapshot root size=] is not equal to the [=snapshot root size=],
+		1. If |transition|'s [=ViewTransition/initial snapshot containing block size=] is not equal to the [=snapshot containing block size=],
 			then [=skip the view transition=] for |transition|, and return.
 
 		1. [=Update pseudo-element styles=] for |transition|.
@@ -1702,7 +1705,7 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
 
 				1. Set |height| to the current height of |capturedElement|'s [=new element=]'s [=border box=].
 
-				1. Set |transform| to a transform that would map |capturedElement|'s [=new element=]'s [=border box=] from the [=snapshot root origin=] to its current visual position.
+				1. Set |transform| to a transform that would map |capturedElement|'s [=new element=]'s [=border box=] from the [=snapshot containing block origin=] to its current visual position.
 
 				1. Set |writingMode| to the [=computed value=] of 'writing-mode' on |capturedElement|'s [=new element=].
 
@@ -1804,7 +1807,7 @@ Changes from <a href="https://www.w3.org/TR/2022/WD-css-view-transitions-1-20221
 * Add rendering constraints to elements participating in a transition. See <a href="https://github.com/w3c/csswg-drafts/issues/8139">issue 8139</a> and <a href="https://github.com/w3c/csswg-drafts/issues/7882">issue 7882</a>.
 * Remove html specifics from UA stylesheet to support ViewTransitions on SVG Documents.
 * Rename updateDOMCallback to {{UpdateCallback}}. See <a href="https://github.com/w3c/csswg-drafts/issues/8144">issue 8144</a>.
-* Rename snapshot viewport to [=snapshot root=].
+* Rename snapshot viewport to [=snapshot containing block=].
 * Skip the transition if viewport size changes. See <a href="https://github.com/w3c/csswg-drafts/issues/8045">issue 8045</a>.
 * Add support for :only-child. See <a href="https://github.com/w3c/csswg-drafts/issues/8057">issue 8057</a>.
 * Add concept of a tree of pseudo-elements under [=pseudo-element root=]. See <a href="https://github.com/w3c/csswg-drafts/issues/8113">issue 8113</a>.