Bug 1544198 - Test cases for the root element. r=jfkthame

These test cases intentionally check only Y-axis scroll position since horizontal scroll on the root element has been broken, e.g. bug 1102175 or bug 1260054. Differential Revision: https://phabricator.services.mozilla.com/D27988 --HG-- extra : moz-landing-system : lando
2019-04-23 01:14:37 +00:00 · 2019-04-23 01:14:37 +00:00 · 74bf341694
--- a/testing/web-platform/tests/css/css-scroll-snap/scroll-snap-type-on-root-element.html
+++ b/testing/web-platform/tests/css/css-scroll-snap/scroll-snap-type-on-root-element.html
@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<link rel="help" href="https://drafts.csswg.org/css-scroll-snap-1/#scroll-snap-type"/>
+<link rel="help" href="https://drafts.csswg.org/css-writing-modes-4/#principal-flow"/>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<style>
+html {
+  height: 3000px;
+  scroll-snap-type: inline mandatory;
+}
+#target {
+  position: absolute;
+  background-color: blue;
+  top: 1000px;
+  width: 100%;
+  height: 100px;
+}
+</style>
+<div id="target"></div>
+<script>
+const documentHeight = document.documentElement.clientHeight;
+test(() => {
+  target.style.scrollSnapAlign = "end start";
+
+  window.scrollTo(0, 1000);
+
+  // `target y (1000px)` + `target height (100px)` - document height.
+  assert_equals(document.scrollingElement.scrollTop, 1100 - documentHeight);
+
+  target.style.scrollSnapAlign = "";
+  window.scrollTo(0, 0);
+}, "The scroll-snap-type on the root element is applied");
+
+test(() => {
+  document.body.style.writingMode = "vertical-rl";
+  target.style.scrollSnapAlign = "start end";
+
+  window.scrollTo(0, 1000);
+  // `target y (1000px)` + `target height (100px)` - document height.
+  assert_equals(document.scrollingElement.scrollTop, 1100 - documentHeight);
+}, "The writing-mode on the body is used");
+</script>