mirror of
https://github.com/LadybirdBrowser/ladybird
synced 2026-04-27 02:05:07 +02:00
LibWeb: Improve scrollingElement handling
This change is currently entirely undetectable because of what the added FIXME talks about. Currently, the HTML element's overflow is always set to visible in both axes, so it getting set to "clip" in the imported test ends up not mattering at all.
This commit is contained in:
Psychpsyo
Notes:
github-actions[bot]
2026-01-13 11:48:17 +00:00
Author: https://github.com/Psychpsyo Commit: https://github.com/LadybirdBrowser/ladybird/commit/fe2bc2bfe73 Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/6724 Reviewed-by: https://github.com/AtkinsSJ ✅
@@ -0,0 +1,138 @@
|
||||
<!DOCTYPE html>
|
||||
<meta charset=utf-8>
|
||||
<title>cssom-view - scrollingElement</title>
|
||||
<script src="../../resources/testharness.js"></script>
|
||||
<script src="../../resources/testharnessreport.js"></script>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
function makeDescription(rootDisplay, bodyDisplay) {
|
||||
let a = [];
|
||||
if (rootDisplay) {
|
||||
a.push(`root ${rootDisplay}`);
|
||||
}
|
||||
if (bodyDisplay) {
|
||||
a.push(`body ${bodyDisplay}`);
|
||||
}
|
||||
let s = a.join(", ");
|
||||
if (s) {
|
||||
s = ` (${s})`;
|
||||
}
|
||||
return s;
|
||||
}
|
||||
|
||||
function quirksTest(rootDisplay, bodyDisplay) {
|
||||
async_test(function() {
|
||||
let quirksFrame = document.createElement("iframe");
|
||||
quirksFrame.onload = this.step_func_done(function() {
|
||||
var quirksDoc = quirksFrame.contentDocument;
|
||||
assert_equals(quirksDoc.compatMode, "BackCompat", "Should be in quirks mode.");
|
||||
assert_not_equals(quirksDoc.body, null, "Should have a body element");
|
||||
|
||||
quirksDoc.documentElement.style.display = rootDisplay;
|
||||
quirksDoc.body.style.display = bodyDisplay;
|
||||
|
||||
// Tests for quirks mode document.
|
||||
assert_equals(quirksDoc.scrollingElement, quirksDoc.body,
|
||||
"scrollingElement in quirks mode should default to body element.");
|
||||
|
||||
quirksDoc.documentElement.style.overflow = "clip";
|
||||
quirksDoc.body.style.overflow = "auto";
|
||||
assert_equals(quirksDoc.scrollingElement, null);
|
||||
quirksDoc.body.style.overflow = "hidden";
|
||||
assert_equals(quirksDoc.scrollingElement, null);
|
||||
quirksDoc.body.style.overflow = "scroll";
|
||||
assert_equals(quirksDoc.scrollingElement, null);
|
||||
quirksDoc.body.style.overflow = "visible";
|
||||
assert_equals(quirksDoc.scrollingElement, quirksDoc.body);
|
||||
quirksDoc.body.style.overflow = "clip";
|
||||
assert_equals(quirksDoc.scrollingElement, quirksDoc.body);
|
||||
|
||||
quirksDoc.documentElement.style.overflow = "scroll";
|
||||
quirksDoc.body.style.overflow = "scroll";
|
||||
assert_equals(quirksDoc.scrollingElement, null,
|
||||
"scrollingElement in quirks mode should be null if overflow of body and root element isn't visible.");
|
||||
quirksDoc.documentElement.style.overflow = "visible";
|
||||
assert_equals(quirksDoc.scrollingElement, quirksDoc.body);
|
||||
quirksDoc.documentElement.style.overflow = "scroll";
|
||||
quirksDoc.body.style.overflow = "visible";
|
||||
assert_equals(quirksDoc.scrollingElement, quirksDoc.body);
|
||||
quirksDoc.documentElement.style.overflow = "visible";
|
||||
assert_equals(quirksDoc.scrollingElement, quirksDoc.body);
|
||||
|
||||
quirksDoc.body.style.display = "none";
|
||||
assert_equals(quirksDoc.scrollingElement, quirksDoc.body)
|
||||
quirksDoc.body.style.display = "block";
|
||||
assert_equals(quirksDoc.scrollingElement, quirksDoc.body);
|
||||
|
||||
quirksDoc.documentElement.appendChild(quirksDoc.createElement("body"));
|
||||
assert_equals(quirksDoc.scrollingElement, quirksDoc.body);
|
||||
assert_equals(quirksDoc.scrollingElement, quirksDoc.getElementsByTagName("body")[0]);
|
||||
quirksDoc.documentElement.removeChild(quirksDoc.documentElement.lastChild);
|
||||
assert_equals(quirksDoc.scrollingElement, quirksDoc.body);
|
||||
|
||||
quirksDoc.documentElement.removeChild(quirksDoc.body);
|
||||
assert_equals(quirksDoc.scrollingElement, null);
|
||||
quirksDoc.documentElement.appendChild(quirksDoc.createElementNS("foobarNS", "body"));
|
||||
assert_equals(quirksDoc.scrollingElement, null);
|
||||
|
||||
quirksDoc.removeChild(quirksDoc.documentElement);
|
||||
assert_equals(quirksDoc.scrollingElement, null);
|
||||
|
||||
quirksDoc.appendChild(quirksDoc.createElementNS("foobarNS", "html"));
|
||||
quirksDoc.documentElement.appendChild(quirksDoc.createElement("body"));
|
||||
assert_equals(quirksDoc.scrollingElement, null);
|
||||
|
||||
quirksDoc.removeChild(quirksDoc.documentElement);
|
||||
quirksDoc.appendChild(quirksDoc.createElement("body"));
|
||||
assert_equals(quirksDoc.scrollingElement, null);
|
||||
|
||||
quirksFrame.remove();
|
||||
});
|
||||
quirksFrame.src =
|
||||
URL.createObjectURL(new Blob([], { type: "text/html" }));
|
||||
document.body.append(quirksFrame);
|
||||
}, `scrollingElement in quirks mode${makeDescription(rootDisplay, bodyDisplay)}`);
|
||||
}
|
||||
|
||||
function nonQuirksTest(rootDisplay, bodyDisplay) {
|
||||
async_test(function() {
|
||||
let nonQuirksFrame = document.createElement("iframe");
|
||||
nonQuirksFrame.onload = this.step_func_done(function() {
|
||||
var nonQuirksDoc = nonQuirksFrame.contentDocument;
|
||||
assert_equals(nonQuirksDoc.compatMode, "CSS1Compat", "Should be in standards mode.");
|
||||
assert_not_equals(nonQuirksDoc.body, null, "Should have a body element");
|
||||
|
||||
nonQuirksDoc.documentElement.style.display = rootDisplay;
|
||||
nonQuirksDoc.body.style.display = bodyDisplay;
|
||||
|
||||
assert_equals(nonQuirksDoc.scrollingElement, nonQuirksDoc.documentElement,
|
||||
"scrollingElement in standards mode should be the document element.");
|
||||
|
||||
for (let rootOverflow of ["", "clip", "scroll", "hidden", "visible"]) {
|
||||
for (let bodyOverflow of ["", "clip", "scroll", "hidden", "visible"]) {
|
||||
nonQuirksDoc.documentElement.style.overflow = rootOverflow;
|
||||
nonQuirksDoc.body.style.overflow = bodyOverflow;
|
||||
assert_equals(nonQuirksDoc.scrollingElement, nonQuirksDoc.documentElement);
|
||||
}
|
||||
}
|
||||
|
||||
nonQuirksDoc.removeChild(nonQuirksDoc.documentElement);
|
||||
assert_equals(nonQuirksDoc.scrollingElement, null);
|
||||
nonQuirksDoc.appendChild(nonQuirksDoc.createElement("foobar"));
|
||||
assert_equals(nonQuirksDoc.scrollingElement.localName, "foobar");
|
||||
|
||||
nonQuirksFrame.remove();
|
||||
});
|
||||
nonQuirksFrame.src =
|
||||
URL.createObjectURL(new Blob([`<!doctype html>`], { type: "text/html" }));
|
||||
document.body.append(nonQuirksFrame);
|
||||
}, `scrollingElement in no-quirks mode ${makeDescription(rootDisplay, bodyDisplay)}`);
|
||||
}
|
||||
|
||||
for (let rootDisplay of ["", "table"]) {
|
||||
for (let bodyDisplay of ["", "table"]) {
|
||||
quirksTest(rootDisplay, bodyDisplay);
|
||||
nonQuirksTest(rootDisplay, bodyDisplay);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user