new file mode 100644
--- /dev/null
+++ b/testing/web-platform/meta/web-animations/animation-model/combining-effects/effect-composition.html.ini
@@ -0,0 +1,14 @@
+[effect-composition.html]
+  type: testharness
+  [add onto the base value]
+    expected: FAIL
+
+  [add onto an underlying animation value]
+    expected: FAIL
+
+  [Composite when mixing add and replace]
+    expected: FAIL
+
+  [add specified on a keyframe overrides the composite mode of the effect]
+    expected: FAIL
+

--- a/testing/web-platform/tests/web-animations/animation-model/combining-effects/effect-composition.html
+++ b/testing/web-platform/tests/web-animations/animation-model/combining-effects/effect-composition.html
@@ -4,65 +4,67 @@
 <link rel="help" href="https://w3c.github.io/web-animations/#effect-composition">
 <script src=/resources/testharness.js></script>
 <script src=/resources/testharnessreport.js></script>
 <script src="../../testcommon.js"></script>
 <div id="log"></div>
 <script>
 'use strict';
 
-test(function(t) {
-  var div = createDiv(t);
-  div.style.marginLeft = '10px';
-  var anim =
-    div.animate({ marginLeft: ['0px', '10px'], composite: 'accumulate' }, 100);
+[ 'accumulate', 'add' ].forEach(function(composite) {
+  test(function(t) {
+    var div = createDiv(t);
+    div.style.marginLeft = '10px';
+    var anim =
+      div.animate({ marginLeft: ['0px', '10px'], composite }, 100);
 
-  anim.currentTime = 50;
-  assert_equals(getComputedStyle(div).marginLeft, '15px',
-    'Animated margin-left style at 50%');
-}, 'Accumulate onto the base value');
+    anim.currentTime = 50;
+    assert_equals(getComputedStyle(div).marginLeft, '15px',
+      'Animated margin-left style at 50%');
+  }, composite + ' onto the base value');
 
-test(function(t) {
-  var div = createDiv(t);
-  var anims = [];
-  anims.push(div.animate({ marginLeft: ['10px', '20px'],
-                           composite: 'replace' },
-                         100));
-  anims.push(div.animate({ marginLeft: ['0px', '10px'],
-                           composite: 'accumulate' },
-                         100));
+  test(function(t) {
+    var div = createDiv(t);
+    var anims = [];
+    anims.push(div.animate({ marginLeft: ['10px', '20px'],
+                             composite: 'replace' },
+                           100));
+    anims.push(div.animate({ marginLeft: ['0px', '10px'],
+                             composite },
+                           100));
 
-  anims.forEach(function(anim) {
-    anim.currentTime = 50;
-  });
+    anims.forEach(function(anim) {
+      anim.currentTime = 50;
+    });
 
-  assert_equals(getComputedStyle(div).marginLeft, '20px',
-    'Animated style at 50%');
-}, 'Accumulate onto an underlying animation value');
+    assert_equals(getComputedStyle(div).marginLeft, '20px',
+      'Animated style at 50%');
+  }, composite + ' onto an underlying animation value');
 
-test(function(t) {
-  var div = createDiv(t);
-  div.style.marginLeft = '10px';
-  var anim =
-    div.animate([{ marginLeft: '10px', composite: 'accumulate' },
-                 { marginLeft: '30px', composite: 'replace' }],
-                100);
+  test(function(t) {
+    var div = createDiv(t);
+    div.style.marginLeft = '10px';
+    var anim =
+      div.animate([{ marginLeft: '10px', composite },
+                   { marginLeft: '30px', composite: 'replace' }],
+                  100);
 
-  anim.currentTime = 50;
-  assert_equals(getComputedStyle(div).marginLeft, '25px',
-    'Animated style at 50%');
-}, 'Composite when mixing accumulate and replace');
+    anim.currentTime = 50;
+    assert_equals(getComputedStyle(div).marginLeft, '25px',
+      'Animated style at 50%');
+  }, 'Composite when mixing ' + composite + ' and replace');
 
-test(function(t) {
-  var div = createDiv(t);
-  div.style.marginLeft = '10px';
-  var anim =
-    div.animate([{ marginLeft: '10px', composite: 'replace' },
-                 { marginLeft: '20px' }],
-                { duration: 100 , composite: 'accumulate' });
+  test(function(t) {
+    var div = createDiv(t);
+    div.style.marginLeft = '10px';
+    var anim =
+      div.animate([{ marginLeft: '10px', composite: 'replace' },
+                   { marginLeft: '20px' }],
+                  { duration: 100 , composite });
 
-  anim.currentTime = 50;
-  assert_equals(getComputedStyle(div).marginLeft, '20px',
-    'Animated style at 50%');
-}, 'Composite specified on a keyframe overrides the composite mode of the ' +
-   'effect');
+    anim.currentTime = 50;
+    assert_equals(getComputedStyle(div).marginLeft, '20px',
+      'Animated style at 50%');
+  }, composite + ' specified on a keyframe overrides the composite mode of ' +
+     'the effect');
+});
 
 </script>