From ad4295617918556863a10beb9674f075765bc329 Mon Sep 17 00:00:00 2001
From: Khushal Sagar <63884798+khushalsagar@users.noreply.github.com>
Date: Fri, 7 Oct 2022 11:08:02 -0400
Subject: [PATCH] Rename shared element transition -> view transition

---
 css-view-transitions-1/Overview.bs | 114 ++++++++++++++---------------
 1 file changed, 57 insertions(+), 57 deletions(-)

diff --git a/css-view-transitions-1/Overview.bs b/css-view-transitions-1/Overview.bs
index e4a5cab79da..29be48420f4 100644
--- a/css-view-transitions-1/Overview.bs
+++ b/css-view-transitions-1/Overview.bs
@@ -1,15 +1,15 @@
 <pre class='metadata'>
-Title: CSS Shared Element Transitions Module Level 1
-Shortname: css-shared-element-transitions
+Title: CSS View Transitions Module Level 1
+Shortname: css-view-transitions
 Level: 1
 Status: ED
 Group: csswg
-ED: https://drafts.csswg.org/css-shared-element-transitions-1/
+ED: https://drafts.csswg.org/css-view-transitions-1/
 Work Status: exploring
 Editor: Tab Atkins-Bittner, Google, http://xanthir.com/contact/, w3cid 42199
 Editor: Jake Archibald, Google
 Editor: Khushal Sagar, Google
-Abstract: This module defines the Single-Page Document-Transition API, along with associated properties and pseudo-elements.
+Abstract: This module defines the View Transition API, along with associated properties and pseudo-elements.
 </pre>
 
 <pre class=link-defaults>
@@ -42,7 +42,7 @@ spec:css-shapes-3; type:function; text:rect()
 
 <em>This section is non-normative.</em>
 
-Shared element transitions is a set of API that allow DOM changes to smoothly
+View Transitions is a set of API that allow DOM changes to smoothly
 animate between states. This is accomplished by leveraging user-agents ability
 to persist visual representations of state (i.e. snapshots) and blend them with
 current DOM state's visual output. The API also allows the animations to be
@@ -68,7 +68,7 @@ with a single call to the JavaScript API.
 
 The user-agent provides additional JavaScript functionality and promises to
 control and observe the state of the animations. These are described in detail
-in the {{DOMTransition}} section.
+in the {{ViewTransition}} section.
 
 After the callback has finished running, the user-agent creates a structure of
 pseudo-elements that represent both the "before" and "after" states of the
@@ -121,7 +121,7 @@ Note that because these APIs are an enhancement to the DOM change, some principl
     on `NavigateEvent`</a> is an example of a feature developers could use to
     handle this.
 * Although the transition API allows DOM changes to be asynchronous via the
