summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/scroll-animations/css/scroll-animation-initial-offset.html
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 01:47:29 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 01:47:29 +0000
commit0ebf5bdf043a27fd3dfb7f92e0cb63d88954c44d (patch)
treea31f07c9bcca9d56ce61e9a1ffd30ef350d513aa /testing/web-platform/tests/scroll-animations/css/scroll-animation-initial-offset.html
parentInitial commit. (diff)
downloadfirefox-esr-0ebf5bdf043a27fd3dfb7f92e0cb63d88954c44d.tar.xz
firefox-esr-0ebf5bdf043a27fd3dfb7f92e0cb63d88954c44d.zip
Adding upstream version 115.8.0esr.upstream/115.8.0esr
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/scroll-animations/css/scroll-animation-initial-offset.html')
-rw-r--r--testing/web-platform/tests/scroll-animations/css/scroll-animation-initial-offset.html73
1 files changed, 73 insertions, 0 deletions
diff --git a/testing/web-platform/tests/scroll-animations/css/scroll-animation-initial-offset.html b/testing/web-platform/tests/scroll-animations/css/scroll-animation-initial-offset.html
new file mode 100644
index 0000000000..34ae52d479
--- /dev/null
+++ b/testing/web-platform/tests/scroll-animations/css/scroll-animation-initial-offset.html
@@ -0,0 +1,73 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+<title>Composited scroll-linked animation with initial scroll offset</title>
+<link rel="help" href="https://drafts.csswg.org/scroll-animations-1/">
+<link rel="match" href="scroll-animation-initial-offset-ref.html">
+<style>
+
+#scroller {
+ overflow-y: auto;
+ height: 200px;
+ border: 2px solid green;
+ position: relative;
+ background: gray;
+}
+
+.spacer {
+ height: 1000px;
+}
+
+@keyframes anim {
+ 0% { transform: translateY(0); }
+ 100% { transform: translateY(800px); }
+}
+
+#align {
+ box-sizing: border-box;
+ width: 100%;
+ height: 50px;
+ background: rgba(0, 0, 200, 0.2);
+ color: white;
+ position: absolute;
+ border: 1px solid white;
+ animation: anim linear 10s;
+ animation-timeline: scroll();
+ will-change: transform;
+}
+
+#marker {
+ width: 100%;
+ height: 50px;
+ background: #640;
+ position: absolute;
+ top: 350px;
+}
+
+</style>
+<div id="scroller">
+ <div id="align">TOP</div>
+ <div class="spacer"></div>
+ <div id="marker">BOTTOM</div>
+</div>
+<script>
+
+ // Test that a scroll-linked animation of a composited property reacts
+ // correctly to a programmatic scroll early during the page load.
+ //
+ // The scroll offset will change before the animation is "started" on the
+ // compositor, so it needs to be able to handle a non-zero initial offset.
+ //
+ scroller.scrollTo(0, 200);
+
+</script>
+<script src="/web-animations/testcommon.js"></script>
+<script>
+
+ document.documentElement.addEventListener('TestRendered', async () => {
+ await waitForCompositorReady();
+ await waitForNextFrame();
+ await waitForNextFrame();
+ document.documentElement.classList.remove("reftest-wait");
+ }, { once: true });
+
+</script>