Add CSS Animations performance tests

tools/perf/page_sets/tough_animation_cases/css_animations_many_keyframes.html

Index: tools/perf/page_sets/tough_animation_cases/css_animations_many_keyframes.html
diff --git a/tools/perf/page_sets/tough_animation_cases/web_animations_many_keyframes.html b/tools/perf/page_sets/tough_animation_cases/css_animations_many_keyframes.html
similarity index 64%
copy from tools/perf/page_sets/tough_animation_cases/web_animations_many_keyframes.html
copy to tools/perf/page_sets/tough_animation_cases/css_animations_many_keyframes.html
index d30664c959b66c540d968d1213393fd6d12cc794..d7202423b50029e0e9f0a462c550c90e3f663c57 100644
--- a/tools/perf/page_sets/tough_animation_cases/web_animations_many_keyframes.html
+++ b/tools/perf/page_sets/tough_animation_cases/css_animations_many_keyframes.html
@@ -2,7 +2,6 @@
 <meta name="viewport" content="width=device-width, user-scalable=no">
 <link rel="stylesheet" type="text/css" href="resources/tablet.css">
 <script src="resources/perftesthelper.js"></script>
-<script src="resources/web_animations_api_check.js"></script>
 <style>
 target {
   position: absolute;
@@ -21,7 +20,7 @@ var numKeyframes = 500;
 var duration = 4000;
 
 function makeKeyframes(numKeyframes, width, height) {
-  var keyframes = [];
+  var keyframes = '@-webkit-keyframes anim {\n'
   for (var i = 0; i < numKeyframes + 1; i++) {
     var fraction = i / numKeyframes;
     var t = fraction * 2 * Math.PI;
@@ -29,19 +28,21 @@ function makeKeyframes(numKeyframes, width, height) {
     x = ((x / 4 + 1 / 2) * width).toFixed(5);
     var y = Math.pow(Math.sin(4 * t), 3) - Math.sin(2 * t);
     y = ((y / 4 + 1 / 2) * height).toFixed(5);
-    keyframes.push({transform: 'translate(' + x + 'px, ' + y + 'px)'});
+    keyframes += (fraction * 100) + '% { transform: translate(' + x + 'px, ' + y + 'px); }\n';
   }
   return keyframes;
 }
 
-requestAnimationFrame(function() {
-  var keyframes = makeKeyframes(numKeyframes, 550, 800);
-  for (var i = 0; i < N; i++) {
-    var target = document.createElement('target');
-    container.appendChild(target);
-    target.animate(keyframes, {duration: duration, iterations: Infinity, delay: -duration / 10 * i / N});
-  }
-});
+var style = document.createElement('style');
+style.textContent = makeKeyframes(numKeyframes, 550, 800);
+
+for (var i = 0; i < N; i++) {
+  var target = document.createElement('target');
+  target.style.webkitAnimation = 'anim ' + duration + 'ms linear infinite ' + (-duration / 10 * i / N) + 'ms';
+  container.appendChild(target);
+}
+
+container.appendChild(style);
 
 PerfTestHelper.signalReady();
 </script>