From 43a97878ce14b72f0981164f87f2e35e14151312 Mon Sep 17 00:00:00 2001
From: Daniel Baumann <daniel.baumann@progress-linux.org>
Date: Sun, 7 Apr 2024 11:22:09 +0200
Subject: Adding upstream version 110.0.1.

Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
---
 ...ge-element-not-covering-snapport.tentative.html | 91 ++++++++++++++++++++++
 1 file changed, 91 insertions(+)
 create mode 100644 testing/web-platform/tests/css/css-scroll-snap/scroll-on-large-element-not-covering-snapport.tentative.html

(limited to 'testing/web-platform/tests/css/css-scroll-snap/scroll-on-large-element-not-covering-snapport.tentative.html')
diff --git a/testing/web-platform/tests/css/css-scroll-snap/scroll-on-large-element-not-covering-snapport.tentative.html b/testing/web-platform/tests/css/css-scroll-snap/scroll-on-large-element-not-covering-snapport.tentative.html
new file mode 100644
index 0000000000..2db00d414a
--- /dev/null
+++ b/testing/web-platform/tests/css/css-scroll-snap/scroll-on-large-element-not-covering-snapport.tentative.html
@@ -0,0 +1,91 @@
+<!DOCTYPE html>
+<title>
+  A test case that scrolling to a point on large element where the snap area
+  doesn't cover over the snapport
+</title>
+<link rel="help" href="https://drafts.csswg.org/css-scroll-snap-1/#snap-overflow"/>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<style>
+div {
+  position: absolute;
+  width: 100%;
+}
+#scroller {
+  left: 10px;
+  height: 200px;
+  width: 100px;
+  overflow-y: scroll;
+  overflow-x: hidden;
+  scroll-snap-type: y mandatory;
+}
+.snap {
+  scroll-snap-align: start;
+  background-color: green;
+}
+.target {
+  background-color: red;
+  border-radius: 100%;
+  height: 88px;
+  top: 536px;
+}
+</style>
+<div id="scroller">
+  <div style="height: 2000px;"></div>
+  <div class="snap" style="top:    0px; height:   40px;">1</div>
+  <div class="snap" style="top:   40px; height:   40px;">2</div>
+  <div class="snap" style="top:   80px; height: 1000px;">3</div>
+  <div class="snap" style="top: 1080px; height:   40px;">4</div>
+  <div class="snap" style="top: 1120px; height:   40px;">5</div>
+  <div class="target"></div>
+</div>
+<script>
+test(() => {
+  const scroller = document.getElementById("scroller");
+
+  scroller.scrollBy(0, 10);
+  // Snap to the first snap point.
+  assert_equals(scroller.scrollLeft, 0);
+  assert_equals(scroller.scrollTop, 40);
+
+  scroller.scrollBy(0, 10);
+  // Snap to the second snap point.
+  assert_equals(scroller.scrollLeft, 0);
+  assert_equals(scroller.scrollTop, 80);
+
+  scroller.scrollBy(0, 100);
+  // Snap to the given scrolling position since the third snap target element
+  // is larger than the snapport.
+  assert_equals(scroller.scrollLeft, 0);
+  assert_equals(scroller.scrollTop, 180);
+
+  scroller.scrollBy(0, 100);
+  // Again, snap to the given scrolling position.
+  assert_equals(scroller.scrollLeft, 0);
+  assert_equals(scroller.scrollTop, 280);
+
+  // Scroll to a point where the third target element is still covering over the
+  // snapport.
+  scroller.scrollBy(0, 600);
+  assert_equals(scroller.scrollLeft, 0);
+  // Again, snap to the given scrolling position.
+  assert_equals(scroller.scrollTop, 880);
+
+  // Scroll to a point where the third target element is no longer convering
+  // over the snapport, rather the forth snap point is in the snapport.
+  scroller.scrollBy(0, 10);
+  // Now, snap to the forth snap point.
+  assert_equals(scroller.scrollLeft, 0);
+  assert_equals(scroller.scrollTop, 1080);
+
+  // Scroll back a bit.
+  scroller.scrollBy(0, -10);
+  // Now, snap back to the third snap point because at the moment when scrolling
+  // up by 10px, the large third snap target element isn't covering over the
+  // snapport, i.e. only bottom 10px of the large element is in the snapport.
+  // See https://github.com/w3c/csswg-drafts/issues/7262
+  assert_equals(scroller.scrollLeft, 0);
+  assert_equals(scroller.scrollTop, 80);
+}, 'There\'s no valid snap positions on large element if it doesn\'t cover ' +
+   'the snapport');
+</script>
-- 
cgit v1.2.3

