From 5cdffe601d254ff9b295910236ae70ae8e26266e Mon Sep 17 00:00:00 2001 From: Kevin Ellis Date: Tue, 8 Aug 2023 19:14:19 +0000 Subject: [PATCH 01/22] Checkpoint --- web-animations-2/Overview.bs | 81 +++++++++++++++++++++++------------- 1 file changed, 51 insertions(+), 30 deletions(-) diff --git a/web-animations-2/Overview.bs b/web-animations-2/Overview.bs index 43e98de226d..ab907adfb46 100644 --- a/web-animations-2/Overview.bs +++ b/web-animations-2/Overview.bs @@ -49,6 +49,34 @@ dl.switch > [data-md] > p { dl.switch > dt > ul > li { text-indent: 0; } + +/* Override settings in base.css */ +/* Inconsistencies in the handling of dl.switch. Sometimes it is expanded to + div.switch > dl, while other times it remains dl.switch. The inconsistency + probably suggests an indentation problem. + TODO: Remove dl.switch > dt rule once the inconsistencies are addressed. */ +dl.switch > dt { + /* "display: list-item" in base.css, which triggers an increase in + numbering resulting in gaps in the numbered list items. */ + /* display: block !important; */ + /* text-indent: 0 !important; */ +} + +/* +div.switch > dl > dt:before, +dl.switch > dt:before { + content: '\21AA'; + padding: 0 0.5em 0 0; + display: inline-block; + width: 1em; + text-align: right; + line-height: 0.5em; +} + +div.switch > dl > dt > p { + display: inline; +} +*/ 
@@ -59,11 +87,11 @@ Work Status: Exploring
 Shortname: web-animations
 ED: https://drafts.csswg.org/web-animations-2/
 TR: https://www.w3.org/TR/web-animations-2/
-Version history: https://github.com/w3c/csswg-drafts/commits/master/web-animations-2
+Version history: https://github.com/w3c/csswg-drafts/commits/main/web-animations-2
 Level: 2
 
 Group: csswg
-!Participate: Fix the text through GitHub
+!Participate: Fix the text through GitHub
 !Participate: Join the ‘waapi’ channel on the Animation at Work slack
 !Participate: IRC: #webanimations on W3C's IRC
 Repository: w3c/csswg-drafts
@@ -546,8 +574,7 @@ is as follows:
 1.  Let previous current time be animation's
     [=animation/current time=].
 
-    Note: This is the [=animation/current time=] after applying the changes from the
-    previous step which may cause the [=animation/current time=] to become
+    Note: This is the [=animation/current time=] after applying the changes from the previous step which may cause the [=animation/current time=] to become
     unresolved.
 
 1.  [=Apply any pending playback rate=] on |animation|.
@@ -582,6 +609,7 @@ is as follows:
     animation with the did seek flag set to true, and
     the synchronously notify flag set to false.
 
+
 
Playing an animation

 
 The procedure to play an animation, animation, given
@@ -595,34 +623,31 @@ as CSS Animations [[CSS-ANIMATIONS-1]].
     animation has a pending pause task, and false otherwise.
 1.  Let has pending ready promise be a boolean flag that is
     initially false.
-1.  Let seek time be a time value that is initially unresolved.
 1.  Let has finite timeline be true if |animation| has an associated
     timeline that is not
     [=monotonically increasing timeline|monotonically increasing=].
 1.  Let previous current time be the |animation|'s
     [=animation/current time=]
-1.  If |reset current time on resume| is set:
-
-    * Set previous current time to unresolved.
-    * Set the |reset current time on resume| flag to false.
-
+1.  Let enable seek be true if the auto-rewind flag is
+    true and has finite timeline is false. Otherwise, initialize to
+    false.
 1.  Perform the steps corresponding to the first matching
     condition from the following, if any:
 
-    

+    

 
         :   If |animation|'s [=effective playback rate=] > 0,
-            the auto-rewind flag is true and either
+            enable seek is true and either
             animation's:
 
             *   previous current time is unresolved, or
             *   previous current time < zero, or
             *   previous current time ≥ associated effect end,
 
-        ::  Set seek time to zero.
+        ::  Set the |animation|'s hold time to zero.
 
         :   If |animation|'s [=effective playback rate=] < 0,
-            the auto-rewind flag is true and either
+            enable seek is true and either
             animation's:
 
             *   previous current time is unresolved, or
@@ -635,31 +660,27 @@ as CSS Animations [[CSS-ANIMATIONS-1]].
                 ::  throw an "{{InvalidStateError}}" {{DOMException}} and
                     abort these steps.
                 :   Otherwise,
-                ::  Set seek time to |animation|'s associated effect end.
+                ::  Set the |animation|'s hold time to the
+                    |animation|'s associated effect end.
 
             

 
         :   If |animation|'s [=effective playback rate=] = 0 and |animation|'s
             [=animation/current time=] is [=unresolved=],
 
-        ::  Set seek time to zero.
-
-    
-
-1.  If |seek time| is resolved,
+        ::  Set the |animation|'s hold time to zero.
 
-        

+    
 
-            :   If |has finite timeline| is true,
-            ::  1.  Set animation's [=animation/start time=] to
-                    seek time.
-                1.  Let |animation|'s [=hold time=] be unresolved.
-                1.  [=Apply any pending playback rate=] on |animation|.
+1.  If |has finite timeline| and the |auto-rewind| flag is true:
+    *   Set the flag |auto align start time| to true.
+    *   Set the |animation|'s hold time to the |animation|'s
+        [=animation/current time=]
 
-            :   Otherwise,
-            ::  1.  Set animation's hold time to
-                    seek time.
-        

+    Note: If play is called for a CSS animation during style update,
+    the |animation|'s [=start time=] cannot be reliably calculated until post
+    layout since the start time is to align with the start or end of the animation
+    range (depending on the [=playback rate=]).
 
 1.  If animation's hold time is resolved,
     let its [=animation/start time=] be unresolved.

From e76d19a7f9fe5f81723eb30ecced2192a42a8c8a Mon Sep 17 00:00:00 2001
From: Kevin Ellis 
Date: Wed, 9 Aug 2023 14:38:38 +0000
Subject: [PATCH 02/22] Checkpoint

---
 web-animations-2/Overview.bs | 55 +++++++++++++-----------------------
 1 file changed, 19 insertions(+), 36 deletions(-)

diff --git a/web-animations-2/Overview.bs b/web-animations-2/Overview.bs
index 9742b02451c..cdd61830f2e 100644
--- a/web-animations-2/Overview.bs
+++ b/web-animations-2/Overview.bs
@@ -6,6 +6,7 @@
   background: #efe;
   border: green 1px dotted;
 }
