Changes from 2022-05-25 Working Draft From 5574fd5812a4e9c7a6f37b44571f2c8c3c3cd066 Mon Sep 17 00:00:00 2001 From: Noam Rosenthal Date: Wed, 17 Jul 2024 21:22:11 +0100 Subject: [PATCH 2/5] Account for null --- css-view-transitions-1/Overview.bs | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/css-view-transitions-1/Overview.bs b/css-view-transitions-1/Overview.bs index 142ea081b5a..ea8be3d14ed 100644 --- a/css-view-transitions-1/Overview.bs +++ b/css-view-transitions-1/Overview.bs @@ -1907,12 +1907,14 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface; Note: The above code example contains variables to be replaced. - 1. Let |liveSnapshot| be the result of [=capturing the image=] of |capturedElement|'s [=new element=]. + 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 |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 "`live`", then: From 0070f5e286c2ba35f54a6643407c7dffb40e988c Mon Sep 17 00:00:00 2001 From: Noam Rosenthal Date: Wed, 17 Jul 2024 22:06:11 +0100 Subject: [PATCH 3/5] Use bounding box --- css-view-transitions-1/Overview.bs | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/css-view-transitions-1/Overview.bs b/css-view-transitions-1/Overview.bs index ea8be3d14ed..8bc24cd0b51 100644 --- a/css-view-transitions-1/Overview.bs +++ b/css-view-transitions-1/Overview.bs @@ -1172,7 +1172,7 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;

: old image - :: a 2D bitmap, "`live`" or null. Initially null. + :: a 2D bitmap, "`live`", or null. Initially null. : old width : old height @@ -1371,9 +1371,11 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface; 1. Let |originalRect| be [=snapshot containing block=] if |element| is the [=document element=], otherwise, the element|'s [=border box=]. - 1. If |originalRect| does not intersect with [=snapshot containing block=], then set |capture|'s [=old image=] to "`live`". + 1. Let |boundingBox| be |element|'s [=Element/get the bounding box|bounding box=], with [=ink overflow=] taken into account. - 1. Otherwise, set |capture|'s [=old image=] to the result of [=capturing the image=] of |element|. + 1. If |boundingBox| intersects with [=snapshot containing block=], then set |capture|'s [=old image=] to the result of [=capturing the image=] of |element|. + + 1. Otherwise, set |capture|'s [=old image=] to "`live`". 1. Set |capture|'s [=captured element/old width=] to |originalRect|'s {{DOMRect/width}}. @@ -1917,12 +1919,14 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface; 1. Set |new|'s [=replaced element=] content to |liveSnapshot|. - 1. If |capturedElement|'s [=old image=] is "`live`", then: + 1. If |capturedElement|'s [=old image=] is not "`live`", 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. Note: An example of such a web API is `window.getComputedStyle(document.documentElement, "::view-transition")`. From a17eee802767525509a7b8ba2bb71f16b9a170a6 Mon Sep 17 00:00:00 2001 From: Noam Rosenthal Date: Wed, 17 Jul 2024 22:14:43 +0100 Subject: [PATCH 4/5] Refactor to use boolean instead of variant --- css-view-transitions-1/Overview.bs | 23 +++++++++++++---------- 1 file changed, 13 insertions(+), 10 deletions(-) diff --git a/css-view-transitions-1/Overview.bs b/css-view-transitions-1/Overview.bs index 8bc24cd0b51..dd88b573d5b 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 - :: a 2D bitmap, "`live`", or null. Initially null. + :: a 2D bitmap, or null. Initially null. + + : should generate old pseudo + :: a boolean, initially false. : old width : old height @@ -1368,6 +1371,8 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface; 1. Let |capture| be a new [=captured element=] struct. + 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=]. @@ -1375,8 +1380,6 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface; 1. If |boundingBox| intersects with [=snapshot containing block=], then set |capture|'s [=old image=] to the result of [=capturing the image=] of |element|. - 1. Otherwise, set |capture|'s [=old image=] to "`live`". - 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}}. @@ -1470,12 +1473,12 @@ 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|. - 1. If |capturedElement|'s [=captured element/old image=] is not "`live`", then + 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=]. @@ -1490,7 +1493,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, @@ -1506,7 +1509,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=]: @@ -1520,8 +1523,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=]. @@ -1919,7 +1922,7 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface; 1. Set |new|'s [=replaced element=] content to |liveSnapshot|. - 1. If |capturedElement|'s [=old image=] is not "`live`", then: + 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|. From cab151d18c9ffda00dc5f92f465a073f5f64394f Mon Sep 17 00:00:00 2001 From: Noam Rosenthal Date: Fri, 19 Jul 2024 10:02:45 +0100 Subject: [PATCH 5/5] Apply nit --- css-view-transitions-1/Overview.bs | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/css-view-transitions-1/Overview.bs b/css-view-transitions-1/Overview.bs index dd88b573d5b..a42f640d842 100644 --- a/css-view-transitions-1/Overview.bs +++ b/css-view-transitions-1/Overview.bs @@ -1376,9 +1376,7 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface; 1. Let |originalRect| be [=snapshot containing block=] if |element| is the [=document element=], otherwise, the element|'s [=border box=]. - 1. Let |boundingBox| be |element|'s [=Element/get the bounding box|bounding box=], with [=ink overflow=] taken into account. - - 1. If |boundingBox| intersects with [=snapshot containing block=], then set |capture|'s [=old image=] to the result of [=capturing the image=] of |element|. + 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}}.