Enable/Unprefix Animations & Transitions, add basic tests

This patch remove the Web Animations & CSS Animation runtime flags (and enables both). Removes prefixed Aninamations & Transitions and adds some basic tests & test support API.

R=ojan@chromium.org

Review URL: https://codereview.chromium.org/760183003

engine/src/flutter/tests/animation/basic-declarative-expected.txt

@@ -0,0 +1,5 @@
+Running 1 tests
+ok 1 top should amimate from 0 to 100px
+1 tests
+1 pass
+0 fail

engine/src/flutter/tests/animation/basic-declarative.sky

@@ -0,0 +1,31 @@
+<sky>
+<import src="../resources/chai.sky" />
+<import src="../resources/mocha.sky" />
+<div id="example"></div>
+<style>
+#example {
+    width: 100px;
+    height: 100px;
+    background: red;
+    position: relative;
+    animation-name: anim;
+    animation-timing-function: linear;
+    animation-duration: 5s;
+}
+
+@keyframes anim {
+    0%   { top: 0px; }
+    100% { top: 100px; }
+}
+</style>
+<script>
+var example = document.getElementById('example');
+
+describe('top', function() {
+  it('should amimate from 0 to 100px', function() {
+    internals.pauseAnimations(3);
+    assert.equal('60px', getComputedStyle(example).top);
+  });
+});
+</script>
+</sky>

engine/src/flutter/tests/animation/basic-imperative-expected.txt

@@ -0,0 +1,5 @@
+Running 1 tests
+ok 1 Element.animate opacity should amimate from 0 to 1
+1 tests
+1 pass
+0 fail

engine/src/flutter/tests/animation/basic-imperative.sky

@@ -0,0 +1,16 @@
+<sky>
+<import src="../resources/chai.sky" />
+<import src="../resources/mocha.sky" />
+<div id="example">Hello, Sky</div>
+<script>
+var example = document.getElementById('example');
+
+describe('Element.animate opacity', function() {
+  it('should amimate from 0 to 1', function() {
+    example.animate([{ opacity: 0 }, { opacity: 1}], 2000);
+    internals.pauseAnimations(.5);
+    assert.equal(.25, getComputedStyle(example).opacity);
+  });
+});
+</script>
+</sky>

engine/src/flutter/tests/animation/basic-transition-expected.txt

@@ -0,0 +1,5 @@
+Running 1 tests
+ok 1 width should transition from 100px to 200px
+1 tests
+1 pass
+0 fail

engine/src/flutter/tests/animation/basic-transition.sky

@@ -0,0 +1,31 @@
+<sky>
+<import src="../resources/chai.sky" />
+<import src="../resources/mocha.sky" />
+<div></div>
+<style>
+div {
+  width: 100px;
+  height: 100px;
+  background: red;
+  position: relative;
+  transition: width  2s;
+  transition-timing-function: linear;
+}
+
+div#example {
+  width: 200px;
+}
+</style>
+<script>
+var example = document.querySelector('div');
+example.offsetWidth; // force a style resolution so that next line's assigment triggers the transition
+example.id = "example";
+
+describe('width', function() {
+  it('should transition from 100px to 200px', function() {
+    internals.pauseAnimations(1);
+    assert.equal('150px', getComputedStyle(example).width);
+  });
+});
+</script>
+</sky>

engine/src/flutter/tools/third_party/PrettyPatch/PrettyPatch.rb

@@ -324,7 +324,7 @@ h1 :hover {
 }
 
 .overallComments .open {
-  -webkit-transition: height .2s;
+  transition: height .2s;
   height: 4em;
 }
 
@@ -407,7 +407,7 @@ h1 :hover {
   font-family: sans-serif;
   font-size: small;
   font-style: normal;
-  -webkit-transition: opacity 0.5s;
+  transition: opacity 0.5s;
 }
 
 .LinkContainer a {
@@ -487,7 +487,7 @@ div:focus {
   padding: 0 3px;
   outline: 1px solid #DDD;
   color: #8FDF5F;
-  font-size: small;   
+  font-size: small;
   background-color: #EEE;
 }