Web Animations API: Deferred computation of interpolated values

LayoutTests/web-animations-api/animations-responsive-transform.html

Index: LayoutTests/web-animations-api/animations-responsive-transform.html
diff --git a/LayoutTests/web-animations-api/animations-responsive-to-inherited-change.html b/LayoutTests/web-animations-api/animations-responsive-transform.html
similarity index 50%
copy from LayoutTests/web-animations-api/animations-responsive-to-inherited-change.html
copy to LayoutTests/web-animations-api/animations-responsive-transform.html
index febd195fbdd7bc9d7177bb22219541e42f9ba5be..35da288e5aa91f1a45af8868773465c2ace3ed89 100644
--- a/LayoutTests/web-animations-api/animations-responsive-to-inherited-change.html
+++ b/LayoutTests/web-animations-api/animations-responsive-transform.html
@@ -3,26 +3,20 @@
 <script src="../resources/testharnessreport.js"></script>
 
 <div id='container'>
-    <div id='element'></div>
+<div id='element'></div>
 </div>
 
 <script>
-
-var container = document.getElementById('container');
 var element = document.getElementById('element');
-
-var keyframes = [
-    {fontSize: 'inherit', offset: 0},
-    {fontSize: '20px', offset: 1}
-];
+var container = document.getElementById('container');
 
 test(function() {
     container.style.fontSize = '10px';
-    var player = element.animate(keyframes, 10);
+    var player = element.animate([{transform: 'translateX(10em)', offset: 0}, {transform: 'translateX(20em)', offset: 1}], 10);
     player.pause();
-    player.currentTime = 5;
-    container.style.fontSize = '30px';
-    assert_equals(getComputedStyle(element).fontSize, '25px');
-}, 'Font size responsive to inherited changes');
+    player.currentTime = 2;
+    container.style.fontSize = '20px';
+    assert_equals(getComputedStyle(element).transform, 'matrix(1, 0, 0, 1, 240, 0)');
+}, 'Transform responsive to font size changes');
 
 </script>