+
 @media (prefers-color-scheme: dark) {
   .informative-bg {
     background: rgba(255, 255, 255, .05);
@@ -26,6 +27,11 @@ div.informative-bg h4 {
   background: none;
 }
 
+/* crbug.com/1471465 */
+dl.switch > dt {
+  counter-increment: list-item 0;
+}
+
 .attributes::before, .methods::before,
 .parameters::before, .exceptions::before,
 .constructors::before, .members::before {
@@ -42,41 +48,17 @@ div.informative-bg h4 {
 .constructors::before { content: 'Constructors' }
 .members::before { content: 'Dictionary members' }
 
-dl.switch  > [data-md] > p {
-  display: inline;
-}
-
-dl.switch > dt > ul > li {
-  text-indent: 0;
-}
-
-/* Override settings in base.css */
-/* Inconsistencies in the handling of dl.switch. Sometimes it is expanded to
-   div.switch > dl, while other times it remains dl.switch. The inconsistency
-   probably suggests an indentation problem.
-   TODO: Remove dl.switch > dt rule once the inconsistencies are addressed. */
-dl.switch > dt {
-  /* "display: list-item" in base.css, which triggers an increase in
-     numbering resulting in gaps in the numbered list items. */
-  /* display: block !important; */
-  /* text-indent:  0 !important; */
+.param,
+.exceptionname,
+.estype,
+.esvalue {
+  font-weight: bold;
 }
 
-/*
-div.switch > dl > dt:before,
-dl.switch > dt:before {
-  content: '\21AA';
-  padding: 0 0.5em 0 0;
-  display: inline-block;
-  width: 1em;
-  text-align: right;
-  line-height: 0.5em;
+.formula {
+  display: block;
+  margin: .5em 2em;
 }
-
-div.switch > dl > dt > p {
-  display: inline;
-}
-*/
 
 
 
@@ -311,6 +293,7 @@ follows:
         ::  Set |previous progress| = |previous current time| /
             [=end time=]
     
+
 1.  Let |from finite timeline| be true if |old timeline| is not null and
     not [=monotonically increasing timeline|monotonically increasing=].
 1.  Let |to finite timeline| be true if |timeline| is not null and not
@@ -634,7 +617,7 @@ as CSS Animations [[CSS-ANIMATIONS-1]].
 1.  Perform the steps corresponding to the first matching
     condition from the following, if any:
 
-    

+    

 
         :   If |animation|'s [=effective playback rate=] > 0,
             enable seek is true and either
@@ -670,7 +653,7 @@ as CSS Animations [[CSS-ANIMATIONS-1]].
 
         ::  Set the |animation|'s hold time to zero.
 
-    

+    
 
 1.  If |has finite timeline| and the |auto-rewind| flag is true:
     *   Set the flag |auto align start time| to true.
@@ -1002,7 +985,7 @@ For an animation effect, the inherited time at
 a given moment is based on the first matching condition from the
 following:
 
-

+

 
 :   If the animation effect has a parent group,
 ::  the inherited time is the parent group's current
@@ -1014,7 +997,7 @@ following:
 :   Otherwise,
 ::  the inherited time is unresolved.
 
-

+
 
 The local time of an animation effect is the
 animation effect's inherited time minus its 
Date: Fri, 11 Aug 2023 15:59:26 +0000
Subject: [PATCH 03/22] [web-animaitons-2][scroll-animations-1] Document
 deferred start time

---
 scroll-animations-1/Overview.bs |  92 +++++++++++++++++++++------
 web-animations-1/Overview.bs    |   6 +-
 web-animations-2/Overview.bs    | 106 ++++++++++++++++++++------------
 3 files changed, 143 insertions(+), 61 deletions(-)

diff --git a/scroll-animations-1/Overview.bs b/scroll-animations-1/Overview.bs
index 4315e999890..dfd133548c6 100644
--- a/scroll-animations-1/Overview.bs
+++ b/scroll-animations-1/Overview.bs
@@ -1,3 +1,9 @@
+
 
 Title: Scroll-driven Animations
 Group: CSSWG
@@ -32,6 +38,7 @@ spec:web-animations-1;
 	type:attribute; text:currentTime
 	type:dfn;
 		text:current time
+		text:start time
 		text:active interval
 		text:start delay
 		text:end delay
@@ -39,12 +46,21 @@ spec:web-animations-1;
 		text:iteration count
 		text:iteration duration
 		text:finished play state
+		text:play state
+		text:effective playback rate
+		text:effect value
 spec:html;
 	type:dfn; for:/; text:browsing context
 	type:method; text:requestAnimationFrame()
 spec: cssom-view-1; type: dfn;
 	text: overflow direction;
 	text: css layout box
+spec:css-writing-modes-4; type: dfn;
+	text:start
+	text:end
+spec:infra; type:dfn; text:user agent
+spec:selectors-4; type:dfn; text:selector
+spec:web-animations-2: type:dfn; text:auto-aligned start time
 

 
 # Introduction # {#intro}
@@ -89,7 +105,7 @@ spec: cssom-view-1; type: dfn;
 	to CSS Animations [[CSS-ANIMATIONS-1]].
 	To the extent the behavior of these CSS properties is described
 	in terms of the programming interfaces,
-	[=User Agents=] that do not support scripting
+	[=user agent|User Agents=] that do not support scripting
 	may still conform to this specification
 	by implementing the CSS features to behave
 	as if the underlying programming interfaces were in place.
@@ -145,9 +161,9 @@ spec: cssom-view-1; type: dfn;
 
 	Progress (the [=timeline/current time=]) for a [=scroll progress timeline=]
 	is calculated as:
-	[=scroll offset=] ÷
-	([=scrollable overflow=] size −
-		[=scroll container=] size)
+	[=scroll offset=] ÷
+	([=scrollable overflow=] size −
+		[=scroll container=] size)
 
 	If the 0% position and 100% position coincide
 	(i.e. the denominator in the [=timeline/current time=] formula is zero),
@@ -630,7 +646,7 @@ spec: cssom-view-1; type: dfn;
 				to the {{ViewTimeline/subject}}’s
 				nearest ancestor [=scroll container=] element.
 
-			1.  If a {{DOMString}} value is provided as an |inset|,
+			1.  If a {{DOMString}} value is provided as an inset,
 				parse it as a <<'view-timeline-inset'>> value;
 				if a sequence is provided,
 				the first value represents the start inset
@@ -768,8 +784,8 @@ spec: cssom-view-1; type: dfn;
 	to a finite [=attachment range=]--
 	which may be further limited by 'animation-range'
 	(see [[#timeline-ranges]]).
-	The animation’s  iterations ('animation-iteration-count')
+	The animation’s 
+	iterations ('animation-iteration-count')
 	are set within the limits of this finite range.
 	If the specified duration is ''animation-duration/auto'',
 	then 
@@ -874,12 +890,12 @@ spec: cssom-view-1; type: dfn;
 	and the animationend event will fire
 	at the start of the [=active interval=].
 	However, since the finish event
-	is about entering the [=finished play state=],
+	is about entering the [=play state/finished|finished play state=],
 	it only fires when scrolling forwards.
 
 # Frame Calculation Details # {#frames}
 
-## HTML Processing Model: Event loop
+## HTML Processing Model: Event loop ## {#html-processing-model-event-loop}
 
 	The ability for scrolling to drive the progress of an animation,
 	gives rise to the possibility of layout cycles,
@@ -895,9 +911,8 @@ spec: cssom-view-1; type: dfn;
 	any created [=scroll progress timelines=] or [=view progress timelines=] are collected into a stale timelines set.
 	After step 7.14 if any timelines' [=named timeline ranges=] have changed,
 	these timelines are added to the [=stale timelines=] set.
-	If there are any [=stale timelines=], they now update their current time and associated ranges,
-	the set of [=stale timelines=] is cleared and
-	we run and we run an additional step to recalculate styles and update layout.
+	If there are any [=stale timelines=], they now update their current time and associated ranges, the set of [=stale timelines=] is cleared and
+	we run an additional step to recalculate styles and update layout.
 
 	Note: We check for layout changes after dispatching any {{ResizeObserver}}s intentionally
 	to take programmatically sized elements into account.
@@ -908,7 +923,7 @@ spec: cssom-view-1; type: dfn;
 	and be updated at the same time.
 
 	Note: Without this additional round of style and layout,
-	[=initially stale=] timelines would remain stale
+	[=stale timelines|initially stale=] timelines would remain stale
 	(i.e. they would not have a current time)
 	for the remainder of the frame where the timeline was created.
 	This means that animations linked to such a timeline
@@ -917,9 +932,9 @@ spec: cssom-view-1; type: dfn;
 	in the rendered output.
 
 	Note: This section has no effect on forced style and layout
-	calculations triggered by {{Window/getComputedStyle()|getComputedStyle()}} or similar.
-	In other words, [=initially stale=] timelines are visible as such
-	through those APIs.
+	calculations triggered by {{Window/getComputedStyle()|getComputedStyle()}} or
+	similar. In other words, [=stale timelines|initially stale=] timelines are
+	visible as such through those APIs.
 
 	If the final style and layout update
 	would result in a change in the time or scope (see 'timeline-scope')
@@ -938,13 +953,50 @@ spec: cssom-view-1; type: dfn;
 	and the state of a scroll-driven animation
 	may be inconsistent in the composited frame.
 
-# Privacy Considerations
+## Updating an auto-aligned start time ## {#updating-auto-aligned-start-time}
 
-  There are no known privacy impacts of the features in this specification.
+	When updating timeline current time, the [=start time=] of any attached
+	animation is conditionally updated. The procedure for
+	calculating auto-aligned start times
+	is as follows:
 
-# Security Considerations
+	1.	For each attached animation:
 
-  There are no known security impacts of the features in this specification.
+		1. If the animation does not have an [=auto-aligned start time=], abort
+			this procedure.
+
+		1. If [=play state=] is idle or [=hold time=] is resolved and
+			[=play state=] is not finished, abort this procedure.
+
+		1. Let |start offset| be the resolved scroll offset as a percentage
+			corresponding to the start of the [=animation attachment range=], or
+			0% if unresolved.
+
+		1. Let |end offset| be the resolved scroll offset as a percentage
+			corresponding to the end of the [=animation attachment range=], or
+			100% if unresolved.
+
+		1.  Set [=start time=] to |start offset| if [=effective playback rate=]
+			≥ 0, and |end offset| otherwise.
+
+		1.  Clear [=hold time=].
+
+	Note: The [=start time=] is auto-aligned unless [=animation/current time=] or
+	[=start time=] are explicitly set via the web-animations API, which makes the
+	[=start time=] sticky.  Playing an animation implicitly resets the stickiness
+	of the [=start time=].
+
+	Note: A [=start time=] is still required for a pause-pending animation to
+	properly align to the animation range. In this case, [=hold time=] will be
+	set when the pending pause microtask is run.
+
+# Privacy Considerations # {#privacy-considerations}
+
+	There are no known privacy impacts of the features in this specification.
+
+# Security Considerations # {#security-considerations}
+
+	There are no known security impacts of the features in this specification.
 
 # Appendix A: Timeline Ranges # {#timeline-ranges}
 
diff --git a/web-animations-1/Overview.bs b/web-animations-1/Overview.bs
index 7512553e1aa..de0c95f5ce4 100644
--- a/web-animations-1/Overview.bs
+++ b/web-animations-1/Overview.bs
@@ -2108,7 +2108,7 @@ Waiting for the associated effect
 
   Initially the [=pending playback rate=] of an [=animation=] is unset.
 
-  The effective playback rate of an [=animation=] is
+  The effective playback rate of an [=animation=] is
   its [=pending playback rate=], if set,
   otherwise it is the animation's [=playback rate=].
 
@@ -2536,7 +2536,7 @@ Animation effects {#animation-effects}
 
 
 
-  [=Animation effects=] define an active interval
+  [=Animation effects=] define an active interval
   which is the period of time during which the effect
   is scheduled to produce its effect--
   with the exception of [=fill modes=],
@@ -3226,7 +3226,7 @@ Core animation effect calculations {#core-animation-effect-calculations}
   The [=active duration=] is calculated as follows:
 
   

-    active duration =
+    active duration =
        iteration duration × iteration count
   

 
diff --git a/web-animations-2/Overview.bs b/web-animations-2/Overview.bs
index cdd61830f2e..b0b3ae88ba3 100644
--- a/web-animations-2/Overview.bs
+++ b/web-animations-2/Overview.bs
@@ -47,18 +47,6 @@ dl.switch > dt {
 .exceptions::before { content: 'Exceptions' }
 .constructors::before { content: 'Constructors' }
 .members::before { content: 'Dictionary members' }
-
-.param,
-.exceptionname,
-.estype,
-.esvalue {
-  font-weight: bold;
-}
-
-.formula {
-  display: block;
-  margin: .5em 2em;
-}
 
 
 
@@ -147,6 +135,9 @@ urlPrefix: http://www.ecma-international.org/ecma-262/6.0/#sec-; type: dfn; spec
 
 
 spec:webidl; type:dfn; text:throw
+spec:scroll-animations-1; type:dfn;
+    text:scroll-driven animation
+    text:html-processing-model-event-loop
 

 
 
Delta specification

@@ -279,7 +270,7 @@ follows:
 1.  Let |previous play state| be |animation|'s [=play state=].
 1.  Let |previous current time| be the |animation|'s [=animation/current time=].
 1.  Set |previous progress| based in the first condition that applies:
-    

+    

         :   If |previous current time| is unresolved:
 
         ::  Set |previous progress| to unresolved.
@@ -299,7 +290,6 @@ follows:
 1.  Let |to finite timeline| be true if |timeline| is not null and not
     [=monotonically increasing timeline|monotonically increasing=].
 1.  Let the timeline of animation be new timeline.
-1.  Set the flag |reset current time on resume| to false.
 1.  Perform the steps corresponding to the first matching
     condition from the following, if any:
 
@@ -324,7 +314,6 @@ follows:
 
                     ::  If |previous progress| is resolved:
 
-                        1.  Set the flag |reset current time on resume| to true.
                         1.  Set [=animation/start time=] to unresolved.
                         1.  Set [=hold time=] to |previous progress| *
                             [=end time=].
@@ -464,6 +453,8 @@ an animation, animation, to seek time is as follows:
 
 1.  If valid seek time is false, abort this procedure.
 
+1.  Set |auto align start time| to false.
+
 1.  Update either animation's hold time or
     [=animation/start time=] as follows:
 
@@ -504,8 +495,6 @@ an animation, animation, to seek time is as follows:
 
 1.  Make animation's previous current time unresolved.
 
-1. Set the |reset current time on resume| flag to false.
-
 
 The procedure to set the current time of an animation,
 animation, to seek time is as follows:
@@ -538,6 +527,8 @@ is as follows:
 
 1.  If valid start time is false, abort this procedure.
 
+1.  Set |auto align start time| to false.
+
 1.  Let timeline time be the current time value of the
     timeline that animation is associated with.
     If there is no timeline associated with animation or the
@@ -557,7 +548,8 @@ is as follows:
 1.  Let previous current time be animation's
     [=animation/current time=].
 
-    Note: This is the [=animation/current time=] after applying the changes from the previous step which may cause the [=animation/current time=] to become
+    Note: This is the [=animation/current time=] after applying the changes from
+    the previous step which may cause the [=animation/current time=] to become
     unresolved.
 
 1.  [=Apply any pending playback rate=] on |animation|.
@@ -565,8 +557,6 @@ is as follows:
 1.  Set animation's [=animation/start time=] to
     new start time.
 
-1.  Set the |reset current time on resume| flag to false.
-
 1.  Update animation's hold time based
     on the first matching condition from the following,
 
@@ -617,7 +607,7 @@ as CSS Animations [[CSS-ANIMATIONS-1]].
 1.  Perform the steps corresponding to the first matching
     condition from the following, if any:
 
-    

+    

 
         :   If |animation|'s [=effective playback rate=] > 0,
             enable seek is true and either
@@ -661,9 +651,12 @@ as CSS Animations [[CSS-ANIMATIONS-1]].
         [=animation/current time=]
 
     Note: If play is called for a CSS animation during style update,
-    the |animation|'s [=start time=] cannot be reliably calculated until post
-    layout since the start time is to align with the start or end of the animation
-    range (depending on the [=playback rate=]).
+    the |animation|'s [=animation/start time=] cannot be reliably calculated
+    until post layout since the start time is to align with the start or end of
+    the animation range (depending on the [=playback rate=]).  In this case, the
+    animation is said to have an auto-aligned start
+    time, whereby the start time is automatically adjusted as needed to
+    align the animation's progress to the animation range.
 
 1.  If animation's hold time is resolved,
     let its [=animation/start time=] be unresolved.
@@ -674,10 +667,9 @@ as CSS Animations [[CSS-ANIMATIONS-1]].
     1.  Cancel that task.
     1.  Set has pending ready promise to true.
 
-1.  If the following four conditions are all satisfied:
+1.  If the following three conditions are all satisfied:
 
     * |animation|'s [=hold time=] is [=unresolved=], and
-    * |seek time| is [=unresolved=], and
     * |aborted pause| is false, and
     * |animation| does not have a [=pending playback rate=],
 
@@ -693,6 +685,12 @@ as CSS Animations [[CSS-ANIMATIONS-1]].
     1.  Assert that at least one of |animation|'s [=animation/start time=] or
         [=hold time=] is resolved.
 
+        Note: an animation is not ready while it has no
+        [=animation/start time=] or [=hold time=]. For a
+        [=scroll-driven animation=], the start-time is
+        determined when [=html-processing-model-event-loop|updating the
+        timeline=] if |auto align start time| is true.
+
     1.  Let ready time be the time value of
         the timeline associated with animation at the moment
         when animation became ready.
@@ -804,6 +802,20 @@ The procedure to [=pause an animation=] needs to refer not only to the
 Likewise, the procedure to [=pause an animation=] needs to include scheduling
 a task for updating [=custom effects=].
 
+Update the constraints for setting the seek time to only apply when using a
+monotonic timeline. A [=scroll-driven animation=] needs to defer setting the
+hold time until the animation range has been computed.
+
+Add the following steps after conditionally setting the hold time:
+
+>    If [=hold time=] and [=animation/start time=] are both unresolved.
+>    * Set the |auto align start time| flag to true
+
+Note: Setting the |auto align start time| flag forces an update of the start
+time when the timeline is updated, the pause-pending microtask sets the
+[=hold time=] based on the auto-aligned [=animation/start time=]. The animation
+is not ready until the animation has either a [=hold time=] or
+[=animation/start time=]
 
 
Canceling an animation

 
@@ -837,8 +849,8 @@ Add the following sentence:
 
 Adds the following text:
 
->     The associated effect of an animation is said to be      lt="directly associated with an animation">directly associated
+>     The associated effect of an animation is said to be
+>     directly associated
 >     with that animation.
 >
 >     Animation effects can be combined together into a hierarchy using
@@ -913,10 +925,10 @@ The normative description is updated as follows:
 >     delay is a property of the animation effect itself.
 >
 >     The lower bound of the active interval of an animation
->     effect, expressed in inherited time
->     space, is the sum of the      lt="animation effect start time">start time and the start
->     delay.
+>     effect, expressed in
+>     inherited time space, is the sum of the
+>     start time and the
+>     start delay.
 >
 >     These definitions are incorporated in the calculation of the local
 >     time (see [[#local-time-and-inherited-time]]) and active time.
@@ -985,7 +997,7 @@ For an animation effect, the inherited time at
 a given moment is based on the first matching condition from the
 following:
 
-

+

 
 :   If the animation effect has a parent group,
 ::  the inherited time is the parent group's current
@@ -2254,18 +2266,20 @@ Update the attribute type for currentTime.
 
 
The Animation interface

 
-Update the startTime and currentTime of the Animation interface as follows:
+Update the startTime and currentTime of the Animation interface, and add
+rangeStatrt and rangeEnd as follows:
 
 
 [Exposed=Window]
 partial interface Animation {
     attribute CSSNumberish?       startTime;
     attribute CSSNumberish?       currentTime;
+    attribute (TimelineRangeOffset or CSSNumericValue or CSSKeywordValue or DOMString)rangeStart;
+    attribute (TimelineRangeOffset or CSSNumericValue or CSSKeywordValue or DOMString) rangeEnd;
 };
 

 
-Replace [=animation/start time=] and [=animation/current time=] attribute
-descriptions with:
+Add or update attribute descriptions as follows:
 
 

 
@@ -2291,6 +2305,21 @@ descriptions with:
     > Setting this attribute follows the procedure to
     > set the current time of this object to the new value.
 
+Add:
+
+> :   rangeStart
+> ::  Specifies the start of the animation’s [=animation attachment range=].
+>     Setting the attribute follows the same rules as the KeyframeAnimationOption
+>     rangeStart.
+>     When reading the attribute, the returned value is either a
+>     {{TimelineRangeOffset}} or the {{DOMString}} normal.
+>
+> :  rangeEnd
+> ::  Specifies the end of the animation’s [=animation attachment range=].
+>     Setting the attribute follows the same rules as the KeyframeAnimationOption
+>      rangeEnd.
+>     When reading the attribute, the returned value is either a
+>     {{TimelineRangeOffset}} or the {{DOMString}} normal.
 

 
 
The AnimationEffect interface

@@ -2848,7 +2877,8 @@ interface SequenceEffect : GroupEffect {
 };
 

 
-

+

+
 :   constructor (sequence<AnimationEffect>? children,
     optional (unrestricted double or EffectTiming) timing)
 ::  The meaning and handling of each of the parameters in this
@@ -3109,7 +3139,7 @@ partial dictionary KeyframeAnimationOptions {
 
 Passing a {{CSSKeywordValue}} with a {{CSSKeywordValue/value}} other than "normal"
 as the {{KeyframeAnimationOptions/rangeStart}} or {{KeyframeAnimationOptions/rangeEnd}} value
-to any API defined to accept {{KeyframeAnimationsOptions}}
+to any API defined to accept {{KeyframeAnimationOptions}}
 [=throws=] a TypeError.
 
 Note: The {{TimelineRangeOffset/rangeName}} and {{TimelineRangeOffset/offset}}

From 5a189726c2905f41bbc1b016034e10a7c4fb83b0 Mon Sep 17 00:00:00 2001
From: Kevin Ellis 
Date: Mon, 14 Aug 2023 14:11:06 +0000
Subject: [PATCH 04/22] Cleanup

---
 web-animations-2/Overview.bs | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/web-animations-2/Overview.bs b/web-animations-2/Overview.bs
index b0b3ae88ba3..8c26a098bf5 100644
--- a/web-animations-2/Overview.bs
+++ b/web-animations-2/Overview.bs
@@ -815,7 +815,7 @@ Note: Setting the |auto align start time| flag forces an update of the start
 time when the timeline is updated, the pause-pending microtask sets the
 [=hold time=] based on the auto-aligned [=animation/start time=]. The animation
 is not ready until the animation has either a [=hold time=] or
-[=animation/start time=]
+[=animation/start time=].
 
 
Canceling an animation

 
@@ -2267,14 +2267,14 @@ Update the attribute type for currentTime.
 
The Animation interface

 
 Update the startTime and currentTime of the Animation interface, and add
-rangeStatrt and rangeEnd as follows:
+rangeStart and rangeEnd as follows:
 
 
 [Exposed=Window]
 partial interface Animation {
     attribute CSSNumberish?       startTime;
     attribute CSSNumberish?       currentTime;
-    attribute (TimelineRangeOffset or CSSNumericValue or CSSKeywordValue or DOMString)rangeStart;
+    attribute (TimelineRangeOffset or CSSNumericValue or CSSKeywordValue or DOMString) rangeStart;
     attribute (TimelineRangeOffset or CSSNumericValue or CSSKeywordValue or DOMString) rangeEnd;
 };
 


From ad734d0e6a43d1e674e606c12a78924f4767ede6 Mon Sep 17 00:00:00 2001
From: Kevin Ellis 
Date: Mon, 14 Aug 2023 14:18:19 +0000
Subject: [PATCH 05/22] Cleanup

---
 scroll-animations-1/Overview.bs | 9 ++++-----
 web-animations-2/Overview.bs    | 4 ++--
 2 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/scroll-animations-1/Overview.bs b/scroll-animations-1/Overview.bs
index dfd133548c6..7bc56747a81 100644
--- a/scroll-animations-1/Overview.bs
+++ b/scroll-animations-1/Overview.bs
@@ -911,8 +911,8 @@ spec:web-animations-2: type:dfn; text:auto-aligned start time
 	any created [=scroll progress timelines=] or [=view progress timelines=] are collected into a stale timelines set.
 	After step 7.14 if any timelines' [=named timeline ranges=] have changed,
 	these timelines are added to the [=stale timelines=] set.
-	If there are any [=stale timelines=], they now update their current time and associated ranges, the set of [=stale timelines=] is cleared and
-	we run an additional step to recalculate styles and update layout.
+	If there are any [=stale timelines=], they now update their current time and associated ranges,
+	the set of [=stale timelines=] is cleared and we run an additional step to recalculate styles and update layout.
 
 	Note: We check for layout changes after dispatching any {{ResizeObserver}}s intentionally
 	to take programmatically sized elements into account.
@@ -932,9 +932,8 @@ spec:web-animations-2: type:dfn; text:auto-aligned start time
 	in the rendered output.
 
 	Note: This section has no effect on forced style and layout
-	calculations triggered by {{Window/getComputedStyle()|getComputedStyle()}} or
-	similar. In other words, [=stale timelines|initially stale=] timelines are
-	visible as such through those APIs.
+	calculations triggered by {{Window/getComputedStyle()|getComputedStyle()}} or similar.
+	In other words, [=stale timelines|initially stale=] timelines are visible as such through those APIs.
 
 	If the final style and layout update
 	would result in a change in the time or scope (see 'timeline-scope')
diff --git a/web-animations-2/Overview.bs b/web-animations-2/Overview.bs
index 8c26a098bf5..443ead7d019 100644
--- a/web-animations-2/Overview.bs
+++ b/web-animations-2/Overview.bs
@@ -2312,14 +2312,14 @@ Add:
 >     Setting the attribute follows the same rules as the KeyframeAnimationOption
 >     rangeStart.
 >     When reading the attribute, the returned value is either a
->     {{TimelineRangeOffset}} or the {{DOMString}} normal.
+>     {{TimelineRangeOffset}} or the {{DOMString}} "normal".
 >
 > :  rangeEnd
 > ::  Specifies the end of the animation’s [=animation attachment range=].
 >     Setting the attribute follows the same rules as the KeyframeAnimationOption
 >      rangeEnd.
 >     When reading the attribute, the returned value is either a
->     {{TimelineRangeOffset}} or the {{DOMString}} normal.
+>     {{TimelineRangeOffset}} or the {{DOMString}} "normal".
 

 
 
The AnimationEffect interface


From cad368a59b2b5f96e0efdde8a1966a0fe5dc3f42 Mon Sep 17 00:00:00 2001
From: Kevin Ellis 
Date: Mon, 14 Aug 2023 15:41:53 +0000
Subject: [PATCH 06/22] Cleanup

---
 scroll-animations-1/Overview.bs |  41 ++----------
 web-animations-2/Overview.bs    | 107 +++++++++++++++++++++++++++++---
 2 files changed, 101 insertions(+), 47 deletions(-)

diff --git a/scroll-animations-1/Overview.bs b/scroll-animations-1/Overview.bs
index 7bc56747a81..279b4a24fea 100644
--- a/scroll-animations-1/Overview.bs
+++ b/scroll-animations-1/Overview.bs
@@ -60,7 +60,6 @@ spec:css-writing-modes-4; type: dfn;
 	text:end
 spec:infra; type:dfn; text:user agent
 spec:selectors-4; type:dfn; text:selector
-spec:web-animations-2: type:dfn; text:auto-aligned start time
 

 
 # Introduction # {#intro}
@@ -952,42 +951,10 @@ spec:web-animations-2: type:dfn; text:auto-aligned start time
 	and the state of a scroll-driven animation
 	may be inconsistent in the composited frame.
 
-## Updating an auto-aligned start time ## {#updating-auto-aligned-start-time}
-
-	When updating timeline current time, the [=start time=] of any attached
-	animation is conditionally updated. The procedure for
-	calculating auto-aligned start times
-	is as follows:
-
-	1.	For each attached animation:
-
-		1. If the animation does not have an [=auto-aligned start time=], abort
-			this procedure.
-
-		1. If [=play state=] is idle or [=hold time=] is resolved and
-			[=play state=] is not finished, abort this procedure.
-
-		1. Let |start offset| be the resolved scroll offset as a percentage
-			corresponding to the start of the [=animation attachment range=], or
-			0% if unresolved.
-
-		1. Let |end offset| be the resolved scroll offset as a percentage
-			corresponding to the end of the [=animation attachment range=], or
-			100% if unresolved.
-
-		1.  Set [=start time=] to |start offset| if [=effective playback rate=]
-			≥ 0, and |end offset| otherwise.
-
-		1.  Clear [=hold time=].
-
-	Note: The [=start time=] is auto-aligned unless [=animation/current time=] or
-	[=start time=] are explicitly set via the web-animations API, which makes the
-	[=start time=] sticky.  Playing an animation implicitly resets the stickiness
-	of the [=start time=].
-
-	Note: A [=start time=] is still required for a pause-pending animation to
-	properly align to the animation range. In this case, [=hold time=] will be
-	set when the pending pause microtask is run.
+	When updating timeline current time,
+	the [=start time=] of any attached animation is conditionally updated.
+	For each attached animation,
+	run the procedure for [=animation/calculating an auto-aligned start time=].
 
 # Privacy Considerations # {#privacy-considerations}
 
diff --git a/web-animations-2/Overview.bs b/web-animations-2/Overview.bs
index 443ead7d019..46b7bf8eb65 100644
--- a/web-animations-2/Overview.bs
+++ b/web-animations-2/Overview.bs
@@ -388,15 +388,34 @@ After the step to assign new effect as animation's
 
 
Waiting for the associated effect

 
-The definition of when an animation is ready needs to be extended to consider
-descendant effects and custom effects such that the first condition is:
+Replace:
+
+>  An animation is ready at the first moment
+>  where both of the following conditions are true:
+>
+>  * the user agent has completed any setup required
+>      to begin the playback of the animation's [=associated effect=],
+>      including rendering the first frame of any [=keyframe effect=].
+>
+>  * the animation is associated with a [=timeline=]
+>      that is not [=inactive timeline|inactive=].
+
+With:
 
+>  An animation is ready at the first moment
+>  where all of the following conditions are true:
+>
 > *   the user agent has completed any setup required to begin the playback of
 >     each inclusive descendant of
 >     the animation's associated effect
 >     including rendering the first frame of any keyframe
 >     effect or executing any custom effects associated with an
 >     animation effect.
+>
+> *   the animation is associated with a [=timeline=]
+>     that is not [=inactive timeline|inactive=].
+>
+> *   the animation's [=hold time=] or [=animation/start time=] is resolved.
 
 
Validating a CSSNumberish time

 
@@ -793,6 +812,32 @@ as CSS Animations [[CSS-ANIMATIONS-1]].
 Issue: The procedure to [=play an animation=] needs to include scheduling a task for
 updating [=custom effects=].
 
+
Auto-aligning the start time

+
+When attached to a non-monotonic timeline, the start time of the animation may be layout dependent.
+In this case, we defer calculation of the start time until the timeline has been updated post
+layout.
+When updating timeline current time, the [=start time=] of any attached animation is conditionally updated. The procedure for
+    calculating an auto-aligned start time
+    is as follows:
+
+    1. If the |auto-align star time| flag is false, abort this procedure.
+
+    1. If [=play state=] is idle or [=hold time=] is resolved and [=play state=] is not finished, abort this procedure.
+
+    1.  Let |start offset| be the resolved scroll offset as a percentage
+        corresponding to the start of the [=animation attachment range=],
+        or 0% if unresolved.
+
+    1.  Let |end offset| be the resolved scroll offset as a percentage
+        corresponding to the end of the [=animation attachment range=],
+        or 100% if unresolved.
+
+    1.  Set [=start time=] to |start offset| if [=effective playback rate=] ≥ 0,
+        and |end offset| otherwise.
+
+    1.  Clear [=hold time=].
+
 
 
Pausing an animation

 
@@ -806,16 +851,58 @@ Update the constraints for setting the seek time to only apply when using a
 monotonic timeline. A [=scroll-driven animation=] needs to defer setting the
 hold time until the animation range has been computed.
 
-Add the following steps after conditionally setting the hold time:
+Replace:
 
->    If [=hold time=] and [=animation/start time=] are both unresolved.
->    * Set the |auto align start time| flag to true
+> If |seek time| is [=unresolved|resolved=],
+>
+>   

+>
+>       : If |has finite timeline| is true,
+>       ::
+>           Set |animation|'s [=start time=] to |seek time|.
+>
+>       : Otherwise,
+>       ::
+>           Set |animation|'s [=hold time=] to |seek time|.
+>
+>   

+
+With:
+
+> If |seek time| is [=unresolved|resolved=],
+>
+>   

+>
+>       : If |has finite timeline| is true,
+>       ::
+>           Set the |auto align start time| flag to true.
+>
+>       : Otherwise,
+>       ::
+>           Set |animation|'s [=hold time=] to |seek time|.
+>
+>   

+
+Replace:
+
+>   Schedule a task to be executed at the first possible moment where both of the following conditions are true:
+>
+>   * the user agent has performed any processing necessary to suspend the playback of animation’s associated effect, if any.
+>
+>   * the animation is associated with a timeline that is not inactive.
+
+With:
+
+>   Schedule a task to be executed at the first possible moment where all of the following conditions are true:
+>
+>   * the user agent has performed any processing necessary to suspend the playback of animation’s associated effect, if any.
+>
+>   * the animation is associated with a timeline that is not inactive.
+>
+>   * the animation has a resolved [=hold time=] or [=animation/start time=].
 
-Note: Setting the |auto align start time| flag forces an update of the start
-time when the timeline is updated, the pause-pending microtask sets the
-[=hold time=] based on the auto-aligned [=animation/start time=]. The animation
-is not ready until the animation has either a [=hold time=] or
-[=animation/start time=].
+Note: A [=animation/start time=] is still required for a pause-pending animation if the |auto-align start time| flag is true to properly align to the animation range.
+The [=animation/start time=] is set following the procedure for [=calculating an auto-aligned start time=].
 
 
Canceling an animation

 

From f7e051273eeae440c5c5cd95991d94cd1d26d540 Mon Sep 17 00:00:00 2001
From: Kevin Ellis 
Date: Mon, 14 Aug 2023 16:16:17 +0000
Subject: [PATCH 07/22] Cleanup

---
 web-animations-2/Overview.bs | 44 ++++++++++++++++++------------------
 1 file changed, 22 insertions(+), 22 deletions(-)

diff --git a/web-animations-2/Overview.bs b/web-animations-2/Overview.bs
index 46b7bf8eb65..10908269fda 100644
--- a/web-animations-2/Overview.bs
+++ b/web-animations-2/Overview.bs
@@ -131,6 +131,8 @@ urlPrefix: https://webidl.spec.whatwg.org/; type: dfn; spec: webidl
 urlPrefix: http://www.ecma-international.org/ecma-262/6.0/#sec-; type: dfn; spec: ecma-262
     text: code realms
     text: execution contexts
+urlPrefix: https://drafts.csswg.org/scroll-animations-1/; type: dfn; spec: scroll-animations-1
+    text: html-processing-model-event-loops
 
@@ -390,7 +392,7 @@ After the step to assign new effect as animation's
 
 Replace:
 
->  An animation is ready at the first moment
+>  An animation is ready at the first moment
 >  where both of the following conditions are true:
 >
 >  * the user agent has completed any setup required
@@ -417,6 +419,10 @@ With:
 >
 > *   the animation's [=hold time=] or [=animation/start time=] is resolved.
 
+Note: an animation is not ready while it has no [=animation/start time=] or [=hold time=].
+For a [=scroll-driven animation=], the start-time is determined when [=html-processing-model-event-loop|updating the timeline=] if |auto align start time| is true.
+
+
 
Validating a CSSNumberish time

 
 The procedure to validate a CSSNumberish time for an input
@@ -621,8 +627,8 @@ as CSS Animations [[CSS-ANIMATIONS-1]].
 1.  Let previous current time be the |animation|'s
     [=animation/current time=]
 1.  Let enable seek be true if the auto-rewind flag is
-    true and has finite timeline is false. Otherwise, initialize to
-    false.
+    true and has finite timeline is false.
+    Otherwise, initialize to false.
 1.  Perform the steps corresponding to the first matching
     condition from the following, if any:
 
@@ -666,16 +672,13 @@ as CSS Animations [[CSS-ANIMATIONS-1]].
 
 1.  If |has finite timeline| and the |auto-rewind| flag is true:
     *   Set the flag |auto align start time| to true.
-    *   Set the |animation|'s hold time to the |animation|'s
-        [=animation/current time=]
+    *   Set the |animation|'s [=hold time=] to the |animation|'s [=animation/current time=]
 
     Note: If play is called for a CSS animation during style update,
-    the |animation|'s [=animation/start time=] cannot be reliably calculated
-    until post layout since the start time is to align with the start or end of
-    the animation range (depending on the [=playback rate=]).  In this case, the
-    animation is said to have an auto-aligned start
-    time, whereby the start time is automatically adjusted as needed to
-    align the animation's progress to the animation range.
+    the |animation|'s [=animation/start time=] cannot be reliably calculated until post layout since the start time is to align with the start or end of the animation range (depending on the [=playback rate=]).
+    In this case, the animation is said to have an auto-aligned start
+    time,
+    whereby the start time is automatically adjusted as needed to align the animation's progress to the animation range.
 
 1.  If animation's hold time is resolved,
     let its [=animation/start time=] be unresolved.
@@ -704,12 +707,6 @@ as CSS Animations [[CSS-ANIMATIONS-1]].
     1.  Assert that at least one of |animation|'s [=animation/start time=] or
         [=hold time=] is resolved.
 
-        Note: an animation is not ready while it has no
-        [=animation/start time=] or [=hold time=]. For a
-        [=scroll-driven animation=], the start-time is
-        determined when [=html-processing-model-event-loop|updating the
-        timeline=] if |auto align start time| is true.
-
     1.  Let ready time be the time value of
         the timeline associated with animation at the moment
         when animation became ready.
@@ -817,13 +814,16 @@ updating [=custom effects=].
 When attached to a non-monotonic timeline, the start time of the animation may be layout dependent.
 In this case, we defer calculation of the start time until the timeline has been updated post
 layout.
-When updating timeline current time, the [=start time=] of any attached animation is conditionally updated. The procedure for
+When updating timeline current time, the [=animation/start time=] of any attached animation is conditionally updated. The procedure for
     calculating an auto-aligned start time
     is as follows:
 
-    1. If the |auto-align star time| flag is false, abort this procedure.
+    1.  If the |auto-align start time| flag is false, abort this procedure.
+
+    1.  If [=play state=] is idle, abort this procedure.
 
-    1. If [=play state=] is idle or [=hold time=] is resolved and [=play state=] is not finished, abort this procedure.
+    1.  If [=play state=] is paused, and [=hold time=] is resolved,
+        abort this procedure.
 
     1.  Let |start offset| be the resolved scroll offset as a percentage
         corresponding to the start of the [=animation attachment range=],
@@ -833,7 +833,7 @@ When updating timeline current time, the [=start time=] of any attached animatio
         corresponding to the end of the [=animation attachment range=],
         or 100% if unresolved.
 
-    1.  Set [=start time=] to |start offset| if [=effective playback rate=] ≥ 0,
+    1.  Set [=animation/start time=] to |start offset| if [=effective playback rate=] ≥ 0,
         and |end offset| otherwise.
 
     1.  Clear [=hold time=].
@@ -859,7 +859,7 @@ Replace:
 >
 >       : If |has finite timeline| is true,
 >       ::
->           Set |animation|'s [=start time=] to |seek time|.
+>           Set |animation|'s [=animation/start time=] to |seek time|.
 >
 >       : Otherwise,
 >       ::

From 85eec1de042c4daa8868021ed428d3aee10094fb Mon Sep 17 00:00:00 2001
From: Kevin Ellis 
Date: Mon, 14 Aug 2023 16:30:39 +0000
Subject: [PATCH 08/22] Cleanup

---
 scroll-animations-1/Overview.bs | 4 +++-
 web-animations-2/Overview.bs    | 5 ++---
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/scroll-animations-1/Overview.bs b/scroll-animations-1/Overview.bs
index 279b4a24fea..a7df701b0f3 100644
--- a/scroll-animations-1/Overview.bs
+++ b/scroll-animations-1/Overview.bs
@@ -31,6 +31,8 @@ Markup Shorthands: markdown yes
 
 urlPrefix: https://html.spec.whatwg.org/multipage/window-object.html; type: dfn; spec: html
 	text: document associated with a window; url: concept-document-window
+urlPrefix: https://drafts.csswg.org/web-animations-2/; type: dfn; spec: web-animations-2
+	text: calculating an auto-aligned start time
 

 
 spec:web-animations-1;
@@ -954,7 +956,7 @@ spec:selectors-4; type:dfn; text:selector
 	When updating timeline current time,
 	the [=start time=] of any attached animation is conditionally updated.
 	For each attached animation,
-	run the procedure for [=animation/calculating an auto-aligned start time=].
+	run the procedure for [=calculating an auto-aligned start time=].
 
 # Privacy Considerations # {#privacy-considerations}
 
diff --git a/web-animations-2/Overview.bs b/web-animations-2/Overview.bs
index 10908269fda..128edb4c761 100644
--- a/web-animations-2/Overview.bs
+++ b/web-animations-2/Overview.bs
@@ -814,9 +814,8 @@ updating [=custom effects=].
 When attached to a non-monotonic timeline, the start time of the animation may be layout dependent.
 In this case, we defer calculation of the start time until the timeline has been updated post
 layout.
-When updating timeline current time, the [=animation/start time=] of any attached animation is conditionally updated. The procedure for
-    calculating an auto-aligned start time
-    is as follows:
+When updating timeline current time, the [=animation/start time=] of any attached animation is conditionally updated.
+The procedure for calculating an auto-aligned start time is as follows:
 
     1.  If the |auto-align start time| flag is false, abort this procedure.
 

From ab2de63b6e4ced947f795612e0f1d84c4c2d0abf Mon Sep 17 00:00:00 2001
From: Kevin Ellis 
Date: Mon, 14 Aug 2023 16:38:56 +0000
Subject: [PATCH 09/22] Cleanup

---
 web-animations-2/Overview.bs | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/web-animations-2/Overview.bs b/web-animations-2/Overview.bs
index 128edb4c761..40284c70bdb 100644
--- a/web-animations-2/Overview.bs
+++ b/web-animations-2/Overview.bs
@@ -819,6 +819,8 @@ The procedure for calculating an auto-aligned start
 
     1.  If the |auto-align start time| flag is false, abort this procedure.
 
+    1.  If the timeline is inactive, abort this procedure.
+
     1.  If [=play state=] is idle, abort this procedure.
 
     1.  If [=play state=] is paused, and [=hold time=] is resolved,

From fc8add9ec2886b641211413c1b2f2be15c2c83c7 Mon Sep 17 00:00:00 2001
From: Kevin Ellis 
Date: Tue, 15 Aug 2023 19:07:11 +0000
Subject: [PATCH 10/22] Cleanup

---
 web-animations-2/Overview.bs | 10 ++++------
 1 file changed, 4 insertions(+), 6 deletions(-)

diff --git a/web-animations-2/Overview.bs b/web-animations-2/Overview.bs
index 40284c70bdb..3fa84033935 100644
--- a/web-animations-2/Overview.bs
+++ b/web-animations-2/Overview.bs
@@ -826,13 +826,11 @@ The procedure for calculating an auto-aligned start
     1.  If [=play state=] is paused, and [=hold time=] is resolved,
         abort this procedure.
 
-    1.  Let |start offset| be the resolved scroll offset as a percentage
-        corresponding to the start of the [=animation attachment range=],
-        or 0% if unresolved.
+    1.  Let |start offset| be the resolved timeline time corresponding to the start of the [=animation attachment range=].
+        In the case of view timelines, it requires a calculation based on the proportion of the cover range.
 
-    1.  Let |end offset| be the resolved scroll offset as a percentage
-        corresponding to the end of the [=animation attachment range=],
-        or 100% if unresolved.
+    1.  Let |end offset| be the resolved timeline time corresponding to the end of the [=animation attachment range=].
+        In the case of view timelines, it requires a calculation based on the proportion of the cover range.
 
     1.  Set [=animation/start time=] to |start offset| if [=effective playback rate=] ≥ 0,
         and |end offset| otherwise.

From 317d4d9b2603d3e1097a442d453a6fc79cf022c2 Mon Sep 17 00:00:00 2001
From: Kevin Ellis 
Date: Tue, 15 Aug 2023 19:11:01 +0000
Subject: [PATCH 11/22] Cleanup

---
 scroll-animations-1/Overview.bs | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/scroll-animations-1/Overview.bs b/scroll-animations-1/Overview.bs
index a7df701b0f3..3b88ef6c8d5 100644
--- a/scroll-animations-1/Overview.bs
+++ b/scroll-animations-1/Overview.bs
@@ -913,7 +913,8 @@ spec:selectors-4; type:dfn; text:selector
 	After step 7.14 if any timelines' [=named timeline ranges=] have changed,
 	these timelines are added to the [=stale timelines=] set.
 	If there are any [=stale timelines=], they now update their current time and associated ranges,
-	the set of [=stale timelines=] is cleared and we run an additional step to recalculate styles and update layout.
+	the set of [=stale timelines=] is cleared and
+	we run an additional step to recalculate styles and update layout.
 
 	Note: We check for layout changes after dispatching any {{ResizeObserver}}s intentionally
 	to take programmatically sized elements into account.

From 1500d40e116b5328cab05a3a37c617f528784be1 Mon Sep 17 00:00:00 2001
From: Kevin Ellis 
Date: Fri, 18 Aug 2023 14:02:45 +0000
Subject: [PATCH 12/22] Revert changes to web-animations-1

---
 web-animations-1/Overview.bs | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/web-animations-1/Overview.bs b/web-animations-1/Overview.bs
index de0c95f5ce4..7512553e1aa 100644
--- a/web-animations-1/Overview.bs
+++ b/web-animations-1/Overview.bs
@@ -2108,7 +2108,7 @@ Waiting for the associated effect
 
   Initially the [=pending playback rate=] of an [=animation=] is unset.
 
-  The effective playback rate of an [=animation=] is
+  The effective playback rate of an [=animation=] is
   its [=pending playback rate=], if set,
   otherwise it is the animation's [=playback rate=].
 
@@ -2536,7 +2536,7 @@ Animation effects {#animation-effects}
 
 
 
-  [=Animation effects=] define an active interval
+  [=Animation effects=] define an active interval
   which is the period of time during which the effect
   is scheduled to produce its effect--
   with the exception of [=fill modes=],
@@ -3226,7 +3226,7 @@ Core animation effect calculations {#core-animation-effect-calculations}
   The [=active duration=] is calculated as follows:
 
   

-    active duration =
+    active duration =
        iteration duration × iteration count
   

 

From 3147c3faa23b5e9d78d5d1e2e600698bb05511de Mon Sep 17 00:00:00 2001
From: Kevin Ellis 
Date: Fri, 18 Aug 2023 14:10:16 +0000
Subject: [PATCH 13/22] Cleanup

---
 scroll-animations-1/Overview.bs |  2 +-
 web-animations-2/Overview.bs    | 10 ++++++++--
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/scroll-animations-1/Overview.bs b/scroll-animations-1/Overview.bs
index 276571b26af..be75a8b7a53 100644
--- a/scroll-animations-1/Overview.bs
+++ b/scroll-animations-1/Overview.bs
@@ -106,7 +106,7 @@ spec:selectors-4; type:dfn; text:selector
 	to CSS Animations [[CSS-ANIMATIONS-1]].
 	To the extent the behavior of these CSS properties is described
 	in terms of the programming interfaces,
-	[=user agent|User Agents=] that do not support scripting
+	[=User Agents=] that do not support scripting
 	may still conform to this specification
 	by implementing the CSS features to behave
 	as if the underlying programming interfaces were in place.
diff --git a/web-animations-2/Overview.bs b/web-animations-2/Overview.bs
index ebe52576ff0..8e75fc66069 100644
--- a/web-animations-2/Overview.bs
+++ b/web-animations-2/Overview.bs
@@ -6,7 +6,6 @@
   background: #efe;
   border: green 1px dotted;
 }
-
 @media (prefers-color-scheme: dark) {
   .informative-bg {
     background: rgba(255, 255, 255, .05);
@@ -47,6 +46,14 @@ dl.switch > dt {
 .exceptions::before { content: 'Exceptions' }
 .constructors::before { content: 'Constructors' }
 .members::before { content: 'Dictionary members' }
+
+dl.switch  > [data-md] > p {
+  display: inline;
+}
+
+dl.switch > dt > ul > li {
+  text-indent: 0;
+}
 
 
 
@@ -607,7 +614,6 @@ is as follows:
     animation with the did seek flag set to true, and
     the synchronously notify flag set to false.
 
-
 
Playing an animation

 
 The procedure to play an animation, animation, given

From bc2976390fda850fa682c975a4a5820f70cad85c Mon Sep 17 00:00:00 2001
From: Kevin Ellis 
Date: Fri, 18 Aug 2023 15:07:18 +0000
Subject: [PATCH 14/22] Revert formatting changes

---
 web-animations-2/Overview.bs | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/web-animations-2/Overview.bs b/web-animations-2/Overview.bs
index 8e75fc66069..af8ce731939 100644
--- a/web-animations-2/Overview.bs
+++ b/web-animations-2/Overview.bs
@@ -279,7 +279,7 @@ follows:
 1.  Let |previous play state| be |animation|'s [=play state=].
 1.  Let |previous current time| be the |animation|'s [=animation/current time=].
 1.  Set |previous progress| based in the first condition that applies:
-    

+    

         :   If |previous current time| is unresolved:
 
         ::  Set |previous progress| to unresolved.
@@ -1088,7 +1088,7 @@ For an animation effect, the inherited time at
 a given moment is based on the first matching condition from the
 following:
 
-

+

 
 :   If the animation effect has a parent group,
 ::  the inherited time is the parent group's current
@@ -1100,7 +1100,7 @@ following:
 :   Otherwise,
 ::  the inherited time is unresolved.
 
-

+
 
 The local time of an animation effect is the
 animation effect's inherited time minus its 
 
-

-
+

 :   constructor (sequence<AnimationEffect>? children,
     optional (unrestricted double or EffectTiming) timing)
 ::  The meaning and handling of each of the parameters in this

From 97b6189a9eb2154745faaef73127c683b42fe6b3 Mon Sep 17 00:00:00 2001
From: Kevin Ellis 
Date: Fri, 18 Aug 2023 15:14:45 +0000
Subject: [PATCH 15/22] Cleanup

---
 web-animations-2/Overview.bs | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/web-animations-2/Overview.bs b/web-animations-2/Overview.bs
index af8ce731939..de3a0a8ddf9 100644
--- a/web-animations-2/Overview.bs
+++ b/web-animations-2/Overview.bs
@@ -144,9 +144,6 @@ urlPrefix: https://drafts.csswg.org/scroll-animations-1/; type: dfn; spec: scrol
 
 
 spec:webidl; type:dfn; text:throw
-spec:scroll-animations-1; type:dfn;
-    text:scroll-driven animation
-    text:html-processing-model-event-loop
 

 
 
Delta specification


From 009b062c315de79c138bba240a34eaf17ea1421a Mon Sep 17 00:00:00 2001
From: Kevin Ellis 
Date: Tue, 22 Aug 2023 14:25:26 +0000
Subject: [PATCH 16/22] Update pause steps

---
 web-animations-2/Overview.bs | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/web-animations-2/Overview.bs b/web-animations-2/Overview.bs
index de3a0a8ddf9..173b06a424a 100644
--- a/web-animations-2/Overview.bs
+++ b/web-animations-2/Overview.bs
@@ -877,7 +877,9 @@ With:
 >
 >       : If |has finite timeline| is true,
 >       ::
->           Set the |auto align start time| flag to true.
+>           : If the animation's [=hold time=] and [=start time=] are unresolved,
+>           ::
+>               Set the |auto align start time| flag to true.
 >
 >       : Otherwise,
 >       ::

From e802d948405f5aae017ea2e4f22edffd5e8e4302 Mon Sep 17 00:00:00 2001
From: Kevin Ellis 
Date: Tue, 22 Aug 2023 14:34:57 +0000
Subject: [PATCH 17/22] Refinement

---
 web-animations-2/Overview.bs | 19 +++++--------------
 1 file changed, 5 insertions(+), 14 deletions(-)

diff --git a/web-animations-2/Overview.bs b/web-animations-2/Overview.bs
index 173b06a424a..9ad37741a14 100644
--- a/web-animations-2/Overview.bs
+++ b/web-animations-2/Overview.bs
@@ -871,21 +871,12 @@ Replace:
 
 With:
 
-> If |seek time| is [=unresolved|resolved=],
->
->   

->
->       : If |has finite timeline| is true,
->       ::
->           : If the animation's [=hold time=] and [=start time=] are unresolved,
->           ::
->               Set the |auto align start time| flag to true.
+> If |seek time| is [=unresolved|resolved=], and
+> |has finite timeline| is false,
+>    *  Set |animation|'s [=hold time=] to |seek time|.
 >
->       : Otherwise,
->       ::
->           Set |animation|'s [=hold time=] to |seek time|.
->
->   

+> If the animation's [=hold time=] and [=start time=] are unresolved,
+>    * Set the |auto align start time| flag to true.
 
 Replace:
 

From 391e23d0c3e6e811b1a9f656fb9bc1e322383739 Mon Sep 17 00:00:00 2001
From: Kevin Ellis 
Date: Tue, 29 Aug 2023 13:48:13 +0000
Subject: [PATCH 18/22] Cleanup

---
 web-animations-2/Overview.bs | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/web-animations-2/Overview.bs b/web-animations-2/Overview.bs
index 9ad37741a14..a6ab99ee28a 100644
--- a/web-animations-2/Overview.bs
+++ b/web-animations-2/Overview.bs
@@ -304,6 +304,8 @@ follows:
         :   If |to finite timeline|,
 
         ::  1.  [=Apply any pending playback rate=] on |animation|
+            1.  If |from finite timeline| is false,
+                set |auto align start time| to true.
             1.  Let |seek time| be zero if [=playback rate=] ≥ 0, and
                 |animation|'s associated effect end otherwise.
             1.  Update the animation based on the first matching condition if any:
@@ -673,9 +675,8 @@ as CSS Animations [[CSS-ANIMATIONS-1]].
 
     

 
-1.  If |has finite timeline| and the |auto-rewind| flag is true:
+1.  If |has finite timeline| and |previous current time| is unresolved:
     *   Set the flag |auto align start time| to true.
-    *   Set the |animation|'s [=hold time=] to the |animation|'s [=animation/current time=]
 
     Note: If play is called for a CSS animation during style update,
     the |animation|'s [=animation/start time=] cannot be reliably calculated until post layout since the start time is to align with the start or end of the animation range (depending on the [=playback rate=]).

From 3ec0726a7297ce1a42acaafede7e2d070116c77d Mon Sep 17 00:00:00 2001
From: Kevin Ellis 
Date: Mon, 11 Sep 2023 16:55:55 +0000
Subject: [PATCH 19/22] Cleanup

---
 web-animations-2/Overview.bs | 130 +++++++++++++++++++++++------------
 1 file changed, 85 insertions(+), 45 deletions(-)

diff --git a/web-animations-2/Overview.bs b/web-animations-2/Overview.bs
index a6ab99ee28a..2d23e499f7a 100644
--- a/web-animations-2/Overview.bs
+++ b/web-animations-2/Overview.bs
@@ -304,39 +304,18 @@ follows:
         :   If |to finite timeline|,
 
         ::  1.  [=Apply any pending playback rate=] on |animation|
-            1.  If |from finite timeline| is false,
-                set |auto align start time| to true.
-            1.  Let |seek time| be zero if [=playback rate=] ≥ 0, and
-                |animation|'s associated effect end otherwise.
-            1.  Update the animation based on the first matching condition if any:
+            1.  set |auto align start time| to true.
+            1.  If |previous play state| is "paused" and
+                |previous progress| is resolved:
 
-                

+                1.  Set [=animation/start time=] to unresolved.
+                1.  Set [=hold time=] to |previous progress| * [=end time=].
 
-                    :   If either of the following conditions are true:
-                        *    |previous play state| is "running" or,
-                        *    |previous play state| is "finished"
-
-                    ::  Set |animation|'s [=animation/start time=] to |seek time|.
-
-                    :   If |previous play state| is "paused":
-
-                    ::  If |previous progress| is resolved:
-
-                        1.  Set [=animation/start time=] to unresolved.
-                        1.  Set [=hold time=] to |previous progress| *
-                            [=end time=].
-
-                        

-                        This step ensures that |previous progress| is preserved
-                        even in the case of a pause-pending animation with a
-                        resolved [=animation/start time=].
-                        

-
-                    :: Otherwise
-
-                        1. Set [=animation/start time=] to |seek time|.
-
-                

+            

+                This step ensures that |previous progress| is preserved
+                even in the case of a pause-pending animation with a
+                resolved [=animation/start time=].
+             

 
         :   If |from finite timeline| and |previous progress| is resolved,
 
@@ -854,29 +833,90 @@ Update the constraints for setting the seek time to only apply when using a
 monotonic timeline. A [=scroll-driven animation=] needs to defer setting the
 hold time until the animation range has been computed.
 
+
+
 Replace:
 
-> If |seek time| is [=unresolved|resolved=],
+>   1. Let |seek time| be
+>        a [=time value=] that is initially [=unresolved=].
+>    1. Let |has finite timeline| be true
+>        if |animation| has an associated [=timeline=]
+>        that is not [=monotonically increasing=].
+>
+>    1. If the |animation|'s [=animation/current time=] is [=unresolved=],
+>        perform the steps according to the first matching condition below:
+>
+>        

+>
+>        : If |animation|'s [=playback rate=] is ≥ 0,
+>        ::
+>            Set |seek time| to zero.
+>
+>        : Otherwise,
+>        ::
+>            

+>
+>            : If [=associated effect end=] for |animation| is positive infinity,
+>            ::
+>                [=throw=] an "{{InvalidStateError}}" {{DOMException}}
+>                and abort these steps.
 >
->   

+>            : Otherwise,
+>            ::
+>                Set |seek time| to |animation|'s [=associated effect end=].
 >
->       : If |has finite timeline| is true,
->       ::
->           Set |animation|'s [=animation/start time=] to |seek time|.
+>            

 >
->       : Otherwise,
->       ::
->           Set |animation|'s [=hold time=] to |seek time|.
+>        

 >
->   

+>    1. If |seek time| is [=unresolved|resolved=],
+>
+>            

+>
+>            : If |has finite timeline| is true,
+>            ::
+>                Set |animation|'s [=start time=] to |seek time|.
+>
+>            : Otherwise,
+>            ::
+>                Set |animation|'s [=hold time=] to |seek time|.
+>
+>             

 
-With:
+with:
 
-> If |seek time| is [=unresolved|resolved=], and
-> |has finite timeline| is false,
->    *  Set |animation|'s [=hold time=] to |seek time|.
+>    1. Let |has finite timeline| be true
+>        if |animation| has an associated [=timeline=]
+>        that is not [=monotonically increasing=].
+>
+>    1. If the |animation|'s [=animation/current time=] is [=unresolved=] and
+>       |has finite timeline| is false,
+>        perform the steps according to the first matching condition below:
+>
+>        

+>
+>        : If |animation|'s [=playback rate=] is ≥ 0,
+>        ::
+>            Set [=hold time=] to zero.
+>
+>        : Otherwise,
+>        ::
+>            

+>
+>            : If [=associated effect end=] for |animation| is positive infinity,
+>            ::
+>                [=throw=] an "{{InvalidStateError}}" {{DOMException}}
+>                and abort these steps.
+>
+>            : Otherwise,
+>            ::
+>                Set [=hold time=] to |animation|'s [=associated effect end=].
+>
+>            

+>
+>        

 >
-> If the animation's [=hold time=] and [=start time=] are unresolved,
+> If |has finite timeline| = true
 >    * Set the |auto align start time| flag to true.
 
 Replace:

From 4e877f247dbf0eab4e1fa3abfb108943ce330bd8 Mon Sep 17 00:00:00 2001
From: Kevin Ellis 
Date: Mon, 11 Sep 2023 17:19:15 +0000
Subject: [PATCH 20/22] Cleanup

---
 web-animations-2/Overview.bs | 2 --
 1 file changed, 2 deletions(-)

diff --git a/web-animations-2/Overview.bs b/web-animations-2/Overview.bs
index 2d23e499f7a..9214edc5f9a 100644
--- a/web-animations-2/Overview.bs
+++ b/web-animations-2/Overview.bs
@@ -833,8 +833,6 @@ Update the constraints for setting the seek time to only apply when using a
 monotonic timeline. A [=scroll-driven animation=] needs to defer setting the
 hold time until the animation range has been computed.
 
-
-
 Replace:
 
 >   1. Let |seek time| be

From 976caab95f3eff49201e3044b08324f0fa877141 Mon Sep 17 00:00:00 2001
From: Kevin Ellis 
Date: Mon, 11 Sep 2023 17:32:31 +0000
Subject: [PATCH 21/22] Cleanup

---
 web-animations-2/Overview.bs | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/web-animations-2/Overview.bs b/web-animations-2/Overview.bs
index 9214edc5f9a..d5ce23e8528 100644
--- a/web-animations-2/Overview.bs
+++ b/web-animations-2/Overview.bs
@@ -914,7 +914,8 @@ with:
 >
 >        

 >
-> If |has finite timeline| = true
+>    1. If |has finite timeline| = true,
+>        and the |animation|'s [=animation/current time=] is [=unresolved=]
 >    * Set the |auto align start time| flag to true.
 
 Replace:

From 6eacbf3e940641a2d42df2c4b2bde3156ca60e7f Mon Sep 17 00:00:00 2001
From: Kevin Ellis 
Date: Tue, 12 Sep 2023 16:39:53 +0000
Subject: [PATCH 22/22] Cleanup

---
 web-animations-2/Overview.bs | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/web-animations-2/Overview.bs b/web-animations-2/Overview.bs
index d5ce23e8528..0fba26ee64a 100644
--- a/web-animations-2/Overview.bs
+++ b/web-animations-2/Overview.bs
@@ -305,10 +305,13 @@ follows:
 
         ::  1.  [=Apply any pending playback rate=] on |animation|
             1.  set |auto align start time| to true.
+            1.  Set [=animation/start time=] to unresolved.
+            1.  Set [=animation/hold time=] to unresolved.
+            1.  If |previous play state| is "finished" or "running"
+                1. Schedule a [=pending play task=]
+
             1.  If |previous play state| is "paused" and
                 |previous progress| is resolved:
-
-                1.  Set [=animation/start time=] to unresolved.
                 1.  Set [=hold time=] to |previous progress| * [=end time=].
 
             

@@ -914,7 +917,7 @@ with:
 >
 >        
 >
->    1. If |has finite timeline| = true,
+>    1. If |has finite timeline| is true,
 >        and the |animation|'s [=animation/current time=] is [=unresolved=]
 >    * Set the |auto align start time| flag to true.