diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 01:47:29 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 01:47:29 +0000 |
commit | 0ebf5bdf043a27fd3dfb7f92e0cb63d88954c44d (patch) | |
tree | a31f07c9bcca9d56ce61e9a1ffd30ef350d513aa /testing/web-platform/tests/css/css-scroll-snap/scrollTo-scrollBy-snaps.html | |
parent | Initial commit. (diff) | |
download | firefox-esr-0ebf5bdf043a27fd3dfb7f92e0cb63d88954c44d.tar.xz firefox-esr-0ebf5bdf043a27fd3dfb7f92e0cb63d88954c44d.zip |
Adding upstream version 115.8.0esr.upstream/115.8.0esr
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/css/css-scroll-snap/scrollTo-scrollBy-snaps.html')
-rw-r--r-- | testing/web-platform/tests/css/css-scroll-snap/scrollTo-scrollBy-snaps.html | 160 |
1 files changed, 160 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-scroll-snap/scrollTo-scrollBy-snaps.html b/testing/web-platform/tests/css/css-scroll-snap/scrollTo-scrollBy-snaps.html new file mode 100644 index 0000000000..6013de5044 --- /dev/null +++ b/testing/web-platform/tests/css/css-scroll-snap/scrollTo-scrollBy-snaps.html @@ -0,0 +1,160 @@ +<!DOCTYPE html> +<link rel="help" href="https://drafts.csswg.org/css-scroll-snap-1/#scroll-snap-type" /> +<meta name="viewport" content="user-scalable=no"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<style> +html { + margin: 0px; + overflow: scroll; + scroll-snap-type: both mandatory; +} +div { + position: absolute; +} +.scroller { + overflow: scroll; + scroll-snap-type: both mandatory; +} +#inner-scroller { + top: 3000px; + width: 800px; + height: 800px; +} +.space { + left: 0px; + top: 0px; + width: 4000px; + height: 4000px; +} +.target { + width: 600px; + height: 600px; + scroll-snap-align: start; +} + +.left { + left: 0px; +} +.right { + left: 1000px; +} +.top { + top: 0px; +} +.bottom { + top: 1000px; +} +</style> +<body class="scroller"> + <div class="space"></div> + <div class="target left top"></div> + <div class="target right top"></div> + <div class="target left bottom"></div> + <div class="target right bottom"></div> + <div class="scroller" id="inner-scroller"> + <div class="space"></div> + <div class="target left top"></div> + <div class="target right top"></div> + <div class="target left bottom"></div> + <div class="target right bottom"></div> + </div> +</body> + +<script> +function format_dict(dict) { + const props = []; + for (let prop in dict) { + props.push(`${prop}: ${format_value(dict[prop])}`); + } + return `{${props.join(', ')}}`; +} + +var divScroller = document.getElementById("inner-scroller"); +var viewport = document.scrollingElement; +[ + [{left: 800}, 1000, 0], + [{top: 900}, 0, 1000], + [{left: 900, top: 800}, 1000, 1000], + [{left: 800, top: -100}, 1000, 0], /* outside bounds on y axis */ + [{left: 10000, top: -100}, 1000, 0] /* outside bounds on both axes */ +].forEach(([input, expectedX, expectedY]) => { + test(() => { + divScroller.scrollTo(0, 0); + assert_equals(divScroller.scrollLeft, 0); + assert_equals(divScroller.scrollTop, 0); + if (input.left) + divScroller.scrollLeft = input.left; + if (input.top) + divScroller.scrollTop = input.top; + assert_equals(divScroller.scrollLeft, expectedX); + assert_equals(divScroller.scrollTop, expectedY); + }, `assign scrollLeft and scrollTop for ${format_dict(input)} on div lands on (${expectedX}, ${expectedY})`); + + test(() => { + viewport.scrollTo(0, 0); + assert_equals(viewport.scrollLeft, 0); + assert_equals(viewport.scrollTop, 0); + if (input.left) + viewport.scrollLeft = input.left; + if (input.top) + viewport.scrollTop = input.top; + assert_equals(viewport.scrollLeft, expectedX); + assert_equals(viewport.scrollTop, expectedY); + }, `assign scrollLeft and scrollTop for ${format_dict(input)} on viewport-defining element lands on (${expectedX}, ${expectedY})`); + + test(() => { + divScroller.scrollTo(0, 0); + assert_equals(divScroller.scrollLeft, 0); + assert_equals(divScroller.scrollTop, 0); + divScroller.scrollTo(input); + assert_equals(divScroller.scrollLeft, expectedX); + assert_equals(divScroller.scrollTop, expectedY); + }, `scrollTo(${format_dict(input)}) on div lands on (${expectedX}, ${expectedY})`); + + test(() => { + divScroller.scrollTo(0, 0); + assert_equals(divScroller.scrollLeft, 0); + assert_equals(divScroller.scrollTop, 0); + divScroller.scrollBy(input); + assert_equals(divScroller.scrollLeft, expectedX); + assert_equals(divScroller.scrollTop, expectedY); + }, `scrollBy(${format_dict(input)}) on div lands on (${expectedX}, ${expectedY})`); + + test(() => { + viewport.scrollTo(0, 0); + assert_equals(viewport.scrollLeft, 0); + assert_equals(viewport.scrollTop, 0); + viewport.scrollTo(input); + assert_equals(viewport.scrollLeft, expectedX); + assert_equals(viewport.scrollTop, expectedY); + }, `scrollTo(${format_dict(input)}) on viewport-defining element lands on (${expectedX}, ${expectedY})`); + + test(() => { + viewport.scrollTo(0, 0); + assert_equals(viewport.scrollLeft, 0); + assert_equals(viewport.scrollTop, 0); + viewport.scrollBy(input); + assert_equals(viewport.scrollLeft, expectedX); + assert_equals(viewport.scrollTop, expectedY); + }, `scrollBy(${format_dict(input)}) on viewport-defining element lands on (${expectedX}, ${expectedY})`); + + test(() => { + window.scrollTo(0, 0); + assert_equals(window.scrollX, 0); + assert_equals(window.scrollY, 0); + window.scrollTo(input); + assert_equals(window.scrollX, expectedX); + assert_equals(window.scrollY, expectedY); + }, `scrollTo(${format_dict(input)}) on window lands on (${expectedX}, ${expectedY})`); + + test(() => { + window.scrollTo(0, 0); + assert_equals(window.scrollX, 0); + assert_equals(window.scrollY, 0); + window.scrollBy(input); + assert_equals(window.scrollX, expectedX); + assert_equals(window.scrollY, expectedY); + }, `scrollBy(${format_dict(input)}) on window lands on (${expectedX}, ${expectedY})`); +}); +</script> |