Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-06 14:10:11 +01:00
Code Issues Projects Releases Packages Wiki Activity

Update web-platform-tests to revision b'704eebbe6af5b43643971e96e33a0c979fba2904'

Browse source
This commit is contained in:
WPT Sync Bot 2023-01-25 01:33:16 +00:00
parent f8e014d0ba
commit a6bc3e1a73
194 changed files with 13122 additions and 1992 deletions
Download patch file Download diff file Expand all files Collapse all files

38
tests/wpt/web-platform-tests/css/css-animations/KeyframeEffect-getKeyframes.tentative.html
View file

@ -394,10 +394,12 @@ test(t => {
const frames = getKeyframes(div);
// Final keyframe should be replace as per sections 7 and 8 of
// https://drafts.csswg.org/css-animations-2/#keyframes
const expected = [
{ offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
color: "rgb(0, 0, 255)" },
{ offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
{ offset: 1, computedOffset: 1, easing: "ease", composite: "replace",
color: "rgb(255, 255, 255)" },
];
assert_frame_lists_equal(frames, expected);
@ -411,8 +413,10 @@ test(t => {
const frames = getKeyframes(div);
// Initial keyframe should be replace as per sections 7 and 8 of
// https://drafts.csswg.org/css-animations-2/#keyframes
const expected = [
{ offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
{ offset: 0, computedOffset: 0, easing: "ease", composite: "replace",
color: "rgb(255, 255, 255)" },
{ offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
color: "rgb(0, 0, 255)" },
@ -428,12 +432,14 @@ test(t => {
const frames = getKeyframes(div);
// Initial and final keyframes should be replace as per sections 7 and 8 of
// https://drafts.csswg.org/css-animations-2/#keyframes
const expected = [
{ offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
{ offset: 0, computedOffset: 0, easing: "ease", composite: "replace",
color: "rgb(255, 255, 255)" },
{ offset: 0.5, computedOffset: 0.5, easing: "ease", composite: "auto",
color: "rgb(0, 0, 255)" },
{ offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
{ offset: 1, computedOffset: 1, easing: "ease", composite: "replace",
color: "rgb(255, 255, 255)" },
];
assert_frame_lists_equal(frames, expected);
@ -631,8 +637,10 @@ test(t => {
const frames = getKeyframes(div);
// Initial keyframe should be replace as per sections 7 and 8 of
// https://drafts.csswg.org/css-animations-2/#keyframes
const expected = [
{ offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
{ offset: 0, computedOffset: 0, easing: "ease", composite: "replace",
filter: "none" },
{ offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
filter: "blur(5px) sepia(60%) saturate(30%)" },
@ -670,8 +678,10 @@ test(t => {
const frames = getKeyframes(div);
// Initial keyframe should be replace as per sections 7 and 8 of
// https://drafts.csswg.org/css-animations-2/#keyframes
const expected = [
{ offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
{ offset: 0, computedOffset: 0, easing: "ease", composite: "replace",
textShadow: "rgb(0, 0, 0) 1px 1px 2px,"
+ " rgb(0, 0, 255) 0px 0px 16px,"
+ " rgb(0, 0, 255) 0px 0px 3.2px" },
@ -694,8 +704,10 @@ test(t => {
assert_equals(frames.length, 2, "number of frames");
// Initial keyframe should be replace as per sections 7 and 8 of
// https://drafts.csswg.org/css-animations-2/#keyframes
const expected = [
{ offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
{ offset: 0, computedOffset: 0, easing: "ease", composite: "replace",
backgroundSize: "auto" },
{ offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
backgroundSize: "50% auto, 6px auto, contain" },
@ -724,8 +736,10 @@ test(t => {
const frames = getKeyframes(div);
// Initial keyframe should be replace as per sections 7 and 8 of
// https://drafts.csswg.org/css-animations-2/#keyframes
const expected = [
{ offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
{ offset: 0, computedOffset: 0, easing: "ease", composite: "replace",
transform: "none" },
{ offset: 1, computedOffset: 1, easing: "ease", composite: "auto",
transform: "translate(100px)" },
@ -740,8 +754,10 @@ test(t => {
const frames = getKeyframes(div);
// Initial keyframe should be replace as per sections 7 and 8 of
// https://drafts.csswg.org/css-animations-2/#keyframes
const expected = [
{ offset: 0, computedOffset: 0, easing: "ease", composite: "auto",
{ offset: 0, computedOffset: 0, easing: "ease", composite: "replace",
marginBottom: "0px",
marginLeft: "0px",
marginRight: "0px",
@ -762,8 +778,10 @@ test(t => {
const frames = getKeyframes(div);
// Initial keyframe should be replace as per sections 7 and 8 of
// https://drafts.csswg.org/css-animations-2/#keyframes
const expected = [
{ offset: 0, computedOffset: 0, easing: "steps(2, start)", composite: "auto",
{ offset: 0, computedOffset: 0, easing: "steps(2, start)", composite: "replace",
color: "rgb(0, 0, 0)" },
{ offset: 1, computedOffset: 1, easing: "steps(2, start)", composite: "auto",
color: "rgb(0, 255, 0)" },

113
tests/wpt/web-platform-tests/css/css-animations/animation-composition-keyframes.html Normal file
View file

@ -0,0 +1,113 @@
<!doctype html>
<meta charset=utf-8>
<title>animation-composition test in keyframes</title>
<link rel="help" href="https://w3c.github.io/csswg-drafts/css-animations-2/#animation-composition">
<script src=/resources/testharness.js></script>
<script src=/resources/testharnessreport.js></script>
<script src="support/testcommon.js"></script>
<style>
@keyframes anim {
from {
animation-composition: add;
filter: blur(10px);
width: 100px;
}
50% {
animation-composition: accumulate;
filter: blur(15px);
width: 228px;
}
to {
animation-composition: replace;
filter: blur(50px);
width: 1337px;
}
}
.anim-target {
animation: anim 1s;
animation-fill-mode: forwards;
animation-timing-function: linear;
filter: blur(5px);
width: 50px;
}
.replace {
animation-composition: replace;
}
.add {
animation-composition: add;
}
.accumulate {
animation-composition: accumulate;
}
</style>
<div id="log"></div>
<script>
function run_test_case(element, property, composite_type, timing_value_map) {
element.classList.add(composite_type);
const anim = element.getAnimations()[0];
for (const [time, value] of Object.entries(timing_value_map)) {
anim.currentTime = time;
const property_value = getComputedStyle(element).getPropertyValue(property);
assert_equals(property_value, value, "at time " + time);
}
element.classList.remove(composite_type);
}
const test_cases = [
["filter", {
"replace": {
0: "blur(5px) blur(10px)",
250: "blur(12.5px) blur(5px)",
500: "blur(20px)",
1000: "blur(50px)"
},
"add": {
0: "blur(5px) blur(10px)",
250: "blur(12.5px) blur(5px)",
500: "blur(20px)",
1000: "blur(50px)"
},
"accumulate": {
0: "blur(5px) blur(10px)",
250: "blur(12.5px) blur(5px)",
500: "blur(20px)",
1000: "blur(50px)"
}
}],
["width", {
"replace": {
0: "150px",
250: "214px",
500: "278px",
1000: "1337px"
},
"add": {
0: "150px",
250: "214px",
500: "278px",
1000: "1337px"
},
"accumulate": {
0: "150px",
250: "214px",
500: "278px",
1000: "1337px"
}
}]
]
for (const test_case of test_cases) {
const property = test_case[0];
const test_data = test_case[1];
for (const [composite_type, expected_values] of Object.entries(test_data)) {
test(t => {
let elem = addDiv(t, {"class": "anim-target"});
run_test_case(elem, property, composite_type, expected_values);
}, "animation-composition: " + composite_type + " of property " + property);
}
}
</script>

110
tests/wpt/web-platform-tests/css/css-animations/animation-composition.html Normal file
View file

@ -0,0 +1,110 @@
<!doctype html>
<meta charset=utf-8>
<title>animation-composition test</title>
<link rel="help" href="https://w3c.github.io/csswg-drafts/css-animations-2/#animation-composition">
<script src=/resources/testharness.js></script>
<script src=/resources/testharnessreport.js></script>
<script src="support/testcommon.js"></script>
<style>
@keyframes anim {
from {
filter: blur(10px);
width: 100px;
}
50% {
filter: blur(15px);
width: 228px;
}
to {
filter: blur(20px);
width: 1337px;
}
}
.anim-target {
animation: anim 1s;
animation-fill-mode: forwards;
animation-timing-function: linear;
filter: blur(5px);
width: 50px;
}
.replace {
animation-composition: replace;
}
.add {
animation-composition: add;
}
.accumulate {
animation-composition: accumulate;
}
</style>
<div id="log"></div>
<script>
function run_test_case(element, property, composite_type, timing_value_map) {
element.classList.add(composite_type);
const anim = element.getAnimations()[0];
for (const [time, value] of Object.entries(timing_value_map)) {
anim.currentTime = time;
const property_value = getComputedStyle(element).getPropertyValue(property);
assert_equals(property_value, value, "at time " + time);
}
element.classList.remove(composite_type);
}
const test_cases = [
["filter", {
"replace": {
0: "blur(10px)",
250: "blur(12.5px)",
500: "blur(15px)",
1000: "blur(20px)"
},
"add": {
0: "blur(5px) blur(10px)",
250: "blur(5px) blur(12.5px)",
500: "blur(5px) blur(15px)",
1000: "blur(5px) blur(20px)"
},
"accumulate": {
0: "blur(15px)",
250: "blur(17.5px)",
500: "blur(20px)",
1000: "blur(25px)"
}
}],
["width", {
"replace": {
0: "100px",
250: "164px",
500: "228px",
1000: "1337px"
},
"add": {
0: "150px",
250: "214px",
500: "278px",
1000: "1387px"
},
"accumulate": {
0: "150px",
250: "214px",
500: "278px",
1000: "1387px"
}
}]
]
for (const test_case of test_cases) {
const property = test_case[0];
const test_data = test_case[1];
for (const [composite_type, expected_values] of Object.entries(test_data)) {
test(t => {
let elem = addDiv(t, {"class": "anim-target"});
run_test_case(elem, property, composite_type, expected_values);
}, "animation-composition: " + composite_type + " of property " + property);
}
}
</script>

6
tests/wpt/web-platform-tests/css/css-animations/parsing/animation-range-end-computed.html
View file

@ -3,7 +3,7 @@
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/computed-testcommon.js"></script>
<div id="target"></div>
<div id="target" style="font-size:10px;"></div>
<script>
test_computed_value("animation-range-end", "initial", "auto");
test_computed_value("animation-range-end", "auto");
@ -17,4 +17,8 @@ test_computed_value("animation-range-end", "contain 42%");
test_computed_value("animation-range-end", "exit 42%");
test_computed_value("animation-range-end", "exit calc(41% + 1%)", "exit 42%");
test_computed_value("animation-range-end", "exit 1%, cover 2%, contain 100%");
test_computed_value("animation-range-end", "enter 42px");
test_computed_value("animation-range-end", "contain calc(10% + 10px)");
test_computed_value("animation-range-end", "enter 1em", "enter 10px");
test_computed_value("animation-range-end", "exit calc(1em + 10px)", "exit 20px");
</script>

1
tests/wpt/web-platform-tests/css/css-animations/parsing/animation-range-end-invalid.html
View file

@ -20,7 +20,6 @@ test_invalid_value("animation-range-end", "50% exit");
test_invalid_value("animation-range-end", "contain contain");
test_invalid_value("animation-range-end", "none");
test_invalid_value("animation-range-end", "cover 50% enter 50%");
test_invalid_value("animation-range-end", "cover 100px");
test_invalid_value("animation-range-end", "cover");
test_invalid_value("animation-range-end", "contain");
test_invalid_value("animation-range-end", "enter");

4
tests/wpt/web-platform-tests/css/css-animations/parsing/animation-range-end-valid.html
View file

@ -14,6 +14,10 @@ test_valid_value("animation-range-end", "cover -42%");
test_valid_value("animation-range-end", "contain 42%");
test_valid_value("animation-range-end", "exit 42%");
test_valid_value("animation-range-end", "exit 1%, cover 2%, contain 100%");
test_valid_value("animation-range-end", "enter 42px");
test_valid_value("animation-range-end", "contain calc(10px + 10%)");
test_valid_value("animation-range-end", "enter 1em");
test_valid_value("animation-range-end", "exit calc(1em + 10px)");
// There's an open issue in the spec about "enter" vs "entry".
//

9
tests/wpt/web-platform-tests/css/css-animations/parsing/animation-range-shorthand.html
View file

@ -16,12 +16,16 @@ test_valid_value("animation-range", "enter 0% enter 100%", "enter");
test_valid_value("animation-range", "exit 0% exit 100%", "exit");
test_valid_value("animation-range", "cover 0% cover 100%", "cover");
test_valid_value("animation-range", "contain 0% contain 100%", "contain");
test_valid_value("animation-range", "enter calc(10% - 10%) enter calc(50% + 50%)", "enter");
test_valid_value("animation-range", "cover 50%");
test_valid_value("animation-range", "contain 50%");
test_valid_value("animation-range", "enter 50%");
test_valid_value("animation-range", "exit 50%");
test_valid_value("animation-range", "enter 50px exit 100px");
test_valid_value("animation-range", "exit calc(10% + 50px)");
test_valid_value("animation-range", "enter 50% exit 50%");
test_valid_value("animation-range", "cover 50% enter 50%, contain 50% exit 50%");
@ -62,6 +66,11 @@ test_shorthand_value('animation-range', 'enter 10% exit 20%', {
'animation-range-end': 'exit 20%',
});
test_shorthand_value('animation-range', 'enter calc(10% + 10px) exit 20px', {
'animation-range-start': 'enter calc(10% + 10px)',
'animation-range-end': 'exit 20px',
});
test_shorthand_value('animation-range', 'enter, exit', {
'animation-range-start': 'enter 0%, exit 0%',
'animation-range-end': 'enter 100%, exit 100%',

6
tests/wpt/web-platform-tests/css/css-animations/parsing/animation-range-start-computed.html
View file

@ -3,7 +3,7 @@
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/computed-testcommon.js"></script>
<div id="target"></div>
<div id="target" style="font-size:10px;"></div>
<script>
test_computed_value("animation-range-start", "initial", "auto");
test_computed_value("animation-range-start", "auto");
@ -17,4 +17,8 @@ test_computed_value("animation-range-start", "contain 42%");
test_computed_value("animation-range-start", "exit 42%");
test_computed_value("animation-range-start", "exit calc(41% + 1%)", "exit 42%");
test_computed_value("animation-range-start", "exit 1%, cover 2%, contain 100%");
test_computed_value("animation-range-start", "enter 42px");
test_computed_value("animation-range-start", "contain calc(10% + 10px)");
test_computed_value("animation-range-start", "enter 1em", "enter 10px");
test_computed_value("animation-range-start", "exit calc(1em + 10px)", "exit 20px");
</script>

1
tests/wpt/web-platform-tests/css/css-animations/parsing/animation-range-start-invalid.html
View file

@ -13,7 +13,6 @@ test_invalid_value("animation-range-start", "50% exit");
test_invalid_value("animation-range-start", "contain contain");
test_invalid_value("animation-range-start", "none");
test_invalid_value("animation-range-start", "cover 50% enter 50%");
test_invalid_value("animation-range-start", "cover 100px");
test_invalid_value("animation-range-start", "cover");
test_invalid_value("animation-range-start", "contain");
test_invalid_value("animation-range-start", "enter");

4
tests/wpt/web-platform-tests/css/css-animations/parsing/animation-range-start-valid.html
View file

@ -14,6 +14,10 @@ test_valid_value("animation-range-start", "cover -42%");
test_valid_value("animation-range-start", "contain 42%");
test_valid_value("animation-range-start", "exit 42%");
test_valid_value("animation-range-start", "exit 1%, cover 2%, contain 100%");
test_valid_value("animation-range-start", "enter 42px");
test_valid_value("animation-range-start", "contain calc(10px + 10%)");
test_valid_value("animation-range-start", "enter 1em");
test_valid_value("animation-range-start", "exit calc(1em + 10px)");
// There's an open issue in the spec about "enter" vs "entry".
//