Unreviewed test update: Add multiple scroll-snap-coordinate test.
authorbfulgham@apple.com <bfulgham@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 16 Jun 2015 22:08:53 +0000 (22:08 +0000)
committerbfulgham@apple.com <bfulgham@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 16 Jun 2015 22:08:53 +0000 (22:08 +0000)
https://bugs.webkit.org/show_bug.cgi?id=145843

Add a test that confirms that we properly understand scroll-snap-coordinate
declarations with sets of points on a single element.

* css3/scroll-snap/scroll-snap-coordinate.html: Added.
* css3/scroll-snap/scroll-snap-coordinate-expected.txt: Added.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@185617 268f45cc-cd09-0410-ab3c-d52691b4dbfc

LayoutTests/ChangeLog
LayoutTests/css3/scroll-snap/scroll-snap-coordinate-expected.txt [new file with mode: 0644]
LayoutTests/css3/scroll-snap/scroll-snap-coordinate.html [new file with mode: 0644]

index fbedc6e..529f71c 100644 (file)
@@ -1,3 +1,14 @@
+2015-06-16  Brent Fulgham  <bfulgham@apple.com>
+
+        Unreviewed test update: Add multiple scroll-snap-coordinate test.
+        https://bugs.webkit.org/show_bug.cgi?id=145843
+
+        Add a test that confirms that we properly understand scroll-snap-coordinate
+        declarations with sets of points on a single element.
+
+        * css3/scroll-snap/scroll-snap-coordinate.html: Added.
+        * css3/scroll-snap/scroll-snap-coordinate-expected.txt: Added.
+
 2015-06-16  Alexey Proskuryakov  <ap@apple.com>
 
         Tweak results for fast/canvas/canvas-too-large-to-draw.html
diff --git a/LayoutTests/css3/scroll-snap/scroll-snap-coordinate-expected.txt b/LayoutTests/css3/scroll-snap/scroll-snap-coordinate-expected.txt
new file mode 100644 (file)
index 0000000..c3077b3
--- /dev/null
@@ -0,0 +1,8 @@
+PASS successfullyParsed is true
+
+TEST COMPLETE
+Scroll-snap offsets for 'container': vertical = { 0, 101, 219, 339, 458, 575, 592, 692, 812, 931, 1049, 1167, 1285, 1402, 1520, 1638, 1756, 1876, 1995, 2012, 2112, 2232, 4964 }
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
diff --git a/LayoutTests/css3/scroll-snap/scroll-snap-coordinate.html b/LayoutTests/css3/scroll-snap/scroll-snap-coordinate.html
new file mode 100644 (file)
index 0000000..c63cf9d
--- /dev/null
@@ -0,0 +1,144 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Snap points - nested snap coordinates</title>
+    <style>
+        .scrollable {
+            overflow: scroll;
+            -webkit-overflow-scrolling: touch;
+            border: 1px dashed black;
+            height: 300px;
+            margin: 0 10px;
+        }
+    
+        .center-snap-receiver {
+            -webkit-scroll-snap-type: mandatory;
+            -webkit-scroll-snap-destination: 0 0;
+        }
+    
+        .snap-point-marker {
+            margin-top: 100px;
+            width: 15px;
+            height: 15px;
+            border: 1px solid black;
+        }
+
+        .snap-point {
+            -webkit-scroll-snap-coordinate: 0 0px;
+        }
+
+        .multiple-coordinates {
+            -webkit-scroll-snap-coordinate: 0 0px 0 100px 0 220px;
+        }
+
+        .nested {
+            border: 1px dashed blue;
+        }
+    
+        .snap-point-marker::after {
+            font-size: 1em;
+            position: relative;
+            content: '+';
+        }
+    
+        .nested > .snap-point-marker {
+            margin-left: 50px;
+            border: 1px solid red;
+        }
+        .nested > .nested > .snap-point-marker {
+            margin-left: 100px;
+            border: 1px solid blue;
+        }
+    
+        .large-content {
+            height: 3000px;
+            width: 100%;
+        }
+    
+        .small-content {
+            height: 200px;
+            width: 100%;
+        }
+
+        .invalidContainer {
+            border: 1px dashed black;
+            height: 300px;
+            margin: 0 10px;
+            opacity: 0.5;
+            overflow: hidden;
+        }
+    </style>
+        <script src="../../resources/js-test-pre.js"></script>
+        <script>
+        function runTest()
+        {
+            var container = document.getElementById('container');
+            debug("Scroll-snap offsets for 'container': " + window.internals.scrollSnapOffsets(container));
+
+            finishJSTest();
+            testRunner.notifyDone();
+        }
+
+        function onLoad()
+        {
+            if (window.testRunner) {
+                window.jsTestIsAsync = true;
+                testRunner.dumpAsText();
+                testRunner.waitUntilDone();
+                setTimeout(runTest, 0);
+            }
+        }
+        </script>
+</head>
+<body onload="onLoad();">
+    <div id="container" class="center-snap-receiver scrollable">
+        <div class="snap-point snap-point-marker"></div>
+        <div class="nested">
+            <div class="snap-point snap-point-marker"></div>
+        </div>
+        <div class="nested">
+            <div class="nested">
+                <div class="snap-point snap-point-marker"></div>
+            </div>
+        </div>
+        <div class="snap-point snap-point-marker"></div>
+        <div class="snap-point snap-point-marker"></div>
+        <div class="multiple-coordinates nested">
+            <div class="snap-point-marker"></div>
+            <div class="nested">
+                <div class="snap-point-marker"></div>
+            </div>
+        </div>
+        <div class="nested">
+            <div class="snap-point snap-point-marker"></div>
+        </div>
+        <div class="snap-point snap-point-marker"></div>
+        <div class="nested">
+            <div class="snap-point snap-point-marker"></div>
+        </div>
+        <div class="snap-point snap-point-marker"></div>
+        <div class="snap-point snap-point-marker"></div>
+        <div class="nested">
+            <div class="snap-point snap-point-marker"></div>
+        </div>
+         <div class="snap-point snap-point-marker"></div>
+        <div class="nested">
+            <div class="snap-point snap-point-marker"></div>
+        </div>
+        <div class="nested">
+            <div class="nested">
+                <div class="snap-point snap-point-marker"></div>
+            </div>
+        </div>
+        <div class="snap-point snap-point-marker"></div>
+        <div class="nested multiple-coordinates">
+            <div class="snap-point-marker"></div>
+            <div class="nested">
+                <div class="snap-point-marker"></div>
+            </div>
+        </div>
+        <div class="large-content"></div>
+    </div>
+    <script src="../../resources/js-test-post.js"></script>
+</body>
+</html>