Skip to content

Commit e81e524

Browse files
authored
Update spec for resolved issues
Fixes w3c#9365, w3c#9358 and w3c#9276.
1 parent 785e1d9 commit e81e524

File tree

1 file changed

+41
-2
lines changed

1 file changed

+41
-2
lines changed

css-view-transitions-1/Overview.bs

+41-2
Original file line numberDiff line numberDiff line change
@@ -595,6 +595,8 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
595595
All of the [=view transition pseudo-elements=] are selected
596596
from their [=ultimate originating element=], the [=document element=].
597597

598+
The [=view transition tree=] is not exposed to the accessibility tree.
599+
598600
<div class="example">
599601
For example,
600602
the ''::view-transition-group()'' pseudo-element is attached to the root element selector directly,
@@ -809,7 +811,17 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
809811
Therefore, the [=view transition layer=] is a sibling of all other content.
810812

811813
When a {{Document}}'s [=document/active view transition=]'s [=ViewTransition/phase=] is "`animating`",
812-
the boxes generated by any element in that {{Document}} with [=captured in a view transition=] are [=invisible=].
814+
the boxes generated by any element in that {{Document}} with [=captured in a view transition=]
815+
and its [=element contents=],
816+
except [=ViewTransition/transition root pseudo-element=]'s [=tree/inclusive descendants=],
817+
are not painted (as if they had ''visibility: hidden'') and
818+
do not respond to hit-testing (as if they had ''pointer-events: none'').
819+
820+
Note: Elements participating in a transition need to skip painting in their DOM location because
821+
their image is painted in the corresponding ''::view-transition-new()'' pseudo-element instead.
822+
Similarly, hit-testing is skipped because the element's DOM location does not correspond to where its contents are rendered.
823+
However, there is no change in how these elements are accessed by assistive technologies or the accessibility tree.
824+
813825

814826
# User Agent Stylesheet # {#ua-styles}
815827

@@ -1165,6 +1177,12 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
11651177
: <dfn>old mix-blend-mode</dfn>
11661178
:: Null or a 'mix-blend-mode', initially null.
11671179

1180+
: <dfn>old backdrop-filter</dfn>
1181+
:: Null or a 'backdrop-filter', initially null.
1182+
1183+
: <dfn>old color-scheme</dfn>
1184+
:: Null or a 'color-scheme', initially null.
1185+
11681186
: <dfn>new element</dfn>
11691187
:: an [=/element=] or null. Initially null.
11701188
</dl>
@@ -1378,6 +1396,10 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
13781396

13791397
1. Set |capture|'s [=captured element/old mix-blend-mode=] to the [=computed value=] of 'mix-blend-mode' on |element|.
13801398

1399+
1. Set |capture|'s [=captured element/old backdrop-filter=] to the [=computed value=] of 'backdrop-filter' on |element|.
1400+
1401+
1. Set |capture|'s [=captured element/old color-scheme=] to the [=computed value=] of 'color-scheme' on |element|.
1402+
13811403
1. Let |transitionName| be the [=computed value=] of 'view-transition-name' for |element|.
13821404

13831405
1. Set |namedElements|[|transitionName|] to |capture|.
@@ -1503,6 +1525,8 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
15031525

15041526
1. Let |height| be |capturedElement|'s [=captured element/old height=].
15051527

1528+
1. Let |backdropFilter| be |capturedElement|'s [=captured element/old backdrop-filter=].
1529+
15061530
1. Set |capturedElement|'s [=captured element/group keyframes=] to a new {{CSSKeyframesRule}} representing the following CSS,
15071531
and append it to |document|'s [=document/dynamic view transition style sheet=]:
15081532

@@ -1513,6 +1537,7 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
15131537
transform: <var>transform</var>;
15141538
width: <var>width</var>;
15151539
height: <var>height</var>;
1540+
backdrop-filter: <var>backdropFilter</var>;
15161541
}
15171542
}
15181543
</pre>
@@ -1763,7 +1788,7 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
17631788

