Index: ManualTests/animation/compositor-animation-multiple-timelines.html |
diff --git a/ManualTests/animation/compositor-animation-multiple-timelines.html b/ManualTests/animation/compositor-animation-multiple-timelines.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..e9bc937d9ed7b69e8b3f8977f49acfa558038cb0 |
--- /dev/null |
+++ b/ManualTests/animation/compositor-animation-multiple-timelines.html |
@@ -0,0 +1,51 @@ |
+<html> |
+<style> |
+div { |
+ position: relative; |
+ height: 100px; |
+ width: 100px; |
+ background: yellow; |
+} |
+</style> |
+<body> |
+<p> |
+Each section below has two boxes, the top runs on the main thread, the bottom |
+on the compositor. |
+</p><p> |
+This test is successful if the boxes are mostly in sync and all finish at the |
+same time. |
+</p> |
+<hr> |
+ |
+Multiple iframes test. |
+<br> |
+<div id="test1_blink">BLINK THREAD</div> |
+<div id="test1_impl">IMPL THREAD</div> |
+<hr> |
+ |
+<script> |
+var leftKeyframes = [ |
+ {left: '100px'}, |
+ {left: '600px'} |
+ ]; |
+var translateKeyframes = [ |
+ {transform: 'translateX(100px)'}, |
+ {transform: 'translateX(600px)'} |
+ ]; |
+ |
+var player1_blink = test1_blink.animate(leftKeyframes, { |
+ duration: 5000, |
+ delay: 100, |
+ }); |
+var player1_impl = test1_impl.animate(translateKeyframes, { |
+ duration: 5000, |
+ delay: 100, |
+ }); |
+</script> |
+ |
+<iframe src="compositor-animation-steps.html" style="border: 0; width: 100%; height: 50%">No iframe</iframe> |
+ |
+<iframe src="compositor-animation-same-property.html" style="border: 0; width: 100%; height: 50%">No iframe</iframe> |
+ |
+</body> |
+</html> |