Bug 1291468 - Part 3: Implement keyframe composite(accumulate). r?birtles draft
authorHiroyuki Ikezoe <hiikezoe@mozilla-japan.org>
Fri, 21 Oct 2016 07:08:32 +0900
changeset 427826 6c89d10cb03c38571d269a4d52aca5820e2014d4
parent 427825 dfbe67f03d1f97f99c46e2b9807655e4bde426ed
child 534563 8e875cb1d2e988b4de096bd7bc2317d2fe1861c8
push id33126
push userbmo:hiikezoe@mozilla-japan.org
push dateThu, 20 Oct 2016 22:25:38 +0000
reviewersbirtles
bugs1291468
milestone52.0a1
Bug 1291468 - Part 3: Implement keyframe composite(accumulate). r?birtles MozReview-Commit-ID: CNgis1WtEvo
dom/animation/KeyframeEffectReadOnly.cpp
dom/animation/test/style/file_composite.html
testing/web-platform/meta/web-animations/animation-model/keyframe-effects/composite.html.ini
--- a/dom/animation/KeyframeEffectReadOnly.cpp
+++ b/dom/animation/KeyframeEffectReadOnly.cpp
@@ -78,17 +78,17 @@ IterationCompositeOperation
 KeyframeEffectReadOnly::IterationComposite() const
 {
   return mEffectOptions.mIterationComposite;
 }
 
 CompositeOperation
 KeyframeEffectReadOnly::Composite() const
 {
-  return CompositeOperation::Replace;
+  return mEffectOptions.mComposite;
 }
 
 void
 KeyframeEffectReadOnly::NotifyAnimationTimingUpdated()
 {
   UpdateTargetRegistration();
 
   // If the effect is not relevant it will be removed from the target
@@ -590,16 +590,20 @@ KeyframeEffectParamsFromUnion(const Opti
                                        result.mSpacingMode,
                                        result.mPacedProperty,
                                        aInvalidPacedProperty,
                                        aRv);
     // Ignore iterationComposite if the Web Animations API is not enabled,
     // then the default value 'Replace' will be used.
     if (AnimationUtils::IsCoreAPIEnabledForCaller()) {
       result.mIterationComposite = options.mIterationComposite;
+      // FIXME: Bug 1311620: We don't support additive animation yet.
+      if (options.mComposite != dom::CompositeOperation::Add) {
+        result.mComposite = options.mComposite;
+      }
     }
   }
   return result;
 }
 
 /* static */ Maybe<OwningAnimationTarget>
 KeyframeEffectReadOnly::ConvertTarget(
   const Nullable<ElementOrCSSPseudoElement>& aTarget)
--- a/dom/animation/test/style/file_composite.html
+++ b/dom/animation/test/style/file_composite.html
@@ -173,11 +173,97 @@ promise_test(t => {
     SpecialPowers.DOMWindowUtils.advanceTimeAndRefresh(100 * MS_PER_SEC);
     transform =
       SpecialPowers.DOMWindowUtils.getOMTAStyle(div, 'transform');
     assert_matrix_equals(transform, 'matrix(1, 0, 0, 1, 300, 0)',
       'Transform value at 100s');
   });
 }, 'keyframe composite(accumulate): in the last frame');
 
