[css-transitions-1] Define before/after-change style in terms of base

 - Introduce "base style".
 - Define before/after-change style in terms of that base style
   (at two different points in time).
 - There should be no need for the "completed transition" set anymore,
   since the before/after-change styles on a child are blind to any
   effects from transitions/animations happening on the parent.

Author: Anders Hartvoll Ruud

css-transitions-1/Overview.bs

@@ -432,54 +432,12 @@ Starting of transitions {#starting}
         </span>
       </p>
 
-      <p>
-        Implementations must also maintain a set of
-        <dfn export lt="completed transition">completed transitions</dfn>,
-        each of which
-        (like <a>running transitions</a>)
-        applies to a specific element and non-shorthand property.
-        <span class="note">
-          This specification maintains the invariant that
-          there is never both a <a>running transition</a> and
-          a <a>completed transition</a> for the same property and element.
-        </span>
-      </p>
-
       <p>
         If an element is no longer in the document,
         implementations must <a>cancel</a> any <a>running transitions</a>
-        on it and remove transitions on it from the
-        <a>completed transitions</a>.
+        on that element.
       </p>
 
-      <div class="note">
-
-        <p>
-          This set of completed transitions
-          needs to be maintained
-          in order to prevent
-          transitions from repeating themselves in certain cases,
-          i.e., to maintain the invariant
-          that this specification tries to maintain
-          that unrelated style changes do not trigger transitions.
-        </p>
-
-        <p class="example">
-          An example where maintaining the set of completed transitions
-          is necessary would be a transition on
-          an inherited property,
-          where the parent specifies a transition of that property for
-          a longer duration (say, ''transition: 4s text-indent'')
-          and a child element that inherits the parent's value specifies
-          a transition of the same property for a shorter duration
-          (say, ''transition: 1s text-indent'').
-          Without the maintenance of this set of completed transitions,
-          implementations could start additional transitions on the child
-          after the initial 1 second transition on the child completes.
-        </p>
-
-      </div>
-
       <p>
         Various things can cause the <a>computed values</a> of properties
         on an element to change.
@@ -540,26 +498,15 @@ Starting of transitions {#starting}
         then transitions are not started for that element
         in that style change event.
         Otherwise,
+        define the <dfn export>base style</dfn> as
+        the <a>computed values</a> of all properties on the element
+        as they would be without any declarations added to the
+        "Animation" or "Transition" [[css-cascade-3#cascading-origins|origins]],
+        inheriting from the base style of the parent;
         define the <dfn export>before-change style</dfn> as
-        the <a>computed values</a> of all properties on the element as of
-        the previous <a>style change event</a>,
-        except with any styles derived from declarative
-        animations such as CSS Transitions, CSS Animations
-        ([[CSS3-ANIMATIONS]]),
-        and SMIL Animations ([[SMIL-ANIMATION]], [[SVG11]])
-        updated to the current time.
-        Likewise, define the <dfn export>after-change style</dfn> as
-        the <a>computed values</a> of all properties
-        on the element based on the information
-        known at the start of that <a>style change event</a>,
-        but using the computed values of the 'animation-*' properties from the
-        <a>before-change style</a>,
-        excluding any styles from CSS Transitions in the computation,
-        and inheriting from
-        the <a>after-change style</a> of the parent.
-        Note that this means the <a>after-change style</a> does not differ from
-        the <a>before-change style</a> due to newly created or canceled CSS
-        Animations.
+        the <a>base style</> as of the previous <a>style change event</a>; and
+        define the <dfn export>after-change style</dfn> as
+        the <a>base style</> as of the current <a>style change event</a>.
       </p>
 
       <div class="note">
@@ -652,12 +599,6 @@ Starting of transitions {#starting}
             the <a>after-change style</a> for that property,
             and the values for the property are [=transitionable=],
           </li>
-          <li>
-            the element does not have a <a>completed transition</a>
-            for the property
-            or the <a>end value</a> of the <a>completed transition</a>
-            is different from the <a>after-change style</a> for the property,
-          </li>
           <li>
             there is a <a>matching transition-property value</a>, and
           </li>
@@ -666,8 +607,6 @@ Starting of transitions {#starting}
           </li>
         </ul>
         then implementations must
-        remove the <a>completed transition</a> (if present) from the set
-        of completed transitions and
         start a transition whose:
         <ul>
           <li>
@@ -699,23 +638,11 @@ Starting of transitions {#starting}
         </ul>
       </li>
       <li>
-        Otherwise,
-        if the element has a <a>completed transition</a> for the property
-        and the <a>end value</a> of the <a>completed transition</a>
-        is different from the <a>after-change style</a> for the property,
-        then implementations must
-        remove the <a>completed transition</a> from the set of
-        <a>completed transitions</a>.
-      </li>
-      <li>
-        If the element has a <a>running transition</a> or
-        <a>completed transition</a> for the property,
+        If the element has a <a>running transition</a> for the property,
         and there is <strong>not</strong>
         a <a>matching transition-property value</a>,
         then implementations must
-        <a>cancel</a> the <a>running transition</a>
-        or remove the <a>completed transition</a> from the set of
-        <a>completed transitions</a>.
+        <a>cancel</a> the <a>running transition</a>.
       </li>
       <li>
         If the element has a <a>running transition</a> for the property,
@@ -1060,15 +987,14 @@ Completion of transitions {#complete}
         but prior to the first <a>style change event</a>
         whose time is equal to or after their <a>end time</a>.
         When a transition completes,
-        implementations must move
+        implementations must remove
         all transitions that complete at that time
         from the set of <a>running transitions</a>
-        to the set of <a>completed transitions</a>
         and then fire the <a href="#transition-events">events</a>
         for those completions.
         <span class="note">(Note that doing otherwise, that is,
-        firing some of the events before doing all of the moving
-        from <a>running transitions</a> to <a>completed transitions</a>,
+        firing some of the events before removing all completed transitions
+        from <a>running transitions</a>
         could allow
         a style change event to happen
         without the necessary transitions completing,