mirror of
https://github.com/servo/servo.git
synced 2025-07-17 20:33:40 +01:00
86 lines
No EOL
3.9 KiB
HTML
86 lines
No EOL
3.9 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title> CSS Scroll Snap 2 Test: scroll-start-target-* computed values</title>
|
|
<link rel="help" href="https://drafts.csswg.org/css-scroll-snap-2/#scroll-start">
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
<script src="/css/support/computed-testcommon.js"></script>
|
|
</head>
|
|
|
|
<body>
|
|
<div id="target"></div>
|
|
<script>
|
|
test_computed_value("scroll-start-target-block", "auto");
|
|
test_computed_value("scroll-start-target-block", "none");
|
|
|
|
test_computed_value("scroll-start-target-inline", "auto");
|
|
test_computed_value("scroll-start-target-inline", "none");
|
|
|
|
test_computed_value("scroll-start-target-x", "auto");
|
|
test_computed_value("scroll-start-target-x", "none");
|
|
|
|
test_computed_value("scroll-start-target-y", "auto");
|
|
test_computed_value("scroll-start-target-y", "none");
|
|
|
|
target.style = "";
|
|
|
|
// Test logical-physical mapping.
|
|
test((t) => {
|
|
t.add_cleanup(() => { target.style = ""; });
|
|
target.style.scrollStartTargetBlock = "auto";
|
|
assert_equals(getComputedStyle(target).scrollStartTargetX, "none");
|
|
assert_equals(getComputedStyle(target).scrollStartTargetY, "auto");
|
|
}, "scroll-start-block maps to scroll-start-y in horizontal writing mode.");
|
|
test((t) => {
|
|
t.add_cleanup(() => { target.style = ""; });
|
|
target.style.scrollStartTargetInline = "auto";
|
|
assert_equals(getComputedStyle(target).scrollStartTargetX, "auto");
|
|
assert_equals(getComputedStyle(target).scrollStartTargetY, "none");
|
|
}, "scroll-start-inline maps to scroll-start-x in horizontal writing mode.");
|
|
test((t) => {
|
|
t.add_cleanup(() => { target.style = ""; });
|
|
target.style.scrollStartTargetX = "auto";
|
|
assert_equals(getComputedStyle(target).scrollStartTargetBlock, "none");
|
|
assert_equals(getComputedStyle(target).scrollStartTargetInline, "auto");
|
|
}, "scroll-start-x maps to scroll-start-inline in horizontal writing mode.");
|
|
test((t) => {
|
|
t.add_cleanup(() => { target.style = ""; });
|
|
target.style.scrollStartTargetY = "auto";
|
|
assert_equals(getComputedStyle(target).scrollStartTargetBlock, "auto");
|
|
assert_equals(getComputedStyle(target).scrollStartTargetInline, "none");
|
|
}, "scroll-start-y maps to scroll-start-block in horizontal writing mode.");
|
|
test((t) => {
|
|
t.add_cleanup(() => { target.style = ""; });
|
|
target.style.scrollStartTargetBlock = "auto";
|
|
target.style.writingMode = "vertical-lr";
|
|
assert_equals(getComputedStyle(target).scrollStartTargetX, "auto");
|
|
assert_equals(getComputedStyle(target).scrollStartTargetY, "none");
|
|
}, "scroll-start-block maps to scroll-start-x in vertical writing mode.");
|
|
test((t) => {
|
|
t.add_cleanup(() => { target.style = ""; });
|
|
target.style.scrollStartTargetInline = "auto";
|
|
target.style.writingMode = "vertical-lr";
|
|
assert_equals(getComputedStyle(target).scrollStartTargetX, "none");
|
|
assert_equals(getComputedStyle(target).scrollStartTargetY, "auto");
|
|
}, "scroll-start-inline maps to scroll-start-y in vertical writing mode.");
|
|
test((t) => {
|
|
t.add_cleanup(() => { target.style = ""; });
|
|
target.style.scrollStartTargetX = "auto";
|
|
target.style.writingMode = "vertical-lr";
|
|
assert_equals(getComputedStyle(target).scrollStartTargetBlock, "auto");
|
|
assert_equals(getComputedStyle(target).scrollStartTargetInline, "none");
|
|
}, "scroll-start-x maps to scroll-start-block in vertical writing mode.");
|
|
test((t) => {
|
|
t.add_cleanup(() => { target.style = ""; });
|
|
target.style.scrollStartTargetY = "auto";
|
|
target.style.writingMode = "vertical-lr";
|
|
assert_equals(getComputedStyle(target).scrollStartTargetBlock, "none");
|
|
assert_equals(getComputedStyle(target).scrollStartTargetInline, "auto");
|
|
}, "scroll-start-y maps to scroll-start-inline in vertical writing mode.");
|
|
</script>
|
|
</body>
|
|
|
|
</html> |