| <!DOCTYPE html> |
| <html> |
| <head> |
| <style> |
| html { |
| margin: 0; |
| overflow: scroll; |
| } |
| body { |
| width: 300px; |
| height: 300px; |
| overflow: scroll; |
| scroll-snap-type: both mandatory; |
| } |
| .block { |
| scroll-snap-align: start; |
| width: 300px; |
| height: 300px; |
| } |
| </style> |
| <script src="../../resources/js-test.js"></script> |
| <script src="../../resources/ui-helper.js"></script> |
| <script> |
| function runTests() |
| { |
| try { |
| document.body.scrollTop = 160; |
| expectTrue(document.body.scrollTop == 300, "snapped to second snap offset"); |
| |
| document.body.scrollBy(0, 300); |
| expectTrue(document.body.scrollTop == 600, "snapped to third snap offset"); |
| |
| document.body.scrollBy(0, -100); |
| expectTrue(document.body.scrollTop == 300, "snapped back to second snap offset"); |
| } catch (e) { |
| console.log(e); |
| } |
| } |
| |
| function onLoad() |
| { |
| if (window.eventSender) { |
| runTests(); |
| } else { |
| document.getElementById('console').innerText = "This test cannot be run manually." |
| } |
| } |
| </script> |
| </head> |
| <body onload="onLoad();"> |
| <div class="block" style="background: #34344A"><div id="console"></div></div> |
| <div class="block" style="background: #80475E"></div> |
| <div class="block" style="background: #CC5A71"></div> |
| <div class="block" style="background: #C89B7B"></div> |
| </body> |
