Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
46 changes: 23 additions & 23 deletions css-view-transitions-1/Overview.bs
Original file line number Diff line number Diff line change
Expand Up @@ -502,10 +502,10 @@ urlPrefix: https://html.spec.whatwg.org/multipage/rendering.html; type: dfn;

<xmp class=idl>
partial interface Document {
ViewTransition startViewTransition(optional UpdateDOMCallback? callback = null);
ViewTransition startViewTransition(optional UpdateCallback? callback = null);
};

callback UpdateDOMCallback = Promise<any> ();
callback UpdateCallback = Promise<any> ();
</xmp>

### {{Document/startViewTransition()}} ### {#ViewTransition-prepare}
Expand All @@ -515,15 +515,15 @@ urlPrefix: https://html.spec.whatwg.org/multipage/rendering.html; type: dfn;

1. Let |transition| be a new {{ViewTransition}} object in [=this's=] [=relevant Realm=].

1. Set |transition|'s [=ViewTransition/DOM update callback=] to |callback|.
1. Set |transition|'s [=ViewTransition/update callback=] to |callback|.

1. Let |document| be [=this's=] [=relevant global object's=] [=associated document=].

1. If |document|'s [=active DOM transition=] is not null,
then [=skip the view transition=] |document|'s [=active DOM transition=]
with an "{{AbortError}}" {{DOMException}} in [=this's=] [=relevant Realm=].

Note: This can result in two asynchronous [=ViewTransition/DOM update callbacks=] running concurrently.
Note: This can result in two asynchronous [=ViewTransition/update callbacks=] running concurrently.
One for the |document|'s current [=active DOM transition=], and another for this |transition|.
As per the [design of this feature](#transitions-as-enhancements), it's assumed that the developer is using another feature or framework to correctly schedule these DOM changes.

Expand Down Expand Up @@ -596,7 +596,7 @@ urlPrefix: https://html.spec.whatwg.org/multipage/rendering.html; type: dfn;
undefined skipTransition();
readonly attribute Promise<undefined> finished;
readonly attribute Promise<undefined> ready;
readonly attribute Promise<undefined> domUpdated;
readonly attribute Promise<undefined> updateCallbackDone;
};
</xmp>

Expand All @@ -615,22 +615,22 @@ urlPrefix: https://html.spec.whatwg.org/multipage/rendering.html; type: dfn;
:: One of the following [=phases=]:

1. "`pending-capture`".
1. "`dom-update-callback-called`".
1. "`update-callback-called`".
1. "`animating`".
1. "`done`".

Note: For the most part, a developer using this API does not need to worry about the different phases, since they progress automatically.
It is, however, important to understand what steps happen in each of the phases: when the snapshots are captured, when pseudo-element DOM is created, etc.
The description of the phases below tries to be as precise as possible, with an intent to provide an unambiguous set of steps for implementors to follow in order to produce a spec-compliant implementation.

: <dfn>DOM update callback</dfn>
:: an {{UpdateDOMCallback}} or null. Initially null.
: <dfn>update callback</dfn>
:: an {{UpdateCallback}} or null. Initially null.

: <dfn>ready promise</dfn>
:: a {{Promise}}.
Initially [=a new promise=] in [=this's=] [=relevant Realm=].

: <dfn>DOM updated promise</dfn>
: <dfn>update callback done promise</dfn>
:: a {{Promise}}.
Initially [=a new promise=] in [=this's=] [=relevant Realm=].

Expand All @@ -655,7 +655,7 @@ urlPrefix: https://html.spec.whatwg.org/multipage/rendering.html; type: dfn;

The {{ViewTransition/ready}} [=getter steps=] are to return [=this's=] [=ViewTransition/ready promise=].

The {{ViewTransition/domUpdated}} [=getter steps=] are to return [=this's=] [=ViewTransition/DOM updated promise=].
The {{ViewTransition/updateCallbackDone}} [=getter steps=] are to return [=this's=] [=ViewTransition/update callback done promise=].

### {{ViewTransition/skipTransition()}} ### {#ViewTransition-skipTransition}

Expand Down Expand Up @@ -802,9 +802,9 @@ urlPrefix: https://html.spec.whatwg.org/multipage/rendering.html; type: dfn;

Note: This happens if |transition| was [=skip the view transition|skipped=] before this point.

1. [=Call the DOM update callback=] of |transition|.
1. [=Call the update callback=] of |transition|.

1. [=promise/React=] to |transition|'s [=ViewTransition/DOM updated promise=]:
1. [=promise/React=] to |transition|'s [=ViewTransition/update callback done promise=]:

* If the promise does not settle within an implementation-defined timeout, then:

Expand Down Expand Up @@ -894,7 +894,7 @@ urlPrefix: https://html.spec.whatwg.org/multipage/rendering.html; type: dfn;

1. [=Assert=]: |transition|'s [=ViewTransition/phase=] is not "`done`".

1. If |transition|'s [=ViewTransition/phase=] is [=phases/before=] "`dom-update-callback-called`", then [=call the DOM update callback=] of |transition|.
1. If |transition|'s [=ViewTransition/phase=] is [=phases/before=] "`update-callback-called`", then [=call the update callback=] of |transition|.

1. Set [=document/transition suppressing rendering=] to false.

Expand All @@ -906,12 +906,12 @@ urlPrefix: https://html.spec.whatwg.org/multipage/rendering.html; type: dfn;

Note: The ready promise would've been resolved if {{ViewTransition/skipTransition()}} is called after we start animating.

1. [=promise/React=] to |transition|'s [=ViewTransition/DOM updated promise=]:
1. [=promise/React=] to |transition|'s [=ViewTransition/update callback done promise=]:

* If |transition|'s [=ViewTransition/DOM updated promise=] was resolved,
* If |transition|'s [=ViewTransition/update callback done promise=] was resolved,
then [=resolve=] |transition|'s [=ViewTransition/finished promise=].

* If |transition|'s [=ViewTransition/DOM updated promise=] was rejected with reason |reason|,
* If |transition|'s [=ViewTransition/update callback done promise=] was rejected with reason |reason|,
then [=reject=] |transition|'s [=ViewTransition/finished promise=] with |reason|.
</div>

Expand Down Expand Up @@ -1266,23 +1266,23 @@ urlPrefix: https://html.spec.whatwg.org/multipage/rendering.html; type: dfn;
</div>

<div algorithm>
To <dfn>call the DOM update callback</dfn> of a {{ViewTransition}} |transition|:
To <dfn>call the update callback</dfn> of a {{ViewTransition}} |transition|:

1. [=Assert=]: |transition|'s [=ViewTransition/phase=] is [=phases/before=] "`dom-update-callback-called`".
1. [=Assert=]: |transition|'s [=ViewTransition/phase=] is [=phases/before=] "`update-callback-called`".

1. Let |callbackPromise| be [=a new promise=] in |transition|'s [=relevant Realm=].

* If |transition|'s [=ViewTransition/DOM update callback=] is null, then resolve |callbackPromise|.
* If |transition|'s [=ViewTransition/update callback=] is null, then resolve |callbackPromise|.

* Otherwise, let |callbackPromise| be the result of [=/invoking=] |transition|'s [=ViewTransition/DOM update callback=].
* Otherwise, let |callbackPromise| be the result of [=/invoking=] |transition|'s [=ViewTransition/update callback=].

1. Set |transition|'s [=ViewTransition/phase=] to "`dom-update-callback-called`".
1. Set |transition|'s [=ViewTransition/phase=] to "`update-callback-called`".

1. [=promise/React=] to |callbackPromise|:

* If |callbackPromise| was resolved, then [=resolve=] |transition|'s [=ViewTransition/DOM updated promise=].
* If |callbackPromise| was resolved, then [=resolve=] |transition|'s [=ViewTransition/update callback done promise=].

* If |callbackPromise| was rejected with reason |r|, then [=reject=] |transition|'s [=ViewTransition/DOM updated promise=] with |r|.
* If |callbackPromise| was rejected with reason |r|, then [=reject=] |transition|'s [=ViewTransition/update callback done promise=] with |r|.
</div>

## [=Clear view transition=] ## {#clear-view-transition-algorithm}
Expand Down