mirror of
https://github.com/servo/servo.git
synced 2025-08-05 13:40:08 +01:00
Auto merge of #11699 - broesamle:issue10947_Test-body-scroll-quirksA, r=izgzhen
Tests for scroll_area on body element in quirks mode. <!-- Please describe your changes on the following line: --> --- <!-- Thank you for contributing to Servo! Please replace each `[ ]` by `[X]` when the step is complete, and replace `__` with appropriate data: --> - [X ] `./mach build -d` does not report any errors - [ X] `./mach test-tidy` does not report any errors - [ ] These changes fix #__ (github issue number if applicable). <!-- Either: --> - [X ] There are tests for these changes OR - [ ] These changes do not require tests because _____ see #10947 Node::scroll_area should check if the element is potentially scrollable Three tests use `document.scrollingElement` which was not supported at the time of writing. They are, hence, expected to FAIL. The last expected FAIL should be fixed by #10947. <!-- Reviewable:start --> --- This change is [<img src="https://reviewable.io/review_button.svg" height="35" align="absmiddle" alt="Reviewable"/>](https://reviewable.io/reviews/servo/servo/11699) <!-- Reviewable:end -->
This commit is contained in:
commit
bb3d7ee00f
3 changed files with 158 additions and 0 deletions
|
@ -36034,6 +36034,12 @@
|
|||
"deleted_reftests": {},
|
||||
"items": {
|
||||
"testharness": {
|
||||
"cssom-view/HTMLBody-ScrollArea_quirksmode.html": [
|
||||
{
|
||||
"path": "cssom-view/HTMLBody-ScrollArea_quirksmode.html",
|
||||
"url": "/cssom-view/HTMLBody-ScrollArea_quirksmode.html"
|
||||
}
|
||||
],
|
||||
"cssom-view/scrolling-no-browsing-context.html": [
|
||||
{
|
||||
"path": "cssom-view/scrolling-no-browsing-context.html",
|
||||
|
|
|
@ -0,0 +1,9 @@
|
|||
[HTMLBody-ScrollArea_quirksmode.html]
|
||||
[document.scrollingElement should be body element in quirks.]
|
||||
expected: FAIL
|
||||
[scrollingElement in quirks should be null when body is potentially scrollable.]
|
||||
expected: FAIL
|
||||
[scrollingElement in quirks should be body if any of document and body has a visible overflow.]
|
||||
expected: FAIL
|
||||
[When body potentially scrollable, document.body.scrollHeight changes when changing the height of the body content in quirks.]
|
||||
expected: FAIL
|
|
@ -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>
|
Loading…
Add table
Add a link
Reference in a new issue