1 files changed, 145 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/cssom-view/HTMLBody-ScrollArea_quirksmode.html b/testing/web-platform/tests/css/cssom-view/HTMLBody-ScrollArea_quirksmode.html
new file mode 100644
index 0000000000..8255d13034
--- /dev/null
+++ b/testing/web-platform/tests/css/cssom-view/HTMLBody-ScrollArea_quirksmode.html
@@ -0,0 +1,145 @@
+<html>
+<script src="/resources/testharness.js" type="text/javascript"></script>
+<script src="/resources/testharnessreport.js" type="text/javascript"></script>
+<style type="text/css">
+    body {
+        border:1px solid black;
+        width:200px;
+        height:40px;
+
+        padding-bottom:50px;
+        padding-right:40px;
+    }
+    #elemSimple {
+        background:yellow;
+        width:60px;
+        height:30px;
+    }
+    #elemOverflow {
+        background:yellow;
+        width:250px;
+        height:150px;
+    }
+</style>
+<body id="thebody">
+    <div id="thediv"></div>
+</body>
+<script>
+// Testing for html body element's scroll- x, y, width, height behaviour in quirks mode
+// https://drafts.csswg.org/cssom-view/#potentially-scrollable
+// https://drafts.csswg.org/cssom-view/#dom-element-scrollheight
+test(function() {
+    // can i get the div element?
+    var thediv = document.getElementById("thediv");
+    assert_equals(thediv.id, "thediv");
+    // can i get the body element?
+    var thebody = document.getElementById("thebody");
+    assert_equals(thebody.id, "thebody");
+}, "Ensure that body element is loaded.")
+
+test(function() {
+    document.body.style.overflowY = "hidden";
+    assert_equals(document.body.style.overflowY, "hidden", "Could not set document.body.style.overflowY to 'hidden'.");
+    document.body.style.overflowY = "scroll";
+    assert_equals(document.body.style.overflowY, "scroll", "Could not set document.body.style.overflowY to 'scroll'.");
+    document.documentElement.style.overflowY = "scroll";
+    assert_equals(document.documentElement.style.overflowY, "scroll", "Could not set document.documentElement.style.overflow to 'scroll'.");
+    document.documentElement.style.overflowY = "";
+    document.body.style.overflowY = "";
+}, "Ensure that style.overflowY can be set properly.")
+
+test(function() {
+    assert_equals(document.compatMode, "BackCompat", "Should be in quirks mode.");
+}, "document.compatMode should be BackCompat in quirks.")
+
+test(function() {
+    var thebody = document.getElementById("thebody");
+    assert_equals(thebody.id, "thebody");
+    assert_equals(document.scrollingElement, thebody,
+                  "scrollingElement in quirks mode should default to body element.");
+}, "document.scrollingElement should be body element in quirks.")
+
+test(function() {
+    document.documentElement.style.overflowY = "scroll";
+    assert_equals(document.documentElement.style.overflowY, "scroll", "Could not set document.documentElement.style.overflowY to 'scroll'.");
+
+    var thebody = document.getElementById("thebody");
+    assert_equals(thebody.id, "thebody");
+    thebody.style.overflowY="scroll";
+    assert_equals(document.body.style.overflowY, "scroll", "Could not set document.body.style.overflowY to 'scroll'.");
+    // Body and document now both have overflow != visible
+    // => body `potentially scrollable`
+
+    // In quirks, when body is not `potentially scrollable`
+    //    document.scrollingElment returns the body, otherwise null
+    // https://drafts.csswg.org/cssom-view/#dom-document-scrollingelement
+    assert_equals(document.scrollingElement, null,
+                  "In quirks, we would expect null here (because of potentially scrollable body)");
+}, "scrollingElement in quirks should be null when body is potentially scrollable.")
+
+test(function() {
+    document.documentElement.style.overflowY = "visible";
+    assert_equals(document.documentElement.style.overflowY, "visible");
+    assert_equals(document.scrollingElement, document.body);
+
+    document.documentElement.style.overflowY = "scroll";
+    assert_equals(document.documentElement.style.overflowY, "scroll");
+    document.body.style.overflowY = "visible";
+    assert_equals(document.body.style.overflowY, "visible");
+    assert_equals(document.scrollingElement, document.body);
+
+    document.documentElement.style.overflowY = "visible";
+    assert_equals(document.documentElement.style.overflowY, "visible");
+    assert_equals(document.scrollingElement, document.body);
+}, "scrollingElement in quirks should be body if any of document and body has a visible overflow.")
+
+// no overflow property set to `visible` => pot. scrollable
+test(function() {
+    document.body.style.overflowY = "scroll";
+    assert_equals(document.body.style.overflowY, "scroll");
+    document.documentElement.style.overflowY = "scroll";
+    assert_equals(document.documentElement.style.overflowY, "scroll");
+
+    assert_greater_than(window.innerHeight, 400, "Window not large enough for valid test run.");
+    assert_not_equals(document.body.scrollHeight, window.innerHeight);
+
+    var elem = document.getElementById("thediv");
+    elem.style.height = "170px";
+    assert_equals(elem.style.height, "170px");
+
+    oldScrollHeight =  document.body.scrollHeight;
+    elem.style.height = "190px";
+    assert_equals(elem.style.height, "190px");
+    assert_equals(document.body.scrollHeight, oldScrollHeight+20);
+}, "When body potentially scrollable, document.body.scrollHeight changes when changing the height of the body content in quirks.")
+
+// any use of `visible` => not potentially scrollable
+function testNotPotScrollable (document_overflow, body_overflow) {
+    document.body.style.overflowY = body_overflow;
+    assert_equals(document.body.style.overflowY, body_overflow);
+    document.documentElement.style.overflowY = document_overflow;
+    assert_equals(document.documentElement.style.overflowY, document_overflow);
+
+    assert_greater_than(window.innerHeight, 400, "Window not large enough for valid test run.");
+    assert_equals(document.body.scrollHeight, window.innerHeight);
+
+    var elem = document.getElementById("thediv");
+    elem.style.height = "170px";
+    assert_equals(elem.style.height, "170px");
+    assert_equals(window.innerHeight, document.body.scrollHeight);
+
+    oldScrollHeight =  document.body.scrollHeight;
+    elem.style.height = "190px";
+    assert_equals(elem.style.height, "190px");
+    assert_equals(window.innerHeight, document.body.scrollHeight);
+    assert_equals(document.body.scrollHeight, oldScrollHeight);
+}
+
+tests = [["visible", "scroll"], ["scroll", "visible"], ["visible", "visible"]];
+for (var i = 0; i < tests.length; i++) {
+    test( function () {
+        testNotPotScrollable (tests[i][0], tests[i][1]);
+    }, "When body not potentially scrollable, document.body.scrollHeight always equals window.innerHeight in quirks. (cond. "+tests[i][0]+", "+tests[i][1]+")")
+}
+</script>
+</html>