eliott/ladybird
1
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird synced 2026-04-27 10:07:15 +02:00
Code Issues Packages Projects Releases Wiki Activity

Tests: Import tests for scrollParent() and offsetParent()

Browse Source
This commit is contained in:
Sam Atkins
2025-06-24 12:33:42 +01:00
committed by Jelle Raaijmakers
parent 2ff9e1d038
commit 8b6c32e3ab
Notes: github-actions[bot] 2025-06-24 13:27:45 +00:00 
Author: https://github.com/AtkinsSJ
Commit: https://github.com/LadybirdBrowser/ladybird/commit/8b6c32e3abc
Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/5195
Reviewed-by: https://github.com/gmta ✅
6 changed files with 394 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

94
Tests/LibWeb/Text/input/wpt-import/css/cssom-view/scrollParent-shadow-tree.html Normal file
View File

@@ -0,0 +1,94 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSSOM View —— scrollParent test</title>
<link rel="help" href="https://drafts.csswg.org/cssom-view/#dom-htmlelement-scrollparent">
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<style>
.scroller {
overflow: scroll;
border: 1px solid blue;
}
.scroller {
height: 150px;
}
.target {
background: repeating-linear-gradient(30deg, white 0px, white 30px, green 30px, green 60px);
height: 1000px;
}
.spacer {
background: repeating-linear-gradient(-30deg, white 0px, white 30px, blue 30px, blue 60px);
height: 1000px;
}
</style>
<script>
var closedShadowRoot = null;
class BaseComponent extends HTMLElement {
constructor(mode = 'open') {
super();
const shadowRoot = this.attachShadow({ mode });
shadowRoot.innerHTML = `
<style>
.shadow-scroller {
overflow: scroll;
height: 50px;
border: 1px solid black;
}
</style>
<div>
<div class="shadow-scroller">
<slot><p>No description.</p></slot>
</div>
</div>
`;
if (mode == 'closed') {
closedShadowRoot = shadowRoot;
}
}
}
class HiddenComponent extends BaseComponent {
constructor() { super('closed'); }
}
class OpenComponent extends BaseComponent {
constructor() { super('open'); }
}
customElements.define('hidden-component', HiddenComponent);
customElements.define('open-component', OpenComponent);
</script>
<div id="outerScroller" class="scroller">
<div class="spacer">
<hidden-component id="shadowComponent">
<div>
<div id="closedInnerElement" class="target"></div>
</div>
</hidden-component>
<open-component id="openShadowComponent">
<div>
<div id="openInnerElement" class="target"></div>
</div>
</open-component>
</div>
</div>
<script>
test(() => {
assert_equals(closedInnerElement.scrollParent, outerScroller);
}, "scrollParent skips intermediate closed shadow tree nodes");
test(() => {
assert_equals(openInnerElement.scrollParent, outerScroller);
}, "scrollParent skips intermediate open shadow tree nodes");
test(() => {
assert_equals(closedShadowRoot.querySelector('div').scrollParent, outerScroller);
}, "scrollParent from inside closed shadow tree");
test(() => {
assert_equals(openShadowComponent.shadowRoot.querySelector('div').scrollParent, outerScroller);
}, "scrollParent from inside open shadow tree");
</script>
</body>
</html>