Bug 1321428 - Add an async scrolling reftest for a scroll-driven animation. r=kats draft
authorBotond Ballo <botond@mozilla.com>
Mon, 16 Jan 2017 16:56:20 -0500
changeset 542205 2b54ba1a0f8f7ad024beda72c6d1efffb7f87800
parent 542204 eedbefcca12df1855c726c75e603036a180b420e
child 542206 2e1ea0b30e07d37dd378a7d29c87f75e58d0284a
push id50961
push userbballo@mozilla.com
push dateFri, 24 Mar 2017 22:03:27 +0000
reviewerskats
bugs1321428
milestone55.0a1
Bug 1321428 - Add an async scrolling reftest for a scroll-driven animation. r=kats MozReview-Commit-ID: Kb6Z5VuB0Nx
layout/reftests/async-scrolling/animation/reftest.list
layout/reftests/async-scrolling/animation/transform-1-ref.html
layout/reftests/async-scrolling/animation/transform-1.html
layout/reftests/async-scrolling/reftest.list
new file mode 100644
--- /dev/null
+++ b/layout/reftests/async-scrolling/animation/reftest.list
@@ -0,0 +1,3 @@
+default-preferences pref(dom.animations-api.scroll-driven.enabled,true) 
+
+skip-if(!isNightlyBuild) skip-if(!asyncPan) == transform-1.html transform-1-ref.html
new file mode 100644
--- /dev/null
+++ b/layout/reftests/async-scrolling/animation/transform-1-ref.html
@@ -0,0 +1,6 @@
+<!DOCTYPE HTML>
+<html>
+<body>
+  <div style="margin-top:150px; margin-left:50px; width:100px; height:100px; background:green">
+  </div>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/async-scrolling/animation/transform-1.html
@@ -0,0 +1,38 @@
+<!DOCTYPE HTML>
+<html reftest-async-scroll
+      reftest-displayport-x="0" reftest-displayport-y="0"
+      reftest-displayport-w="800" reftest-displayport-h="2000"
+      reftest-async-scroll-x="0" reftest-async-scroll-y="50"
+      style="overflow: hidden">
+<body>
+  <div id="box" style="margin-top:200px; width:100px; height:100px; background: green">
+  </div>
+  <div style="height:5000px">
+</body>
+<script>
+document.addEventListener("DOMContentLoaded", ()=>{
+  let scrollable = document.documentElement;
+  let box = document.getElementById("box");
+  let effect = new KeyframeEffect(
+    box,
+    [
+      { transform: 'translate(0, 0)' },
+      { transform: 'translate(100px, 0)' }
+    ],
+    {
+      duration: 1000,
+      iterations: Infinity,
+      easing: 'linear'
+    });
+  let timeline = new ScrollTimeline({
+    scrollSource: scrollable,
+    orientation: 'vertical',
+    timeRange: 1000,
+    startScrollOffset: "0px",
+    endScrollOffset: "100px"
+  });
+  let animation = new Animation(effect, timeline);
+  animation.play();
+});
+</script>
+</html>
--- a/layout/reftests/async-scrolling/reftest.list
+++ b/layout/reftests/async-scrolling/reftest.list
@@ -1,8 +1,11 @@
+# scroll-driven animation tests
+include animation/reftest.list
+
 skip-if(!asyncPan) == bg-fixed-1.html bg-fixed-1-ref.html
 skip-if(!asyncPan) == bg-fixed-cover-1.html bg-fixed-cover-1-ref.html
 skip-if(!asyncPan) == bg-fixed-cover-2.html bg-fixed-cover-2-ref.html
 skip-if(!asyncPan) == bg-fixed-cover-3.html bg-fixed-cover-3-ref.html
 skip-if(!asyncPan) == bg-fixed-child.html bg-fixed-child-ref.html
 skip-if(!asyncPan) == bg-fixed-child-clip-1.html bg-fixed-child-clip-ref.html
 skip-if(!asyncPan) == bg-fixed-child-clip-2.html bg-fixed-child-clip-ref.html
 fuzzy(1,246) fuzzy-if(skiaContent,2,160) fuzzy-if(browserIsRemote&&d2d,53,185) skip-if(!asyncPan) == bg-fixed-child-mask.html bg-fixed-child-mask-ref.html