+promise_test(t => {
+  setupTestRefreshMode(t);
+
+  var div = addDiv(t, { style: 'transform: translateX(100px)' });
+  div.animate({ transform: ['translateX(0px)', 'translateX(200px)'] },
+              { duration: 100 * MS_PER_SEC, fill: 'forwards',
+                composite: 'accumulate' });
+
+  return waitForPaintsFlushed().then(() => {
+    var transform =
+      SpecialPowers.DOMWindowUtils.getOMTAStyle(div, 'transform');
+    assert_matrix_equals(transform, 'matrix(1, 0, 0, 1, 100, 0)',
+      'Transform value at 0s');
+
+    SpecialPowers.DOMWindowUtils.advanceTimeAndRefresh(50 * MS_PER_SEC);
+    transform =
+      SpecialPowers.DOMWindowUtils.getOMTAStyle(div, 'transform');
+    assert_matrix_equals(transform, 'matrix(1, 0, 0, 1, 200, 0)',
+      'Transform value at 50s');
+
+    SpecialPowers.DOMWindowUtils.advanceTimeAndRefresh(100 * MS_PER_SEC);
+    transform =
+      SpecialPowers.DOMWindowUtils.getOMTAStyle(div, 'transform');
+    assert_matrix_equals(transform, 'matrix(1, 0, 0, 1, 300, 0)',
+      'Transform value at 100s');
+  });
+}, 'effect composite(accumulate): onto static style');
+
+promise_test(t => {
+  setupTestRefreshMode(t);
+
+  var div = addDiv(t, { style: 'transform: translateX(100px)' });
+  div.animate([{ transform: 'translateX(100px)' },
+               { transform: 'translateX(200px)', composite: 'replace' }],
+              { duration: 100 * MS_PER_SEC, fill: 'forwards',
+                composite: 'accumulate' });
+
+  return waitForPaintsFlushed().then(() => {
+    var transform =
+      SpecialPowers.DOMWindowUtils.getOMTAStyle(div, 'transform');
+    assert_matrix_equals(transform, 'matrix(1, 0, 0, 1, 200, 0)',
+      'Transform value at 0s');
+
+    SpecialPowers.DOMWindowUtils.advanceTimeAndRefresh(50 * MS_PER_SEC);
+    transform =
+      SpecialPowers.DOMWindowUtils.getOMTAStyle(div, 'transform');
+    assert_matrix_equals(transform, 'matrix(1, 0, 0, 1, 200, 0)',
+      'Transform value at 50s');
+
+    SpecialPowers.DOMWindowUtils.advanceTimeAndRefresh(100 * MS_PER_SEC);
+    transform =
+      SpecialPowers.DOMWindowUtils.getOMTAStyle(div, 'transform');
+    assert_matrix_equals(transform, 'matrix(1, 0, 0, 1, 200, 0)',
+      'Transform value at 100s');
+  });
+}, 'effect composite(accumulate): fills in the blank keyframe composite(from)');
+
+promise_test(t => {
+  setupTestRefreshMode(t);
+
+  var div = addDiv(t, { style: 'transform: translateX(100px)' });
+  div.animate([{ transform: 'translateX(100px)', composite: 'replace' },
+               { transform: 'translateX(200px)' }],
+              { duration: 100 * MS_PER_SEC, fill: 'forwards',
+                composite: 'accumulate' });
+
+  return waitForPaintsFlushed().then(() => {
+    var transform =
+      SpecialPowers.DOMWindowUtils.getOMTAStyle(div, 'transform');
+    assert_matrix_equals(transform, 'matrix(1, 0, 0, 1, 100, 0)',
+      'Transform value at 0s');
+
+    SpecialPowers.DOMWindowUtils.advanceTimeAndRefresh(50 * MS_PER_SEC);
+    transform =
+      SpecialPowers.DOMWindowUtils.getOMTAStyle(div, 'transform');
+    assert_matrix_equals(transform, 'matrix(1, 0, 0, 1, 200, 0)',
+      'Transform value at 50s');
+
+    SpecialPowers.DOMWindowUtils.advanceTimeAndRefresh(100 * MS_PER_SEC);
+    transform =
+      SpecialPowers.DOMWindowUtils.getOMTAStyle(div, 'transform');
+    assert_matrix_equals(transform, 'matrix(1, 0, 0, 1, 300, 0)',
+      'Transform value at 100s');
+  });
+}, 'effect composite(accumulate): fills in the blank keyframe composite(to)');
+
 done();
 </script>
 </body>
deleted file mode 100644
--- a/testing/web-platform/meta/web-animations/animation-model/keyframe-effects/composite.html.ini
+++ /dev/null
@@ -1,11 +0,0 @@
-[composite.html]
-  type: testharness
-  [effect composite(accumulate): onto static style]
-    expected: FAIL
-
-  [effect composite(accumulate): fills in the blank keyframe composite(from)]
-    expected: FAIL
-
-  [effect composite(accumulate): fills in the blank keyframe composite(to)]
-    expected: FAIL
-