5eebf043fd80c41f0fc04b75534edc9c4f43ee24
[WebKit-https.git] / LayoutTests / css3 / scroll-snap / scroll-snap-style-changed-repeat.html
1 <html>
2
3     <head>
4         <style>
5             #gallery {
6                 width: 515px;
7                 height: 500px;
8                 -webkit-scroll-snap-type: mandatory;
9                 -webkit-overflow-scrolling: touch;
10                 -webkit-scroll-snap-points-y: repeat(500px);
11                 overflow-y: scroll;
12                 position: absolute;
13             }
14
15             .vertical {
16                 width: 500px;
17                 height: 500px;
18             }
19
20             #child00 { background-color: #DD0000; }
21             #child01 { background-color: #FF6666; }
22             #child02 { background-color: #00DD00; }
23             #child03 { background-color: #66FF66; }
24             #child04 { background-color: #0000DD; }
25             #child05 { background-color: #6666FF; }
26         </style>
27         <script src="../../resources/js-test-pre.js"></script>
28         <script>
29         function setup() {
30             var gallery = document.getElementById("gallery");
31
32             function snapOffsets() {
33                 return window.internals.scrollSnapOffsets(gallery);
34             }
35
36             // Test starts here. Each function call triggers the next.
37             function dumpSnapOffsetsAndUpdatePointsY() {
38                 debug("Original snap offsets: " + snapOffsets());
39                 gallery.style.webkitScrollSnapPointsY = "repeat(1000px)";
40                 setTimeout(dumpSnapOffsetsAndUpdateDestination, 0);
41             }
42
43             function dumpSnapOffsetsAndUpdateDestination() {
44                 debug("Updated points-y to repeat(1000px): " + snapOffsets());
45                 gallery.style.webkitScrollSnapDestination = "0px 250px";
46                 setTimeout(dumpSnapOffsetsAndUpdateType, 0);
47             }
48
49             function dumpSnapOffsetsAndUpdateType() {
50                 debug("Updated destination to 0px 250px: " + snapOffsets());
51                 gallery.style.webkitScrollSnapType = "none";
52                 setTimeout(dumpSnapOffsetsAndFinishTest, 0);
53             }
54
55             function dumpSnapOffsetsAndFinishTest() {
56                 debug("Updated type to none:" + snapOffsets());
57                 finishJSTest();
58                 testRunner.notifyDone();
59             }
60
61             if (window.testRunner) {
62                 window.jsTestIsAsync = true;
63                 testRunner.dumpAsText();
64                 testRunner.waitUntilDone();
65                 setTimeout(dumpSnapOffsetsAndUpdatePointsY, 0);
66             }
67         }
68         </script>
69     </head>
70
71     <body onload="setup()">
72         <div id="gallery">
73             <div class="vertical" id="child00"></div>
74             <div class="vertical" id="child01"></div>
75             <div class="vertical" id="child02"></div>
76             <div class="vertical" id="child03"></div>
77             <div class="vertical" id="child04"></div>
78             <div class="vertical" id="child05"></div>
79         </div>
80         <script src="../../resources/js-test-post.js"></script>
81     </body>
82
83 </html>