mirror of
https://github.com/servo/servo.git
synced 2025-08-05 13:40:08 +01:00
Auto merge of #19127 - tigercosmos:overflow10, r=emilio
scroll, SetScrollTop, SetScrollLeft in `element.rs` <!-- Please describe your changes on the following line: --> Currently dom-element-scroll have not finished yet. (Step 10) This PR finish the step 10 of `scroll`, `SetScrollTop`, `SetScrollLeft` [Step 10 description](https://drafts.csswg.org/cssom-view/#dom-element-scrolltop): > If the element does not have any associated CSS layout box, the element has no associated scrolling box, or the element has no overflow, terminate these steps. --- <!-- 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 - [X] These changes fix #19114 (github issue number if applicable). <!-- Either: --> - [X] There are tests for these changes <!-- Also, please make sure that "Allow edits from maintainers" checkbox is checked, so that we can help you if you get stuck somewhere along the way.--> <!-- Pull requests that do not address these steps are welcome, but they will require additional verification as part of the review process. --> <!-- Reviewable:start --> --- This change is [<img src="https://reviewable.io/review_button.svg" height="34" align="absmiddle" alt="Reviewable"/>](https://reviewable.io/reviews/servo/servo/19127) <!-- Reviewable:end -->
This commit is contained in:
commit
37760054e2
4 changed files with 157 additions and 5 deletions
|
@ -362,6 +362,19 @@ impl Element {
|
|||
!self.overflow_y_is_visible()
|
||||
}
|
||||
|
||||
// https://drafts.csswg.org/cssom-view/#scrolling-box
|
||||
fn has_scrolling_box(&self) -> bool {
|
||||
// TODO: scrolling mechanism, such as scrollbar (We don't have scrollbar yet)
|
||||
// self.has_scrolling_mechanism()
|
||||
self.overflow_x_is_hidden() ||
|
||||
self.overflow_y_is_hidden()
|
||||
}
|
||||
|
||||
fn has_overflow(&self) -> bool {
|
||||
self.ScrollHeight() > self.ClientHeight() ||
|
||||
self.ScrollWidth() > self.ClientWidth()
|
||||
}
|
||||
|
||||
// used value of overflow-x is "visible"
|
||||
fn overflow_x_is_visible(&self) -> bool {
|
||||
let window = window_from_node(self);
|
||||
|
@ -375,6 +388,20 @@ impl Element {
|
|||
let overflow_pair = window.overflow_query(self.upcast::<Node>().to_trusted_node_address());
|
||||
overflow_pair.y == overflow_y::computed_value::T::visible
|
||||
}
|
||||
|
||||
// used value of overflow-x is "hidden"
|
||||
fn overflow_x_is_hidden(&self) -> bool {
|
||||
let window = window_from_node(self);
|
||||
let overflow_pair = window.overflow_query(self.upcast::<Node>().to_trusted_node_address());
|
||||
overflow_pair.x == overflow_x::computed_value::T::hidden
|
||||
}
|
||||
|
||||
// used value of overflow-y is "hidden"
|
||||
fn overflow_y_is_hidden(&self) -> bool {
|
||||
let window = window_from_node(self);
|
||||
let overflow_pair = window.overflow_query(self.upcast::<Node>().to_trusted_node_address());
|
||||
overflow_pair.y == overflow_y::computed_value::T::hidden
|
||||
}
|
||||
}
|
||||
|
||||
#[allow(unsafe_code)]
|
||||
|
@ -1470,7 +1497,13 @@ impl Element {
|
|||
return;
|
||||
}
|
||||
|
||||
// Step 10 (TODO)
|
||||
// Step 10
|
||||
if !self.has_css_layout_box() ||
|
||||
!self.has_scrolling_box() ||
|
||||
!self.has_overflow()
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
// Step 11
|
||||
win.scroll_node(node, x, y, behavior);
|
||||
|
@ -1926,7 +1959,13 @@ impl ElementMethods for Element {
|
|||
return;
|
||||
}
|
||||
|
||||
// Step 10 (TODO)
|
||||
// Step 10
|
||||
if !self.has_css_layout_box() ||
|
||||
!self.has_scrolling_box() ||
|
||||
!self.has_overflow()
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
// Step 11
|
||||
win.scroll_node(node, self.ScrollLeft(), y, behavior);
|
||||
|
@ -2019,7 +2058,13 @@ impl ElementMethods for Element {
|
|||
return;
|
||||
}
|
||||
|
||||
// Step 10 (TODO)
|
||||
// Step 10
|
||||
if !self.has_css_layout_box() ||
|
||||
!self.has_scrolling_box() ||
|
||||
!self.has_overflow()
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
// Step 11
|
||||
win.scroll_node(node, x, self.ScrollTop(), behavior);
|
||||
|
|
|
@ -1,2 +0,0 @@
|
|||
[text-overflow-021.html]
|
||||
expected: FAIL
|
|
@ -32592,6 +32592,12 @@
|
|||
{}
|
||||
]
|
||||
],
|
||||
"css/cssom-view/dom-element-scroll.html": [
|
||||
[
|
||||
"/_mozilla/css/cssom-view/dom-element-scroll.html",
|
||||
{}
|
||||
]
|
||||
],
|
||||
"css/empty-keyframes.html": [
|
||||
[
|
||||
"/_mozilla/css/empty-keyframes.html",
|
||||
|
@ -62015,6 +62021,10 @@
|
|||
"16a4dd68da41156fbdd139b4a56547f94ad4dbe7",
|
||||
"support"
|
||||
],
|
||||
"css/cssom-view/dom-element-scroll.html": [
|
||||
"247b85d5988878a7b27bc9f0f7b817085725c038",
|
||||
"testharness"
|
||||
],
|
||||
"css/data_img_a.html": [
|
||||
"323bf50369f98ed02acccdd3a5824e38d3f353bf",
|
||||
"reftest"
|
||||
|
|
|
@ -0,0 +1,99 @@
|
|||
<!doctype html>
|
||||
<meta charset="utf-8">
|
||||
<title>dom-element-scroll tests</title>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<style>
|
||||
#section1 {
|
||||
width: 300px;
|
||||
height: 500px;
|
||||
top: 16px;
|
||||
left: 16px;
|
||||
border: inset gray 3px;
|
||||
background: white;
|
||||
}
|
||||
|
||||
#scrollable {
|
||||
width: 400px;
|
||||
height: 700px;
|
||||
background: linear-gradient(135deg, red, blue);
|
||||
}
|
||||
|
||||
#section2 {
|
||||
width: 300px;
|
||||
height: 500px;
|
||||
top: 16px;
|
||||
left: 16px;
|
||||
border: inset gray 3px;
|
||||
background: white;
|
||||
}
|
||||
|
||||
#unscrollable {
|
||||
width: 200px;
|
||||
height: 300px;
|
||||
background: linear-gradient(135deg, red, blue);
|
||||
}
|
||||
</style>
|
||||
<section id="section1">
|
||||
<div id="scrollable"></div>
|
||||
</section>
|
||||
<section id="section2">
|
||||
<div id="unscrollable"></div>
|
||||
</section>
|
||||
<script>
|
||||
var section1 = document.getElementById("section1");
|
||||
var section2 = document.getElementById("section2");
|
||||
|
||||
test(function () {
|
||||
// let it be "hidden" to have scrolling box
|
||||
section1.style.overflow = "hidden";
|
||||
|
||||
section1.scroll(50, 60);
|
||||
assert_equals(section1.scrollLeft, 50, "changed scrollLeft should be 50");
|
||||
assert_equals(section1.scrollTop, 60, "changed scrollTop should be 60");
|
||||
|
||||
section1.scroll(0, 0); // back to the origin
|
||||
}, "Element test for having scrolling box");
|
||||
|
||||
test(function () {
|
||||
section1.scroll(10, 20);
|
||||
assert_equals(section1.scrollLeft, 10, "changed scrollLeft should be 10");
|
||||
assert_equals(section1.scrollTop, 20, "changed scrollTop should be 20");
|
||||
|
||||
section1.scroll(0, 0); // back to the origin
|
||||
}, "Element test for having overflow");
|
||||
|
||||
test(function () {
|
||||
// make it not "hidden" to not have scrolling box
|
||||
section1.style.overflow = "visible";
|
||||
|
||||
section1.scroll(50, 0);
|
||||
assert_equals(section1.scrollLeft, 0, "changed scrollLeft should be 0");
|
||||
assert_equals(section1.scrollTop, 0, "changed scrollTop should be 0");
|
||||
|
||||
section1.scroll(0, 60);
|
||||
assert_equals(section1.scrollLeft, 0, "changed scrollLeft should be 0");
|
||||
assert_equals(section1.scrollTop, 0, "changed scrollTop should be 0");
|
||||
|
||||
section1.scroll(50, 60);
|
||||
assert_equals(section1.scrollLeft, 0, "changed scrollLeft should be 0");
|
||||
assert_equals(section1.scrollTop, 0, "changed scrollTop should be 0");
|
||||
|
||||
section1.scroll(0, 0); // back to the origin
|
||||
}, "Element test for not having scrolling box");
|
||||
|
||||
test(function () {
|
||||
section2.scroll(0, 20);
|
||||
assert_equals(section2.scrollLeft, 0, "changed scrollLeft should be 0");
|
||||
assert_equals(section2.scrollTop, 0, "changed scrollTop should be 0");
|
||||
|
||||
section2.scroll(10, 0);
|
||||
assert_equals(section2.scrollLeft, 0, "changed scrollLeft should be 0");
|
||||
assert_equals(section2.scrollTop, 0, "changed scrollTop should be 0");
|
||||
|
||||
section2.scroll(10, 20);
|
||||
assert_equals(section2.scrollLeft, 0, "changed scrollLeft should be 0");
|
||||
assert_equals(section2.scrollTop, 0, "changed scrollTop should be 0");
|
||||
}, "Element test for not having overflow");
|
||||
|
||||
</script>
|
Loading…
Add table
Add a link
Reference in a new issue