32 lines
1.9 KiB
HTML
32 lines
1.9 KiB
HTML
<!DOCTYPE html>
|
|
<link rel="help" href="https://drafts.csswg.org/css-animations-2/#animation-trigger-range">
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
<script src="/css/support/parsing-testcommon.js"></script>
|
|
<script>
|
|
// https://drafts.csswg.org/scroll-animations-1/#view-timelines-ranges
|
|
test_valid_value("animation-trigger-range-end", "normal");
|
|
test_valid_value("animation-trigger-range-end", "cover 0%");
|
|
test_valid_value("animation-trigger-range-end", "cover 100%", "cover");
|
|
test_valid_value("animation-trigger-range-end", "cover 120%");
|
|
test_valid_value("animation-trigger-range-end", "cover 42%");
|
|
test_valid_value("animation-trigger-range-end", "0", "0px");
|
|
test_valid_value("animation-trigger-range-end", "120%");
|
|
test_valid_value("animation-trigger-range-end", "120px");
|
|
test_valid_value("animation-trigger-range-end", "cover -42%");
|
|
test_valid_value("animation-trigger-range-end", "contain 42%");
|
|
test_valid_value("animation-trigger-range-end", "exit 42%");
|
|
test_valid_value("animation-trigger-range-end", "exit 1%, cover 2%, contain 0%");
|
|
test_valid_value("animation-trigger-range-end", "exit 1%, cover 2%, contain 100%", "exit 1%, cover 2%, contain");
|
|
test_valid_value("animation-trigger-range-end", "exit-crossing 42%");
|
|
test_valid_value("animation-trigger-range-end", "entry 42px");
|
|
test_valid_value("animation-trigger-range-end", "entry-crossing 42px");
|
|
test_valid_value("animation-trigger-range-end", "contain calc(10px + 10%)", "contain calc(10% + 10px)");
|
|
test_valid_value("animation-trigger-range-end", "entry 1em");
|
|
test_valid_value("animation-trigger-range-end", "exit calc(1em + 10px)");
|
|
test_valid_value("animation-trigger-range-end", "entry 42%");
|
|
test_valid_value("animation-trigger-range-end", "cover");
|
|
test_valid_value("animation-trigger-range-end", "contain");
|
|
test_valid_value("animation-trigger-range-end", "entry");
|
|
test_valid_value("animation-trigger-range-end", "exit");
|
|
</script>trigger-
|