Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit b5e8e1e

Browse files
DavMilamoz-wptsync-bot
authored andcommitted
Bug 1943054 [wpt PR 50216] - Implement parsing for animation-trigger-range-*, a=testonly
Automatic update from web-platform-tests Implement parsing for animation-trigger-range-* The spec is currently a work-in-progress[1] but this comment[2] describes the API. [1] w3c/csswg-drafts#10128 [2] w3c/csswg-drafts#8942 (comment) Bug: 390314945 Change-Id: I6ac50730653e70219775895c315f91f771ea7c13 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6182723 Commit-Queue: David Awogbemila <[email protected]> Reviewed-by: Anders Hartvoll Ruud <[email protected]> Cr-Commit-Position: refs/heads/main@{#1409620} -- wpt-commits: 78c349f14e31d5bbba8a109e1529ee7cb94dd0bf wpt-pr: 50216
1 parent 2d26946 commit b5e8e1e

12 files changed

Lines changed: 356 additions & 0 deletions
Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
<!DOCTYPE html>
2+
<!-- TODO(crbug.com/390314945): Replace with spec link when the spec lands. -->
3+
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/8942 ">
4+
<script src="/resources/testharness.js"></script>
5+
<script src="/resources/testharnessreport.js"></script>
6+
<script src="/css/support/computed-testcommon.js"></script>
7+
<div id="target" style="font-size:10px;"></div>
8+
<script>
9+
test_computed_value("animation-trigger-exit-range-end", "initial", "normal");
10+
test_computed_value("animation-trigger-exit-range-end", "normal");
11+
test_computed_value("animation-trigger-exit-range-end", "cover 0%");
12+
test_computed_value("animation-trigger-exit-range-end", "cover 100%", "cover");
13+
test_computed_value("animation-trigger-exit-range-end", "COVER 0%", "cover 0%");
14+
test_computed_value("animation-trigger-exit-range-end", "COVER 100%", "cover");
15+
test_computed_value("animation-trigger-exit-range-end", "cover 120%");
16+
test_computed_value("animation-trigger-exit-range-end", "0", "0px");
17+
test_computed_value("animation-trigger-exit-range-end", "120%");
18+
test_computed_value("animation-trigger-exit-range-end", "120px");
19+
test_computed_value("animation-trigger-exit-range-end", "cover 42%");
20+
test_computed_value("animation-trigger-exit-range-end", "cover -42%");
21+
test_computed_value("animation-trigger-exit-range-end", "contain 42%");
22+
test_computed_value("animation-trigger-exit-range-end", "exit 42%");
23+
test_computed_value("animation-trigger-exit-range-end", "exit calc(41% + 1%)", "exit 42%");
24+
test_computed_value("animation-trigger-exit-range-end", "exit-crossing 42%");
25+
test_computed_value("animation-trigger-exit-range-end", "exit 1%, cover 2%, contain 0%");
26+
test_computed_value("animation-trigger-exit-range-end", "exit 1%, cover 2%, contain 100%", "exit 1%, cover 2%, contain");
27+
test_computed_value("animation-trigger-exit-range-end", "entry 42px");
28+
test_computed_value("animation-trigger-exit-range-end", "entry-crossing 42px");
29+
30+
test_computed_value("animation-trigger-exit-range-end", "contain calc(10% + 10px)");
31+
test_computed_value("animation-trigger-exit-range-end", "entry 1em", "entry 10px");
32+
test_computed_value("animation-trigger-exit-range-end", "exit calc(1em + 10px)", "exit 20px");
33+
test_computed_value("animation-trigger-exit-range-end", "cover");
34+
test_computed_value("animation-trigger-exit-range-end", "contain");
35+
test_computed_value("animation-trigger-exit-range-end", "entry");
36+
test_computed_value("animation-trigger-exit-range-end", "exit");
37+
</script>
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<!DOCTYPE html>
2+
<!-- TODO(crbug.com/390314945): Replace with spec link when the spec lands. -->
3+
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/8942">
4+
<script src="/resources/testharness.js"></script>
5+
<script src="/resources/testharnessreport.js"></script>
6+
<script src="/css/support/parsing-testcommon.js"></script>
7+
<script>
8+
test_invalid_value("animation-trigger-exit-range-end", "infinite");
9+
test_invalid_value("animation-trigger-exit-range-end", "1s 2s");
10+
test_invalid_value("animation-trigger-exit-range-end", "1s / 2s");
11+
12+
test_invalid_value("animation-trigger-exit-range-end", "peek 50%");
13+
test_invalid_value("animation-trigger-exit-range-end", "50% contain");
14+
test_invalid_value("animation-trigger-exit-range-end", "50% cover");
15+
test_invalid_value("animation-trigger-exit-range-end", "50% entry");
16+
test_invalid_value("animation-trigger-exit-range-end", "50% enter");
17+
test_invalid_value("animation-trigger-exit-range-end", "50% exit");
18+
test_invalid_value("animation-trigger-exit-range-end", "contain contain");
19+
test_invalid_value("animation-trigger-exit-range-end", "none");
20+
test_invalid_value("animation-trigger-exit-range-end", "cover 50% enter 50%");
21+
</script>
Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
<!DOCTYPE html>
2+
<!-- TODO(crbug.com/390314945): Replace with spec link when the spec lands. -->
3+
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/8942">
4+
<script src="/resources/testharness.js"></script>
5+
<script src="/resources/testharnessreport.js"></script>
6+
<script src="/css/support/parsing-testcommon.js"></script>
7+
<script>
8+
// https://drafts.csswg.org/scroll-animations-1/#view-timelines-ranges
9+
test_valid_value("animation-trigger-exit-range-end", "normal");
10+
test_valid_value("animation-trigger-exit-range-end", "cover 0%");
11+
test_valid_value("animation-trigger-exit-range-end", "cover 100%", "cover");
12+
test_valid_value("animation-trigger-exit-range-end", "cover 120%");
13+
test_valid_value("animation-trigger-exit-range-end", "cover 42%");
14+
test_valid_value("animation-trigger-exit-range-end", "0", "0px");
15+
test_valid_value("animation-trigger-exit-range-end", "120%");
16+
test_valid_value("animation-trigger-exit-range-end", "120px");
17+
test_valid_value("animation-trigger-exit-range-end", "cover -42%");
18+
test_valid_value("animation-trigger-exit-range-end", "contain 42%");
19+
test_valid_value("animation-trigger-exit-range-end", "exit 42%");
20+
test_valid_value("animation-trigger-exit-range-end", "exit 1%, cover 2%, contain 0%");
21+
test_valid_value("animation-trigger-exit-range-end", "exit 1%, cover 2%, contain 100%", "exit 1%, cover 2%, contain");
22+
test_valid_value("animation-trigger-exit-range-end", "exit-crossing 42%");
23+
test_valid_value("animation-trigger-exit-range-end", "entry 42px");
24+
test_valid_value("animation-trigger-exit-range-end", "entry-crossing 42px");
25+
test_valid_value("animation-trigger-exit-range-end", "contain calc(10px + 10%)", "contain calc(10% + 10px)");
26+
test_valid_value("animation-trigger-exit-range-end", "entry 1em");
27+
test_valid_value("animation-trigger-exit-range-end", "exit calc(1em + 10px)");
28+
test_valid_value("animation-trigger-exit-range-end", "entry 42%");
29+
test_valid_value("animation-trigger-exit-range-end", "cover");
30+
test_valid_value("animation-trigger-exit-range-end", "contain");
31+
test_valid_value("animation-trigger-exit-range-end", "entry");
32+
test_valid_value("animation-trigger-exit-range-end", "exit");
33+
</script>trigger-
Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
<!DOCTYPE html>
2+
<!-- TODO(crbug.com/390314945): Replace with spec link when the spec lands. -->
3+
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/8942 ">
4+
<script src="/resources/testharness.js"></script>
5+
<script src="/resources/testharnessreport.js"></script>
6+
<script src="/css/support/computed-testcommon.js"></script>
7+
<div id="target" style="font-size:10px;"></div>
8+
<script>
9+
test_computed_value("animation-trigger-exit-range-start", "initial", "normal");
10+
test_computed_value("animation-trigger-exit-range-start", "normal");
11+
test_computed_value("animation-trigger-exit-range-start", "cover 0%", "cover");
12+
test_computed_value("animation-trigger-exit-range-start", "cover 100%");
13+
test_computed_value("animation-trigger-exit-range-start", "COVER 0%", "cover");
14+
test_computed_value("animation-trigger-exit-range-start", "COVER 100%", "cover 100%");
15+
test_computed_value("animation-trigger-exit-range-start", "cover 120%");
16+
test_computed_value("animation-trigger-exit-range-start", "cover 42%");
17+
test_computed_value("animation-trigger-exit-range-start", "0", "0px");
18+
test_computed_value("animation-trigger-exit-range-start", "120%");
19+
test_computed_value("animation-trigger-exit-range-start", "120px");
20+
test_computed_value("animation-trigger-exit-range-start", "cover -42%");
21+
test_computed_value("animation-trigger-exit-range-start", "contain 42%");
22+
test_computed_value("animation-trigger-exit-range-start", "exit 42%");
23+
test_computed_value("animation-trigger-exit-range-start", "exit calc(41% + 1%)", "exit 42%");
24+
test_computed_value("animation-trigger-exit-range-start", "exit 1%, cover 2%, contain 0%", "exit 1%, cover 2%, contain");
25+
test_computed_value("animation-trigger-exit-range-start", "exit 1%, cover 2%, contain 100%");
26+
test_computed_value("animation-trigger-exit-range-start", "exit-crossing 42%");
27+
test_computed_value("animation-trigger-exit-range-start", "entry 42px");
28+
test_computed_value("animation-trigger-exit-range-start", "entry-crossing 42px");
29+
test_computed_value("animation-trigger-exit-range-start", "contain calc(10% + 10px)");
30+
test_computed_value("animation-trigger-exit-range-start", "entry 1em", "entry 10px");
31+
test_computed_value("animation-trigger-exit-range-start", "exit calc(1em + 10px)", "exit 20px");
32+
test_computed_value("animation-trigger-exit-range-start", "cover");
33+
test_computed_value("animation-trigger-exit-range-start", "contain");
34+
test_computed_value("animation-trigger-exit-range-start", "entry");
35+
test_computed_value("animation-trigger-exit-range-start", "exit");
36+
</script>
Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
<!DOCTYPE html>
2+
<!-- TODO(crbug.com/390314945): Replace with spec link when the spec lands. -->
3+
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/8942 ">
4+
<script src="/resources/testharness.js"></script>
5+
<script src="/resources/testharnessreport.js"></script>
6+
<script src="/css/support/parsing-testcommon.js"></script>
7+
<script>
8+
test_invalid_value("animation-trigger-exit-range-start", "peek 50%");
9+
test_invalid_value("animation-trigger-exit-range-start", "50% contain");
10+
test_invalid_value("animation-trigger-exit-range-start", "50% cover");
11+
test_invalid_value("animation-trigger-exit-range-start", "50% entry");
12+
test_invalid_value("animation-trigger-exit-range-start", "50% enter");
13+
test_invalid_value("animation-trigger-exit-range-start", "50% exit");
14+
test_invalid_value("animation-trigger-exit-range-start", "contain contain");
15+
test_invalid_value("animation-trigger-exit-range-start", "none");
16+
test_invalid_value("animation-trigger-exit-range-start", "cover 50% enter 50%");
17+
</script>
Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
<!DOCTYPE html>
2+
<!-- TODO(crbug.com/390314945): Replace with spec link when the spec lands. -->
3+
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/8942">
4+
<script src="/resources/testharness.js"></script>
5+
<script src="/resources/testharnessreport.js"></script>
6+
<script src="/css/support/parsing-testcommon.js"></script>
7+
<script>
8+
// https://drafts.csswg.org/scroll-animations-1/#view-timelines-ranges
9+
test_valid_value("animation-trigger-exit-range-start", "normal");
10+
test_valid_value("animation-trigger-exit-range-start", "cover 0%", "cover");
11+
test_valid_value("animation-trigger-exit-range-start", "cover 100%");
12+
test_valid_value("animation-trigger-exit-range-start", "cover 120%");
13+
test_valid_value("animation-trigger-exit-range-start", "cover 42%");
14+
test_valid_value("animation-trigger-exit-range-start", "0", "0px");
15+
test_valid_value("animation-trigger-exit-range-start", "120%");
16+
test_valid_value("animation-trigger-exit-range-start", "120px");
17+
test_valid_value("animation-trigger-exit-range-start", "cover -42%");
18+
test_valid_value("animation-trigger-exit-range-start", "contain 42%");
19+
test_valid_value("animation-trigger-exit-range-start", "exit 42%");
20+
test_valid_value("animation-trigger-exit-range-start", "exit 1%, cover 2%, contain 0%", "exit 1%, cover 2%, contain");
21+
test_valid_value("animation-trigger-exit-range-start", "exit 1%, cover 2%, contain 100%");
22+
test_valid_value("animation-trigger-exit-range-start", "exit-crossing 42%");
23+
test_valid_value("animation-trigger-exit-range-start", "entry 42px");
24+
test_valid_value("animation-trigger-exit-range-start", "entry-crossing 42px");
25+
test_valid_value("animation-trigger-exit-range-start", "contain calc(10px + 10%)", "contain calc(10% + 10px)");
26+
test_valid_value("animation-trigger-exit-range-start", "entry 1em");
27+
test_valid_value("animation-trigger-exit-range-start", "exit calc(1em + 10px)");
28+
test_valid_value("animation-trigger-exit-range-start", "entry 42%");
29+
test_valid_value("animation-trigger-exit-range-start", "cover");
30+
test_valid_value("animation-trigger-exit-range-start", "contain");
31+
test_valid_value("animation-trigger-exit-range-start", "entry");
32+
test_valid_value("animation-trigger-exit-range-start", "exit");
33+
test_valid_value("animation-trigger-exit-range-start", "cover calc(sign(100em - 1px) * 1%)");
34+
</script>
Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
<!DOCTYPE html>
2+
<!-- TODO(crbug.com/390314945): Replace with spec link when the spec lands. -->
3+
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/8942 ">
4+
<script src="/resources/testharness.js"></script>
5+
<script src="/resources/testharnessreport.js"></script>
6+
<script src="/css/support/computed-testcommon.js"></script>
7+
<div id="target" style="font-size:10px;"></div>
8+
<script>
9+
test_computed_value("animation-trigger-range-end", "initial", "normal");
10+
test_computed_value("animation-trigger-range-end", "normal");
11+
test_computed_value("animation-trigger-range-end", "cover 0%");
12+
test_computed_value("animation-trigger-range-end", "cover 100%", "cover");
13+
test_computed_value("animation-trigger-range-end", "COVER 0%", "cover 0%");
14+
test_computed_value("animation-trigger-range-end", "COVER 100%", "cover");
15+
test_computed_value("animation-trigger-range-end", "cover 120%");
16+
test_computed_value("animation-trigger-range-end", "0", "0px");
17+
test_computed_value("animation-trigger-range-end", "120%");
18+
test_computed_value("animation-trigger-range-end", "120px");
19+
test_computed_value("animation-trigger-range-end", "cover 42%");
20+
test_computed_value("animation-trigger-range-end", "cover -42%");
21+
test_computed_value("animation-trigger-range-end", "contain 42%");
22+
test_computed_value("animation-trigger-range-end", "exit 42%");
23+
test_computed_value("animation-trigger-range-end", "exit calc(41% + 1%)", "exit 42%");
24+
test_computed_value("animation-trigger-range-end", "exit-crossing 42%");
25+
test_computed_value("animation-trigger-range-end", "exit 1%, cover 2%, contain 0%");
26+
test_computed_value("animation-trigger-range-end", "exit 1%, cover 2%, contain 100%", "exit 1%, cover 2%, contain");
27+
test_computed_value("animation-trigger-range-end", "entry 42px");
28+
test_computed_value("animation-trigger-range-end", "entry-crossing 42px");
29+
30+
test_computed_value("animation-trigger-range-end", "contain calc(10% + 10px)");
31+
test_computed_value("animation-trigger-range-end", "entry 1em", "entry 10px");
32+
test_computed_value("animation-trigger-range-end", "exit calc(1em + 10px)", "exit 20px");
33+
test_computed_value("animation-trigger-range-end", "cover");
34+
test_computed_value("animation-trigger-range-end", "contain");
35+
test_computed_value("animation-trigger-range-end", "entry");
36+
test_computed_value("animation-trigger-range-end", "exit");
37+
</script>
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<!DOCTYPE html>
2+
<!-- TODO(crbug.com/390314945): Replace with spec link when the spec lands. -->
3+
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/8942">
4+
<script src="/resources/testharness.js"></script>
5+
<script src="/resources/testharnessreport.js"></script>
6+
<script src="/css/support/parsing-testcommon.js"></script>
7+
<script>
8+
test_invalid_value("animation-trigger-range-end", "infinite");
9+
test_invalid_value("animation-trigger-range-end", "1s 2s");
10+
test_invalid_value("animation-trigger-range-end", "1s / 2s");
11+
12+
test_invalid_value("animation-trigger-range-end", "peek 50%");
13+
test_invalid_value("animation-trigger-range-end", "50% contain");
14+
test_invalid_value("animation-trigger-range-end", "50% cover");
15+
test_invalid_value("animation-trigger-range-end", "50% entry");
16+
test_invalid_value("animation-trigger-range-end", "50% enter");
17+
test_invalid_value("animation-trigger-range-end", "50% exit");
18+
test_invalid_value("animation-trigger-range-end", "contain contain");
19+
test_invalid_value("animation-trigger-range-end", "none");
20+
test_invalid_value("animation-trigger-range-end", "cover 50% enter 50%");
21+
</script>
Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
<!DOCTYPE html>
2+
<!-- TODO(crbug.com/390314945): Replace with spec link when the spec lands. -->
3+
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/8942">
4+
<script src="/resources/testharness.js"></script>
5+
<script src="/resources/testharnessreport.js"></script>
6+
<script src="/css/support/parsing-testcommon.js"></script>
7+
<script>
8+
// https://drafts.csswg.org/scroll-animations-1/#view-timelines-ranges
9+
test_valid_value("animation-trigger-range-end", "normal");
10+
test_valid_value("animation-trigger-range-end", "cover 0%");
11+
test_valid_value("animation-trigger-range-end", "cover 100%", "cover");
12+
test_valid_value("animation-trigger-range-end", "cover 120%");
13+
test_valid_value("animation-trigger-range-end", "cover 42%");
14+
test_valid_value("animation-trigger-range-end", "0", "0px");
15+
test_valid_value("animation-trigger-range-end", "120%");
16+
test_valid_value("animation-trigger-range-end", "120px");
17+
test_valid_value("animation-trigger-range-end", "cover -42%");
18+
test_valid_value("animation-trigger-range-end", "contain 42%");
19+
test_valid_value("animation-trigger-range-end", "exit 42%");
20+
test_valid_value("animation-trigger-range-end", "exit 1%, cover 2%, contain 0%");
21+
test_valid_value("animation-trigger-range-end", "exit 1%, cover 2%, contain 100%", "exit 1%, cover 2%, contain");
22+
test_valid_value("animation-trigger-range-end", "exit-crossing 42%");
23+
test_valid_value("animation-trigger-range-end", "entry 42px");
24+
test_valid_value("animation-trigger-range-end", "entry-crossing 42px");
25+
test_valid_value("animation-trigger-range-end", "contain calc(10px + 10%)", "contain calc(10% + 10px)");
26+
test_valid_value("animation-trigger-range-end", "entry 1em");
27+
test_valid_value("animation-trigger-range-end", "exit calc(1em + 10px)");
28+
test_valid_value("animation-trigger-range-end", "entry 42%");
29+
test_valid_value("animation-trigger-range-end", "cover");
30+
test_valid_value("animation-trigger-range-end", "contain");
31+
test_valid_value("animation-trigger-range-end", "entry");
32+
test_valid_value("animation-trigger-range-end", "exit");
33+
</script>trigger-
Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
<!DOCTYPE html>
2+
<!-- TODO(crbug.com/390314945): Replace with spec link when the spec lands. -->
3+
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/8942 ">
4+
<script src="/resources/testharness.js"></script>
5+
<script src="/resources/testharnessreport.js"></script>
6+
<script src="/css/support/computed-testcommon.js"></script>
7+
<div id="target" style="font-size:10px;"></div>
8+
<script>
9+
test_computed_value("animation-trigger-range-start", "initial", "normal");
10+
test_computed_value("animation-trigger-range-start", "normal");
11+
test_computed_value("animation-trigger-range-start", "cover 0%", "cover");
12+
test_computed_value("animation-trigger-range-start", "cover 100%");
13+
test_computed_value("animation-trigger-range-start", "COVER 0%", "cover");
14+
test_computed_value("animation-trigger-range-start", "COVER 100%", "cover 100%");
15+
test_computed_value("animation-trigger-range-start", "cover 120%");
16+
test_computed_value("animation-trigger-range-start", "cover 42%");
17+
test_computed_value("animation-trigger-range-start", "0", "0px");
18+
test_computed_value("animation-trigger-range-start", "120%");
19+
test_computed_value("animation-trigger-range-start", "120px");
20+
test_computed_value("animation-trigger-range-start", "cover -42%");
21+
test_computed_value("animation-trigger-range-start", "contain 42%");
22+
test_computed_value("animation-trigger-range-start", "exit 42%");
23+
test_computed_value("animation-trigger-range-start", "exit calc(41% + 1%)", "exit 42%");
24+
test_computed_value("animation-trigger-range-start", "exit 1%, cover 2%, contain 0%", "exit 1%, cover 2%, contain");
25+
test_computed_value("animation-trigger-range-start", "exit 1%, cover 2%, contain 100%");
26+
test_computed_value("animation-trigger-range-start", "exit-crossing 42%");
27+
test_computed_value("animation-trigger-range-start", "entry 42px");
28+
test_computed_value("animation-trigger-range-start", "entry-crossing 42px");
29+
test_computed_value("animation-trigger-range-start", "contain calc(10% + 10px)");
30+
test_computed_value("animation-trigger-range-start", "entry 1em", "entry 10px");
31+
test_computed_value("animation-trigger-range-start", "exit calc(1em + 10px)", "exit 20px");
32+
test_computed_value("animation-trigger-range-start", "cover");
33+
test_computed_value("animation-trigger-range-start", "contain");
34+
test_computed_value("animation-trigger-range-start", "entry");
35+
test_computed_value("animation-trigger-range-start", "exit");
36+
</script>

0 commit comments

Comments
 (0)