diff --git a/css-view-transitions-1/Overview.bs b/css-view-transitions-1/Overview.bs
index df0fb3580e4..a42f640d842 100644
--- a/css-view-transitions-1/Overview.bs
+++ b/css-view-transitions-1/Overview.bs
@@ -1172,7 +1172,10 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
: old image
- :: an 2D bitmap or null. Initially null.
+ :: a 2D bitmap, or null. Initially null.
+
+ : should generate old pseudo
+ :: a boolean, initially false.
: old width
: old height
@@ -1368,11 +1371,13 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
1. Let |capture| be a new [=captured element=] struct.
- 1. Set |capture|'s [=old image=] to the result of [=capturing the image=] of |element|.
+ 1. Set |capture|'s [=should generate old pseudo=] to true.
1. Let |originalRect| be [=snapshot containing block=] if |element| is the [=document element=],
otherwise, the element|'s [=border box=].
+ 1. If |element|'s [=ink overflow rectangle=] intersects with [=snapshot containing block=], then set |capture|'s [=old image=] to the result of [=capturing the image=] of |element|.
+
1. Set |capture|'s [=captured element/old width=] to |originalRect|'s {{DOMRect/width}}.
1. Set |capture|'s [=captured element/old height=] to |originalRect|'s {{DOMRect/height}}.
@@ -1466,12 +1471,14 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
1. Append |imagePair| to |group|.
- 1. If |capturedElement|'s [=captured element/old image=] is not null, then:
+ 1. If |capturedElement|'s [=should generate old pseudo=] is true, then:
1. Let |old| be a new ''::view-transition-old()'',
- with its [=view transition name=] set to |transitionName|,
- displaying |capturedElement|'s [=captured element/old image=]
- as its [=replaced element|replaced=] content.
+ with its [=view transition name=] set to |transitionName|.
+
+ 1. If |capturedElement|'s [=captured element/old image=] is not null, then
+ set |old|'s [=replaced element|replaced=] content to |capturedElement|'s
+ [=captured element/old image=].
1. Append |old| to |imagePair|.
@@ -1484,7 +1491,7 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
1. Append |new| to |imagePair|.
- 1. If |capturedElement|'s [=captured element/old image=] is null, then:
+ 1. If |capturedElement|'s [=should generate old pseudo=] is false, then:
1. [=Assert=]: |capturedElement|'s [=captured element/new element=] is not null.
1. Set |capturedElement|'s [=captured element/image animation name rule=] to a new {{CSSStyleRule}} representing the following CSS,
@@ -1500,7 +1507,7 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
Note: The above code example contains variables to be replaced.
1. If |capturedElement|'s [=captured element/new element=] is null, then:
- 1. [=Assert=]: |capturedElement|'s [=captured element/old image=] is not null.
+ 1. [=Assert=]: |capturedElement|'s [=should generate old pseudo=] is true.
1. Set |capturedElement|'s [=captured element/image animation name rule=] to a new {{CSSStyleRule}} representing the following CSS,
and append it to |document|'s [=document/dynamic view transition style sheet=]:
@@ -1514,8 +1521,8 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
Note: The above code example contains variables to be replaced.
- 1. If both of |capturedElement|'s [=captured element/old image=] and [=captured element/new element=]
- are not null, then:
+ 1. If [=should generate old pseudo=] is true and [=captured element/new element=]
+ is not null, then:
1. Let |transform| be |capturedElement|'s [=captured element/old transform=].
@@ -1903,11 +1910,23 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
Note: The above code example contains variables to be replaced.
+ 1. Let |liveSnapshot| be null.
+
1. If |capturedElement|'s [=new element=] is not null, then:
1. Let |new| be the ''::view-transition-new()'' with the [=view transition name=] |transitionName|.
- 1. Set |new|'s [=replaced element=] content to the result of [=capturing the image=] of |capturedElement|'s [=new element=].
+ 1. Set |liveSnapshot| to the result of [=capturing the image=] of |capturedElement|'s [=new element=].
+
+ 1. Set |new|'s [=replaced element=] content to |liveSnapshot|.
+
+ 1. If |capturedElement|'s [=old image=] is null, and |capturedElement|'s [=should generate old pseudo=] is true, then:
+
+ 1. Let |old| be the ''::view-transition-old()'' with the [=view transition name=] |transitionName|.
+
+ 1. Set |old|'s [=replaced element=] content to |liveSnapshot|.
+
+ Note: In case of an exit transition of an offscreen element, the group would have no content.
This algorithm must be executed to update styles in [=user-agent origin=] if its effects can be observed by a web API.
@@ -1979,6 +1998,7 @@ Changes from issue 10145.
* Fix scoping to match name instead of element. See issue 10145.
+* Show live contents if the old element is captured when outside the viewport. See issue 8282.