Bug 1356941 - Add text-shadow interpolation tests. r?birtles draft
authorHiroyuki Ikezoe <hikezoe@mozilla.com>
Mon, 24 Apr 2017 15:51:32 +0900
changeset 566986 7ac9589ff0c482536d6dc625509103245b7100b1
parent 566985 e0e777a04b2832b01fde3cc2ad57603eef4e2788
child 625481 2e4f7a5e66a6361da4bb64e9052cf9796fd28a09
push id55398
push userhikezoe@mozilla.com
push dateMon, 24 Apr 2017 08:28:01 +0000
reviewersbirtles
bugs1356941
milestone55.0a1
Bug 1356941 - Add text-shadow interpolation tests. r?birtles MozReview-Commit-ID: J19JN13UXtP
testing/web-platform/meta/MANIFEST.json
testing/web-platform/meta/web-animations/animation-model/animation-types/interpolation-per-property.html.ini
testing/web-platform/tests/web-animations/animation-model/animation-types/property-types.js
--- a/testing/web-platform/meta/MANIFEST.json
+++ b/testing/web-platform/meta/MANIFEST.json
@@ -211693,17 +211693,17 @@
    "55100f7d505bc8cbc966ced0d1337ed78534a553",
    "testharness"
   ],
   "web-animations/animation-model/animation-types/property-list.js": [
    "0d7f75b05e66da256fe4d2ecb17332ec7abccfd2",
    "support"
   ],
   "web-animations/animation-model/animation-types/property-types.js": [
-   "782ea74bf1e3d7c3c7708f7c2354d895ab349bea",
+   "f114971fefa63200be12565b896e475667f07153",
    "support"
   ],
   "web-animations/animation-model/animation-types/spacing-keyframes-filters.html": [
    "bd771a8a18245560221d92ea3495f81918c09848",
    "testharness"
   ],
   "web-animations/animation-model/animation-types/spacing-keyframes-shapes.html": [
    "03c3ab6815cfa96c07d5f95b6059fb276c50a25f",
--- a/testing/web-platform/meta/web-animations/animation-model/animation-types/interpolation-per-property.html.ini
+++ b/testing/web-platform/meta/web-animations/animation-model/animation-types/interpolation-per-property.html.ini
@@ -7,25 +7,19 @@ prefs: [layout.css.contain.enabled:true,
 
   [flex-basis supports animating as combination units "%" and "em"]
     expected: FAIL
     bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1291187
 
   [filterList has testInterpolation function]
     expected: FAIL
 
-  [textShadowList has testInterpolation function]
-    expected: FAIL
-
   [filter (type: filterList) has testInterpolation function]
     expected: FAIL
 
-  [text-shadow (type: textShadowList) has testInterpolation function]
-    expected: FAIL
-
   [word-spacing supports animating as combination units "px" and "%"]
     expected: FAIL
     bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1291187
 
   [word-spacing supports animating as combination units "%" and "em"]
     expected: FAIL
     bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1291187
 
--- a/testing/web-platform/tests/web-animations/animation-model/animation-types/property-types.js
+++ b/testing/web-platform/tests/web-animations/animation-model/animation-types/property-types.js
@@ -916,16 +916,93 @@ const filterListType = {
                                      { duration: 1000, composite: 'add' });
       testAnimationSamples(animation, idlName,
         [ { time: 0,    expected: 'blur(10px) brightness(0.8)' }]);
     }, property + ': different filter functions');
   },
 };
 
 const textShadowListType = {
+  testInterpolation: function(property, setup) {
+    test(function(t) {
+      var idlName = propertyToIDL(property);
+      var target = createTestElement(t, setup);
+      var animation =
+        target.animate({ [idlName]: [ 'none',
+                                      'rgb(100, 100, 100) 10px 10px 10px'] },
+                       { duration: 1000, fill: 'both' });
+      testAnimationSamples(animation, idlName,
+                                  // Premultiplied
+        [{ time: 500,  expected: 'rgba(100, 100, 100, 0.5) 5px 5px 5px' }]);
+    }, property + ': from none to other');
+
+    test(function(t) {
+      var idlName = propertyToIDL(property);
+      var target = createTestElement(t, setup);
+      var animation =
+        target.animate({ [idlName]: [ 'rgb(100, 100, 100) 10px 10px 10px',
+                                      'none' ] },
+                       { duration: 1000, fill: 'both' });
+      testAnimationSamples(animation, idlName,
+                                  // Premultiplied
+        [{ time: 500,  expected: 'rgba(100, 100, 100, 0.5) 5px 5px 5px' }]);
+    }, property + ': from other to none');
+
+    test(function(t) {
+      var idlName = propertyToIDL(property);
+      var target = createTestElement(t, setup);
+      var animation =
+        target.animate({ [idlName]: [ 'rgb(0, 0, 0) 0px 0px 0px',
+                                      'rgb(100, 100, 100) 10px 10px 10px'] },
+                       { duration: 1000, fill: 'both' });
+      testAnimationSamples(animation, idlName,
+        [{ time: 500,  expected: 'rgb(50, 50, 50) 5px 5px 5px' }]);
+    }, property + ': single shadow');
+
+    test(function(t) {
+      var idlName = propertyToIDL(property);
+      var target = createTestElement(t, setup);
+      var animation =
+        target.animate({ [idlName]: [ 'rgb(0, 0, 0) 0px 0px 0px, '
+                                    + 'rgb(200, 200, 200) 20px 20px 20px',
+                                      'rgb(100, 100, 100) 10px 10px 10px, '
+                                    + 'rgb(100, 100, 100) 10px 10px 10px'] },
+                       { duration: 1000, fill: 'both' });
+      testAnimationSamples(animation, idlName,
+        [{ time: 500,  expected: 'rgb(50, 50, 50) 5px 5px 5px, '
+                               + 'rgb(150, 150, 150) 15px 15px 15px' }]);
+    }, property + ': shadow list');
+
+    test(function(t) {
+      var idlName = propertyToIDL(property);
+      var target = createTestElement(t, setup);
+      var animation =
+        target.animate({ [idlName]: [ 'rgb(200, 200, 200) 20px 20px 20px',
+                                      'rgb(100, 100, 100) 10px 10px 10px, '
+                                    + 'rgb(100, 100, 100) 10px 10px 10px'] },
+                       { duration: 1000, fill: 'both' });
+      testAnimationSamples(animation, idlName,
+        [{ time: 500,  expected: 'rgb(150, 150, 150) 15px 15px 15px, '
+                               + 'rgba(100, 100, 100, 0.5) 5px 5px 5px' }]);
+    }, property + ': mismatched list length (from longer to shorter)');
+
+    test(function(t) {
+      var idlName = propertyToIDL(property);
+      var target = createTestElement(t, setup);
+      var animation =
+        target.animate({ [idlName]: [ 'rgb(100, 100, 100) 10px 10px 10px, '
+                                    + 'rgb(100, 100, 100) 10px 10px 10px',
+                                      'rgb(200, 200, 200) 20px 20px 20px'] },
+                       { duration: 1000, fill: 'both' });
+      testAnimationSamples(animation, idlName,
+        [{ time: 500,  expected: 'rgb(150, 150, 150) 15px 15px 15px, '
+                               + 'rgba(100, 100, 100, 0.5) 5px 5px 5px' }]);
+    }, property + ': mismatched list length (from shorter to longer)');
+  },
+
   testAddition: function(property, setup) {
     test(function(t) {
       var idlName = propertyToIDL(property);
       var target = createTestElement(t, setup);
       target.style[idlName] = 'rgb(0, 0, 0) 0px 0px 0px';
       var animation =
         target.animate({ [idlName]: [ 'rgb(120, 120, 120) 10px 10px 10px',
                                       'rgb(120, 120, 120) 10px 10px 10px'] },