@@ -1717,6 +1717,7 @@ Issue: Is this updated by a <code>rootEl.startViewTransition()</code> call, too?
17171717 undefined skipTransition();
17181718 attribute ViewTransitionTypeSet types;
17191719 readonly attribute Element transitionRoot;
1720+ undefined waitUntil(Promise<any> promise);
17201721 };
17211722 </xmp>
17221723
@@ -1772,6 +1773,11 @@ Issue: Is this updated by a <code>rootEl.startViewTransition()</code> call, too?
17721773
17731774 For [=view transitions=] started on the {{Document}} ,
17741775 this is the [=document element=] .
1776+
1777+ : <code> {{ViewTransition|viewTransition}} .{{ViewTransition/waitUntil}} ()</code>
1778+ :: Delays view transition finish until the given promise is settled
1779+
1780+ When invoked with Promise |p|, run [=delay finish for promise=] steps with |p|.
17751781 </dl>
17761782
17771783 A {{ViewTransition}} has the following:
@@ -2090,6 +2096,12 @@ and by applying ''view-transition-group'' to the internal element referencing th
20902096 Initially false.
20912097
20922098 Note: this value can be read [=in parallel=] while navigating.
2099+
2100+ : <dfn>wait until promise count</dfn>
2101+ :: an integer, initially 0.
2102+
2103+ Represents the count of promises that have been added via {{ViewTransition/waitUntil}} function
2104+ and have not settled.
20932105 </dl>
20942106
20952107### Additions to Elements ### {#elements-concept}
@@ -3115,6 +3127,19 @@ To <dfn>adjust nested view transition group transform</dfn> given a |transform|
31153127 Note: This is necessary since the descendant will generate its own snapshot which will be displayed and animated independently.
31163128 </div>
31173129
3130+ <div algorithm="delay finish for promise">
3131+ To <dfn>delay finish for promise</dfn> , given promise |p|:
3132+
3133+ 1. If |p| is settled, abort the remainder of the steps and return.
3134+
3135+ 1. Increment [=this=] 's [=wait until promise count=] .
3136+
3137+ 1. [=Upon fulfillment=] or [=upon rejection|rejection=] of |p|:
3138+
3139+ 1. Decrement [=this=] 's [=wait until promise count=] .
3140+
3141+ Note: If [=this=] 's [=wait until promise count=] is 0, the transition will finish at the next [=rendering opportunity=] .
3142+
31183143## [=Handle transition frame=] ## {#handle-transition-frame-algorithm}
31193144
31203145 <div algorithm>
@@ -3133,7 +3158,7 @@ To <dfn>adjust nested view transition group transform</dfn> given a |transform|
31333158
31343159 - |document|'s [=pending animation event queue=] has any events associated with |animation|.
31353160
3136- 1. If |hasActiveAnimations| is false:
3161+ 1. If |hasActiveAnimations| is false and [=this=] 's [=wait until promise count=] is 0 :
31373162
31383163 1. Set |transition|'s [=ViewTransition/phase=] to "`done`".
31393164
@@ -3327,6 +3352,7 @@ This appendix is <em>informative</em>.
33273352Changes from <a href="https://www.w3.org/TR/2024/WD-css-view-transitions-2-20240516/">2024-05-16 Working Draft</a>
33283353</h3>
33293354
3355+ * Add waitUntil() (<a href="https://github.com/w3c/csswg-drafts/issues/9901">#9901</a> )
33303356* First pass at layered capture (<a href="https://github.com/w3c/csswg-drafts/issues/10585">#10585</a> )
33313357* Allow transitions when traversing into a document that was created using cross-origin redirects (<a href="https://github.com/w3c/csswg-drafts/issues/11063">#11063</a> #11063)
33323358* Clarify a few nesting details (<a href="https://github.com/w3c/csswg-drafts/issues/10780">#10780</a> and <a href="https://github.com/w3c/csswg-drafts/issues/10633">#10633</a> )
0 commit comments