diff options
Diffstat (limited to 'testing/web-platform/tests/cssom-view/HTMLBody-ScrollArea_quirksmode.html')
-rw-r--r-- | testing/web-platform/tests/cssom-view/HTMLBody-ScrollArea_quirksmode.html | 143 |
1 files changed, 143 insertions, 0 deletions
diff --git a/testing/web-platform/tests/cssom-view/HTMLBody-ScrollArea_quirksmode.html b/testing/web-platform/tests/cssom-view/HTMLBody-ScrollArea_quirksmode.html new file mode 100644 index 000000000..46fd5010e --- /dev/null +++ b/testing/web-platform/tests/cssom-view/HTMLBody-ScrollArea_quirksmode.html @@ -0,0 +1,143 @@ +<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'."); +}, "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> |