17641789
1. [=map/For each=] |transitionName| → |capturedElement| of |transition|'s [=ViewTransition/named elements=]:
17651790

1766-
1. Let |width|, |height|, |transform|, |writingMode|, |direction|, |textOrientation| and |mixBlendMode| be null.
1791+
1. Let |width|, |height|, |transform|, |writingMode|, |direction|, |textOrientation|, |mixBlendMode|, |backdropFilter| and |colorScheme| be null.
17671792

17681793
1. If |capturedElement|'s [=new element=] is null, then:
17691794

@@ -1781,6 +1806,10 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
17811806

17821807
1. Set |mixBlendMode| to |capturedElement|'s [=captured element/old mix-blend-mode=].
17831808

1809+
1. Set |backdropFilter| to |capturedElement|'s [=captured element/old backdrop-filter=].
1810+
1811+
1. Set |colorScheme| to |capturedElement|'s [=captured element/old color-scheme=].
1812+
17841813
1. Otherwise:
17851814

17861815
1. Return failure if any of the following conditions is true:
@@ -1806,6 +1835,10 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
18061835

18071836
1. Set |mixBlendMode| to the [=computed value=] of 'mix-blend-mode' on |capturedElement|'s [=new element=].
18081837

1838+
1. Set |backdropFilter| to the [=computed value=] of 'backdrop-filter' on |capturedElement|'s [=new element=].
1839+
1840+
1. Set |colorScheme| to the [=computed value=] of 'color-scheme' on |capturedElement|'s [=new element=].
1841+
18091842
1. If |capturedElement|'s [=captured element/group styles rule=] is null,
18101843
then set |capturedElement|'s [=captured element/group styles rule=] to a new {{CSSStyleRule}} representing the following CSS,
18111844
and append it to |transition|'s [=relevant global object's=] [=associated document=]'s [=document/dynamic view transition style sheet=].
@@ -1822,6 +1855,8 @@ urlPrefix: https://wicg.github.io/navigation-api/; type: interface;
18221855
direction: <var>direction</var>;
18231856
text-orientation: <var>textOrientation</var>;
18241857
mix-blend-mode: <var>mixBlendMode</var>;
1858+
backdrop-filter: <var>backdropFilter</var>;
1859+
color-scheme: <var>colorScheme</var>;
18251860
}
18261861
</pre>
18271862

@@ -1885,6 +1920,10 @@ Changes from <a href="https://www.w3.org/TR/2023/WD-css-view-transitions-1-20230
18851920
* Add text-orientation to list of properties copied over to the ''::view-transition-group''. See <a href="https://github.com/w3c/csswg-drafts/issues/8230">issue 8230</a>.
18861921
* Refactor the old capture algorithm to properly set [=captured in a view transition=] before reading the value.
18871922
* Make the {{Document/startViewTransition()}} parameter non-nullable. See <a href="https://github.com/w3c/csswg-drafts/issues/9460">issue 9460</a>.
1923+
* Elements participating in a [=view transition=] are exposed to accessibility tree. See <a href="https://github.com/w3c/csswg-drafts/issues/9365">issue 9365</a>.
1924+
* The [=view transition tree=] is not exposed to accessibility tree. See <a href="https://github.com/w3c/csswg-drafts/issues/9365">issue 9365</a>.
1925+
* Animate back-drop filter similar to transform/size. See <a href="https://github.com/w3c/csswg-drafts/issues/9358">issue 9358</a>.
1926+
* Copy `color-scheme` from DOM element to ''::view-transition-group()''. See <a href="https://github.com/w3c/csswg-drafts/issues/9276">issue 9276</a>.
18881927

18891928
<h3 id="changes-since-2022-05-25">
18901929
Changes from <a href="https://www.w3.org/TR/2023/WD-css-view-transitions-1-20230525/">2022-05-25 Working Draft</a>

0 commit comments

Comments
 (0)