-    {{DOMTransitionInit/updateDOM}} callback, the transition API is not
+    {{ViewTransitionInit/updateDOM}} callback, the transition API is not
     responsible for queuing or otherwise scheduling the DOM changes, beyond the
     scheduling needed for the transition itself. Some asynchronous DOM changes
     can happen concurrently (e.g if they're happening within independent
@@ -434,7 +434,7 @@ A {{Document}} additionally has:
 
 <dl dfn-for="document">
     : <dfn>active DOM transition</dfn>
-    :: a {{DOMTransition}} or null. Initially null.
+    :: a {{ViewTransition}} or null. Initially null.
 
     : <dfn>transition suppressing rendering</dfn>
     :: a boolean. Initially false.
@@ -446,33 +446,33 @@ A {{Document}} additionally has:
 
 <script type=idl>
 partial interface Document {
-    DOMTransition createTransition(DOMTransitionInit init);
+    ViewTransition createTransition(ViewTransitionInit init);
 };
 
-dictionary DOMTransitionInit {
+dictionary ViewTransitionInit {
     required UpdateDOMCallback updateDOM;
 };
 
 callback UpdateDOMCallback = Promise<any> ();
 </script>
 
-### {{Document/createTransition()}} ### {#DOMTransition-prepare}
+### {{Document/createTransition()}} ### {#ViewTransition-prepare}
 
 <div algorithm>
     The [=method steps=] for
     <dfn method for=Document>createTransition(|init|)</dfn>
     are as follows:
 
-    1. Let |transition| be a new {{DOMTransition}} object in [=this's=] [=relevant Realm=].
+    1. Let |transition| be a new {{ViewTransition}} object in [=this's=] [=relevant Realm=].
 
-    1. Set |transition|'s [=DOMTransition/DOM update callback=] to |init|[{{DOMTransitionInit/updateDOM}}].
+    1. Set |transition|'s [=ViewTransition/DOM update callback=] to |init|[{{ViewTransitionInit/updateDOM}}].
 
     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 page transition=] |document|'s [=active DOM transition=]
         with an "{{AbortError}}" {{DOMException}} in [=this's=] [=relevant Realm=].
 
-        Note: This can result in two asynchronous [=DOMTransition/DOM update
+        Note: This can result in two asynchronous [=ViewTransition/DOM 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
@@ -544,11 +544,11 @@ callback UpdateDOMCallback = Promise<any> ();
     </pre>
 </div>
 
-## The {{DOMTransition}} interface ## {#the-domtransition-interface}
+## The {{ViewTransition}} interface ## {#the-domtransition-interface}
 
 <script type=idl>
 [Exposed=Window]
-interface DOMTransition {
+interface ViewTransition {
     undefined skipTransition();
     readonly attribute Promise<undefined> finished;
     readonly attribute Promise<undefined> ready;
@@ -557,15 +557,15 @@ interface DOMTransition {
 </script>
 
 <div class="note">
-    The {{DOMTransition}} represents and controls
+    The {{ViewTransition}} represents and controls
     a single same-document transition. That is, it controls a transition where the
     starting and ending document are the same, possibly with changes to the
     document's DOM structure.
 </div>
 
-A {{DOMTransition}} has the following:
+A {{ViewTransition}} has the following:
 
-<dl dfn-for="DOMTransition">
+<dl dfn-for="ViewTransition">
     : <dfn>tagged elements</dfn>
     :: a [=/map=],
         whose keys are [=page transition tags=] and whose values are [=captured elements=].
@@ -595,18 +595,18 @@ A {{DOMTransition}} has the following:
         Initially [=a new promise=] in [=this's=] [=relevant Realm=].
 </dl>
 
-The {{DOMTransition/finished}} [=getter steps=] are to return [=this's=] [=DOMTransition/finished promise=].
+The {{ViewTransition/finished}} [=getter steps=] are to return [=this's=] [=ViewTransition/finished promise=].
 
-The {{DOMTransition/ready}} [=getter steps=] are to return [=this's=] [=DOMTransition/ready promise=].
+The {{ViewTransition/ready}} [=getter steps=] are to return [=this's=] [=ViewTransition/ready promise=].
 
-The {{DOMTransition/domUpdated}} [=getter steps=] are to return [=this's=] [=DOMTransition/DOM updated promise=].
+The {{ViewTransition/domUpdated}} [=getter steps=] are to return [=this's=] [=ViewTransition/DOM updated promise=].
 
-### {{DOMTransition/skipTransition()}} ### {#DOMTransition-skipTransition}
+### {{ViewTransition/skipTransition()}} ### {#ViewTransition-skipTransition}
 
 <div algorithm>
-    The [=method steps=] for <dfn method for="DOMTransition">skipTransition()</dfn> are:
+    The [=method steps=] for <dfn method for="ViewTransition">skipTransition()</dfn> are:
 
-    1. If [=this=]'s [=DOMTransition/phase=] is not "`done`",
+    1. If [=this=]'s [=ViewTransition/phase=] is not "`done`",
         then [=skip the page transition=] for [=this=]
         with an "{{AbortError}}" {{DOMException}}.
 </div>
@@ -656,18 +656,18 @@ The {{DOMTransition/domUpdated}} [=getter steps=] are to return [=this's=] [=DOM
 
     1. If |document|'s [=document/active DOM transition=] is not null, then:
 
-        1. If |document|'s [=document/active DOM transition=]'s [=DOMTransition/phase=] is "`pending-capture`", then [=perform an outgoing capture=] with |document|'s [=document/active DOM transition=].
+        1. If |document|'s [=document/active DOM transition=]'s [=ViewTransition/phase=] is "`pending-capture`", then [=perform an outgoing capture=] with |document|'s [=document/active DOM transition=].
 
-        1. Otherwise, if |document|'s [=document/active DOM transition=]'s [=DOMTransition/phase=] is "`animating`", then [=update transition DOM=] for |document|'s [=document/active DOM transition=].
+        1. Otherwise, if |document|'s [=document/active DOM transition=]'s [=ViewTransition/phase=] is "`animating`", then [=update transition DOM=] for |document|'s [=document/active DOM transition=].
 </div>
 
 ## [=Perform an outgoing capture=] ## {#perform-an-outgoing-capture-algorithm}
 
 <div algorithm>
-    To <dfn>perform an outgoing capture</dfn> given a {{DOMTransition}} |transition|,
+    To <dfn>perform an outgoing capture</dfn> given a {{ViewTransition}} |transition|,
         perform the following steps:
 
-    1. Let |taggedElements| be |transition|'s [=DOMTransition/tagged elements=].
+    1. Let |taggedElements| be |transition|'s [=ViewTransition/tagged elements=].
 
     1. Let |usedTransitionTags| be a new [=/set=] of strings.
 
@@ -740,17 +740,17 @@ The {{DOMTransition/domUpdated}} [=getter steps=] are to return [=this's=] [=DOM
             Note: A task is queued here because the texture read back in [=capturing the image=] may be async,
                 although the render steps in the HTML spec act as if it's synchronous.
 
-        1. If |transition|'s [=DOMTransition/phase=] is "`done`", then abort these steps.
+        1. If |transition|'s [=ViewTransition/phase=] is "`done`", then abort these steps.
 
             Note: This happens if |transition| was [=skip the page transition|skipped=] before this point.
 
         1. [=Call the DOM update callback=] of |transition|.
 
-        1. [=promise/React=] to |transition|'s [=DOMTransition/DOM updated promise=]:
+        1. [=promise/React=] to |transition|'s [=ViewTransition/DOM updated promise=]:
 
             * If the promise does not settle within an implementation-defined timeout, then:
 
-                1. If |transition|'s [=DOMTransition/phase=] is "`done`", then return.
+                1. If |transition|'s [=ViewTransition/phase=] is "`done`", then return.
 
                     Note: This happens if |transition| was [=skip the page transition|skipped=] before this point.
 
@@ -758,7 +758,7 @@ The {{DOMTransition/domUpdated}} [=getter steps=] are to return [=this's=] [=DOM
 
             * If the promise was fulfilled, then:
 
-                1. If |transition|'s [=DOMTransition/phase=] is "`done`", then return.
+                1. If |transition|'s [=ViewTransition/phase=] is "`done`", then return.
 
                     Note: This happens if |transition| was [=skip the page transition|skipped=] before this point.
 
@@ -809,11 +809,11 @@ The {{DOMTransition/domUpdated}} [=getter steps=] are to return [=this's=] [=DOM
 
                     Note: The frame-by-frame parts of the animation are handled in [=update transition DOM=].
 
-                1. [=Resolve=] [=DOMTransition/ready promise=].
+                1. [=Resolve=] [=ViewTransition/ready promise=].
 
             * If the promise was rejected with reason |r|, then:
 
-                1. If |transition|'s [=DOMTransition/phase=] is "`done`", then return.
+                1. If |transition|'s [=ViewTransition/phase=] is "`done`", then return.
 
                     Note: This happens if |transition| was [=skip the page transition|skipped=] before this point.
 
@@ -823,19 +823,19 @@ The {{DOMTransition/domUpdated}} [=getter steps=] are to return [=this's=] [=DOM
 ## Skip the page transition ## {#skip-the-page-transition-algorithm}
 
 <div algorithm>
-    To <dfn>skip the page transition</dfn> for {{DOMTransition}} |transition| with reason |reason|:
+    To <dfn>skip the page transition</dfn> for {{ViewTransition}} |transition| with reason |reason|:
 
     1. Let |document| be |transition|'s [=relevant global object's=] [=associated document=].
 
     1. [=Assert=]: |document|'s [=document/active DOM transition=] is |transition|.
 
-    1. [=Assert=]: |transition|'s [=DOMTransition/phase=] is not "`done`".
+    1. [=Assert=]: |transition|'s [=ViewTransition/phase=] is not "`done`".
 
-    1. If |transition|'s [=DOMTransition/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=] "`dom-update-callback-called`", then [=call the DOM update callback=] of |transition|.
 
     1. Set [=document/transition suppressing rendering=] to false.
 
-    1. If |transition|'s [=DOMTransition/phase=] is equal to or [=phases/after=] "`animating`", then:
+    1. If |transition|'s [=ViewTransition/phase=] is equal to or [=phases/after=] "`animating`", then:
 
         1. Remove all associated [=page-transition pseudo-elements=] from |document|.
 
@@ -843,13 +843,13 @@ The {{DOMTransition/domUpdated}} [=getter steps=] are to return [=this's=] [=DOM
 
             Issue: There needs to be a definition/link for "associated".
 
-    1. Set |transition|'s [=DOMTransition/phase=] to "`done`".
+    1. Set |transition|'s [=ViewTransition/phase=] to "`done`".
 
     1. Set |document|'s [=document/active DOM transition=] to null.
 
-    1. [=Reject=] |transition|'s [=DOMTransition/ready promise=] with |reason|.
+    1. [=Reject=] |transition|'s [=ViewTransition/ready promise=] with |reason|.
 
-    1. [=Reject=] |transition|'s [=DOMTransition/finished promise=] with |reason|.
+    1. [=Reject=] |transition|'s [=ViewTransition/finished promise=] with |reason|.
 </div>
 
 ## [=Capture the image=] ## {#capture-the-image-algorithm}
@@ -890,7 +890,7 @@ The {{DOMTransition/domUpdated}} [=getter steps=] are to return [=this's=] [=DOM
 ## [=Update transition DOM=] ## {#update-transition-dom-algorithm}
 
 <div algorithm>
-    To <dfn>update transition DOM</dfn> given a {{DOMTransition}} |transition|:
+    To <dfn>update transition DOM</dfn> given a {{ViewTransition}} |transition|:
 
     1. Let |document| be |transition|'s [=relevant global object's=] [=associated document=].
 
@@ -903,7 +903,7 @@ The {{DOMTransition/domUpdated}} [=getter steps=] are to return [=this's=] [=DOM
 
         Issue: There needs to be a definition/link for "active animation".
 
-        1. Set |transition|'s [=DOMTransition/phase=] to "`done`".
+        1. Set |transition|'s [=ViewTransition/phase=] to "`done`".
 
         1. Remove all associated [=page-transition pseudo-elements=] from |document|.
 
@@ -913,11 +913,11 @@ The {{DOMTransition/domUpdated}} [=getter steps=] are to return [=this's=] [=DOM
 
         1. Set |document|'s [=document/active DOM transition=] to null.
 
-        1. [=Resolve=] |transition|'s[=DOMTransition/finished promise=].
+        1. [=Resolve=] |transition|'s[=ViewTransition/finished promise=].
 
         1. Return.
 
-    1. [=map/For each=] |tag| -> |capturedElement| of |transition|'s [=DOMTransition/tagged elements=]:
+    1. [=map/For each=] |tag| -> |capturedElement| of |transition|'s [=ViewTransition/tagged elements=]:
 
         1. If |capturedElement| has an "incoming element", run [=capture the image=]
             on |capturedElement|'s "incoming element" and update the displayed
@@ -957,7 +957,7 @@ The {{DOMTransition/domUpdated}} [=getter steps=] are to return [=this's=] [=DOM
 ## [=Animate a page transition=] ## {#animate-a-page-transition-algorithm}
 
 <div algorithm>
-    To <dfn>animate a page transition</dfn> given a {{DOMTransition}} |transition|:
+    To <dfn>animate a page transition</dfn> given a {{ViewTransition}} |transition|:
 
     1. Generate a <<keyframe>> named "page-transition-fade-out" in
         [=user-agent origin=] as follows:
@@ -989,7 +989,7 @@ The {{DOMTransition/domUpdated}} [=getter steps=] are to return [=this's=] [=DOM
             }
         </code></pre>
 
-    1. [=map/For each=] |tag| -> |capturedElement| of |transition|'s [=DOMTransition/tagged elements=]:
+    1. [=map/For each=] |tag| -> |capturedElement| of |transition|'s [=ViewTransition/tagged elements=]:
 
         1. If neither of |capturedElement|'s [=captured element/outgoing image=] or [=captured element/incoming element=] is null:
 
@@ -1021,7 +1021,7 @@ The {{DOMTransition/domUpdated}} [=getter steps=] are to return [=this's=] [=DOM
             </code></pre>
 
 
-    1. Set |transition|'s [=DOMTransition/phase=] to "`animating`".
+    1. Set |transition|'s [=ViewTransition/phase=] to "`animating`".
 
     Issue: How are keyframes scoped to user-agent origin? We could decide
         scope based on whether `animation-name` in the computed style
@@ -1034,11 +1034,11 @@ The {{DOMTransition/domUpdated}} [=getter steps=] are to return [=this's=] [=DOM
 ## [=Create transition pseudo-elements=] ## {#create-transition-pseudo-elements-algorithm}
 
 <div algorithm>
-    To <dfn>create transition pseudo-elements</dfn> for a {{DOMTransition}} |transition|:
+    To <dfn>create transition pseudo-elements</dfn> for a {{ViewTransition}} |transition|:
 
     1. Let |transitionRoot| be the result of creating a new ''::page-transition'' pseudo-element.
 
-    1. [=map/For each=] |transitionTag| → |capturedElement| of |transition|'s [=DOMTransition/tagged elements=]:
+    1. [=map/For each=] |transitionTag| → |capturedElement| of |transition|'s [=ViewTransition/tagged elements=]:
 
         1. Let |container| be the result of creating a new ''::page-transition-container'' pseudo-element with the tag |transitionTag|.
 
@@ -1113,18 +1113,18 @@ The {{DOMTransition/domUpdated}} [=getter steps=] are to return [=this's=] [=DOM
 </div>
 
 <div algorithm>
-    To <dfn>call the DOM update callback</dfn> of a {{DOMTransition}} |transition|:
+    To <dfn>call the DOM update callback</dfn> of a {{ViewTransition}} |transition|:
 
-    1. [=Assert=]: |transition|'s [=DOMTransition/phase=] is [=phases/before=] "`dom-update-callback-called`".
+    1. [=Assert=]: |transition|'s [=ViewTransition/phase=] is [=phases/before=] "`dom-update-callback-called`".
 
-    1. Let |callbackPromise| be the result of [=/invoking=] |transition|'s [=DOMTransition/DOM update callback=].
+    1. Let |callbackPromise| be the result of [=/invoking=] |transition|'s [=ViewTransition/DOM update callback=].
 
-    1. Set |transition|'s [=DOMTransition/phase=] to "`dom-update-callback-called`".
+    1. Set |transition|'s [=ViewTransition/phase=] to "`dom-update-callback-called`".
 
     1. [=promise/React=] to |callbackPromise|:
 
-        * If |callbackPromise| was fulfilled, then [=resolve=] |transition|'s [=DOMTransition/DOM updated promise=].
+        * If |callbackPromise| was fulfilled, then [=resolve=] |transition|'s [=ViewTransition/DOM updated promise=].
 
-        * If |callbackPromise| was rejected with reason |r|, then [=reject=] |transition|'s [=DOMTransition/DOM updated promise=] with |r|.
+        * If |callbackPromise| was rejected with reason |r|, then [=reject=] |transition|'s [=ViewTransition/DOM updated promise=] with |r|.
 
 </div>