mirror of
https://github.com/servo/servo.git
synced 2025-08-06 14:10:11 +01:00
Update web-platform-tests to revision b'b728032f59a396243864b0f8584e7211e3632005'
This commit is contained in:
WPT Sync Bot
parent
ace9b32b1c
commit
df68c4e5d1
15632 changed files with 514865 additions and 155000 deletions
|
|
@ -0,0 +1,18 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Animations: getComputedStyle().animationComposition</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-animations-2/#propdef-animation-composition">
|
||||
<meta name="assert" content="animation-composition computed value is as specified.">
|
||||
<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("animation-composition", "replace, add, accumulate");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Animations: parsing animation-composition with invalid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-animations-2/#propdef-animation-composition">
|
||||
<meta name="assert" content="animation-composition supports only the grammar '<single-animation-composition> #'.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
test_invalid_value("animation-composition", "auto");
|
||||
test_invalid_value("animation-composition", "add replace");
|
||||
|
||||
test_invalid_value("animation-composition", "add, initial");
|
||||
test_invalid_value("animation-composition", "initial, add");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Animations: parsing animation-composition with valid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-animations-2/#propdef-animation-composition">
|
||||
<meta name="assert" content="animation-composition supports the full grammar '<single-animation-composition> #'.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
test_valid_value("animation-composition", "replace");
|
||||
test_valid_value("animation-composition", "add");
|
||||
test_valid_value("animation-composition", "accumulate");
|
||||
test_valid_value("animation-composition", "replace, add, accumulate");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -16,6 +16,11 @@
|
|||
// <single-animation-iteration-count> || <single-animation-direction> ||
|
||||
// <single-animation-fill-mode> || <single-animation-play-state> ||
|
||||
// [ none | <keyframes-name> ]
|
||||
|
||||
test(() => {
|
||||
assert_equals(getComputedStyle(document.getElementById('target')).animation, "0s ease 0s 1 normal none running none");
|
||||
}, "Default animation value");
|
||||
|
||||
test_computed_value("animation", "1s", "1s ease 0s 1 normal none running none");
|
||||
test_computed_value("animation", "cubic-bezier(0, -2, 1, 3)", "0s cubic-bezier(0, -2, 1, 3) 0s 1 normal none running none");
|
||||
test_computed_value("animation", "1s -3s", "1s ease -3s 1 normal none running none");
|
||||
|
|
|
|||
|
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel="help" href="https://drafts.csswg.org/scroll-animations-1/#propdef-animation-delay-start">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/computed-testcommon.js"></script>
|
||||
<div id="target"></div>
|
||||
<script>
|
||||
test_computed_value("animation-delay-start", "initial", "0s");
|
||||
test_computed_value("animation-delay-start", "-500ms", "-0.5s");
|
||||
test_computed_value("animation-delay-start", "calc(2 * 3s)", "6s");
|
||||
test_computed_value("animation-delay-start", "20s, 10s");
|
||||
|
||||
test_computed_value("animation-delay-start", "cover 0%");
|
||||
test_computed_value("animation-delay-start", "COVER 0%", "cover 0%");
|
||||
test_computed_value("animation-delay-start", "cover 100%");
|
||||
test_computed_value("animation-delay-start", "cover 120%");
|
||||
test_computed_value("animation-delay-start", "cover 42%");
|
||||
test_computed_value("animation-delay-start", "cover -42%");
|
||||
test_computed_value("animation-delay-start", "contain 42%");
|
||||
test_computed_value("animation-delay-start", "exit 42%");
|
||||
test_computed_value("animation-delay-start", "exit calc(41% + 1%)", "exit 42%");
|
||||
test_computed_value("animation-delay-start", "exit 1%, cover 2%, contain 100%");
|
||||
</script>
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel="help" href="https://drafts.csswg.org/scroll-animations-1/#propdef-animation-delay-start">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
<script>
|
||||
test_invalid_value("animation-delay-start", "infinite");
|
||||
test_invalid_value("animation-delay-start", "0");
|
||||
test_invalid_value("animation-delay-start", "1s 2s");
|
||||
test_invalid_value("animation-delay-start", "1s / 2s");
|
||||
test_invalid_value("animation-delay-start", "100px");
|
||||
test_invalid_value("animation-delay-start", "100%");
|
||||
|
||||
test_invalid_value("animation-delay-start", "peek 50%");
|
||||
test_invalid_value("animation-delay-start", "50% contain");
|
||||
test_invalid_value("animation-delay-start", "50% cover");
|
||||
test_invalid_value("animation-delay-start", "50% entry");
|
||||
test_invalid_value("animation-delay-start", "50% enter");
|
||||
test_invalid_value("animation-delay-start", "50% exit");
|
||||
test_invalid_value("animation-delay-start", "contain contain");
|
||||
test_invalid_value("animation-delay-start", "auto");
|
||||
test_invalid_value("animation-delay-start", "none");
|
||||
test_invalid_value("animation-delay-start", "cover 50% enter 50%");
|
||||
test_invalid_value("animation-delay-start", "cover 100px");
|
||||
test_invalid_value("animation-delay-start", "cover");
|
||||
test_invalid_value("animation-delay-start", "contain");
|
||||
test_invalid_value("animation-delay-start", "enter");
|
||||
test_invalid_value("animation-delay-start", "exit");
|
||||
</script>
|
||||
|
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel="help" href="https://drafts.csswg.org/scroll-animations-1/#propdef-animation-delay-start">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
<script>
|
||||
test_valid_value("animation-delay-start", "-5ms");
|
||||
test_valid_value("animation-delay-start", "0s");
|
||||
test_valid_value("animation-delay-start", "10s");
|
||||
test_valid_value("animation-delay-start", "20s, 10s");
|
||||
|
||||
// https://drafts.csswg.org/scroll-animations-1/#view-timelines-ranges
|
||||
test_valid_value("animation-delay-start", "cover 0%");
|
||||
test_valid_value("animation-delay-start", "cover 100%");
|
||||
test_valid_value("animation-delay-start", "cover 120%");
|
||||
test_valid_value("animation-delay-start", "cover 42%");
|
||||
test_valid_value("animation-delay-start", "cover -42%");
|
||||
test_valid_value("animation-delay-start", "contain 42%");
|
||||
test_valid_value("animation-delay-start", "exit 42%");
|
||||
test_valid_value("animation-delay-start", "exit 1%, cover 2%, contain 100%");
|
||||
|
||||
// There's an open issue in the spec about "enter" vs "entry".
|
||||
//
|
||||
// https://drafts.csswg.org/scroll-animations-1/#valdef-animation-timeline-range-entry
|
||||
test_valid_value("animation-delay-start", "enter 42%");
|
||||
</script>
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel="help" href="https://drafts.csswg.org/scroll-animations-1/#propdef-animation-delay-start">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/computed-testcommon.js"></script>
|
||||
<div id="target"></div>
|
||||
<script>
|
||||
test_computed_value("animation-delay-start", "initial", "0s");
|
||||
test_computed_value("animation-delay-start", "-500ms", "-0.5s");
|
||||
test_computed_value("animation-delay-start", "calc(2 * 3s)", "6s");
|
||||
test_computed_value("animation-delay-start", "20s, 10s");
|
||||
|
||||
test_computed_value("animation-delay-start", "cover 0%");
|
||||
test_computed_value("animation-delay-start", "COVER 0%", "cover 0%");
|
||||
test_computed_value("animation-delay-start", "cover 100%");
|
||||
test_computed_value("animation-delay-start", "cover 120%");
|
||||
test_computed_value("animation-delay-start", "cover 42%");
|
||||
test_computed_value("animation-delay-start", "cover -42%");
|
||||
test_computed_value("animation-delay-start", "contain 42%");
|
||||
test_computed_value("animation-delay-start", "exit 42%");
|
||||
test_computed_value("animation-delay-start", "exit calc(41% + 1%)", "exit 42%");
|
||||
test_computed_value("animation-delay-start", "exit 1%, cover 2%, contain 100%");
|
||||
</script>
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel="help" href="https://drafts.csswg.org/scroll-animations-1/#propdef-animation-delay-start">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
<script>
|
||||
test_invalid_value("animation-delay-start", "infinite");
|
||||
test_invalid_value("animation-delay-start", "0");
|
||||
test_invalid_value("animation-delay-start", "1s 2s");
|
||||
test_invalid_value("animation-delay-start", "1s / 2s");
|
||||
test_invalid_value("animation-delay-start", "100px");
|
||||
test_invalid_value("animation-delay-start", "100%");
|
||||
|
||||
test_invalid_value("animation-delay-start", "peek 50%");
|
||||
test_invalid_value("animation-delay-start", "50% contain");
|
||||
test_invalid_value("animation-delay-start", "50% cover");
|
||||
test_invalid_value("animation-delay-start", "50% entry");
|
||||
test_invalid_value("animation-delay-start", "50% enter");
|
||||
test_invalid_value("animation-delay-start", "50% exit");
|
||||
test_invalid_value("animation-delay-start", "contain contain");
|
||||
test_invalid_value("animation-delay-start", "auto");
|
||||
test_invalid_value("animation-delay-start", "none");
|
||||
test_invalid_value("animation-delay-start", "cover 50% enter 50%");
|
||||
test_invalid_value("animation-delay-start", "cover 100px");
|
||||
test_invalid_value("animation-delay-start", "cover");
|
||||
test_invalid_value("animation-delay-start", "contain");
|
||||
test_invalid_value("animation-delay-start", "enter");
|
||||
test_invalid_value("animation-delay-start", "exit");
|
||||
</script>
|
||||
|
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel="help" href="https://drafts.csswg.org/scroll-animations-1/#propdef-animation-delay-start">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
<script>
|
||||
test_valid_value("animation-delay-start", "-5ms");
|
||||
test_valid_value("animation-delay-start", "0s");
|
||||
test_valid_value("animation-delay-start", "10s");
|
||||
test_valid_value("animation-delay-start", "20s, 10s");
|
||||
|
||||
// https://drafts.csswg.org/scroll-animations-1/#view-timelines-ranges
|
||||
test_valid_value("animation-delay-start", "cover 0%");
|
||||
test_valid_value("animation-delay-start", "cover 100%");
|
||||
test_valid_value("animation-delay-start", "cover 120%");
|
||||
test_valid_value("animation-delay-start", "cover 42%");
|
||||
test_valid_value("animation-delay-start", "cover -42%");
|
||||
test_valid_value("animation-delay-start", "contain 42%");
|
||||
test_valid_value("animation-delay-start", "exit 42%");
|
||||
test_valid_value("animation-delay-start", "exit 1%, cover 2%, contain 100%");
|
||||
|
||||
// There's an open issue in the spec about "enter" vs "entry".
|
||||
//
|
||||
// https://drafts.csswg.org/scroll-animations-1/#valdef-animation-timeline-range-entry
|
||||
test_valid_value("animation-delay-start", "enter 42%");
|
||||
</script>
|
||||
|
|
@ -20,8 +20,9 @@ test_computed_value("animation-name", 'ease-in');
|
|||
test_computed_value("animation-name", 'infinite');
|
||||
test_computed_value("animation-name", 'paused');
|
||||
test_computed_value("animation-name", 'first, second, third');
|
||||
test_computed_value("animation-name", '"something"', ["something", '"something"']);
|
||||
|
||||
// TODO: Test strings, after https://github.com/w3c/csswg-drafts/issues/2435
|
||||
// TODO: Test more strings, after https://github.com/w3c/csswg-drafts/issues/2435
|
||||
// is resolved.
|
||||
// Examples that need testing either here or in animation-name-invalid.html :
|
||||
// '"Initial"', '"initial"', '"None"', '"Default"', '" x "', "1", '" "', '""',
|
||||
|
|
|
|||
|
|
@ -18,6 +18,8 @@ test_invalid_value("animation-name", 'one, initial');
|
|||
test_invalid_value("animation-name", 'one, inherit');
|
||||
test_invalid_value("animation-name", 'one, unset');
|
||||
test_invalid_value("animation-name", 'default, two');
|
||||
test_invalid_value("animation-name", 'revert, three');
|
||||
test_invalid_value("animation-name", 'revert-layer, four');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -20,10 +20,10 @@ test_valid_value("animation-name", 'infinite');
|
|||
test_valid_value("animation-name", 'paused');
|
||||
test_valid_value("animation-name", 'first, second, third');
|
||||
|
||||
test_valid_value("animation-name", '"string"');
|
||||
test_valid_value("animation-name", '"multi word string"');
|
||||
test_valid_value("animation-name", '"string"', ['"string"', "string"]);
|
||||
test_valid_value("animation-name", '"multi word string"', ['"multi word string"', "multi\\ word\\ string"]);
|
||||
test_valid_value("animation-name", '"initial"');
|
||||
test_valid_value("animation-name", '"---\\22---"', '\"---\\\"---\"');
|
||||
test_valid_value("animation-name", '"---\\22---"', ['\"---\\\"---\"', '---\\\"---']);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,36 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Animations: getComputedStyle().animationTimingFunction</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-animations/#propdef-animation-timing-function">
|
||||
<meta name="assert" content="animation-timing-function computed value is a computed <easing-function> list.">
|
||||
<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("animation-timing-function", "linear");
|
||||
|
||||
test_computed_value("animation-timing-function", "ease");
|
||||
test_computed_value("animation-timing-function", "ease-in");
|
||||
test_computed_value("animation-timing-function", "ease-out");
|
||||
test_computed_value("animation-timing-function", "ease-in-out");
|
||||
test_computed_value("animation-timing-function", "cubic-bezier(0.1, 0.2, 0.8, 0.9)");
|
||||
test_computed_value("animation-timing-function", "cubic-bezier(0, -2, 1, 3)");
|
||||
test_computed_value("animation-timing-function", "cubic-bezier(0, 0.7, 1, 1.3)");
|
||||
|
||||
|
||||
test_computed_value("animation-timing-function", "steps(4, start)");
|
||||
test_computed_value("animation-timing-function", "steps(2, end)", "steps(2)");
|
||||
test_computed_value("animation-timing-function", "steps(2, jump-start)");
|
||||
test_computed_value("animation-timing-function", "steps(2, jump-end)", "steps(2)");
|
||||
test_computed_value("animation-timing-function", "steps(2, jump-both)");
|
||||
test_computed_value("animation-timing-function", "steps(2, jump-none)");
|
||||
|
||||
test_computed_value("animation-timing-function", "linear, ease, linear");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,26 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Animations: parsing animation-timing-function with invalid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-animations/#propdef-animation-timing-function">
|
||||
<meta name="assert" content="animation-timing-function supports only the grammar '<timing-function> #'.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
test_invalid_value("animation-timing-function", "auto");
|
||||
test_invalid_value("animation-timing-function", "ease-in ease-out");
|
||||
test_invalid_value("animation-timing-function", "cubic-bezier(1, 2, 3)");
|
||||
test_invalid_value("animation-timing-function", "cubic-bezier(1, 2, 3, infinite)");
|
||||
test_invalid_value("animation-timing-function", "cubic-bezier(1, 2, 3, 4, 5)");
|
||||
test_invalid_value("animation-timing-function", "cubic-bezier(-0.1, 0.1, 0.5, 0.9)");
|
||||
test_invalid_value("animation-timing-function", "cubic-bezier(0.5, 0.1, 1.1, 0.9)");
|
||||
|
||||
test_invalid_value("animation-timing-function", "initial, cubic-bezier(0, -2, 1, 3)");
|
||||
test_invalid_value("animation-timing-function", "cubic-bezier(0, -2, 1, 3), initial");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Animations: parsing animation-timing-function with valid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-animations/#propdef-animation-timing-function">
|
||||
<meta name="assert" content="animation-timing-function supports the full grammar '<timing-function> #'.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
test_valid_value("animation-timing-function", "linear");
|
||||
|
||||
test_valid_value("animation-timing-function", "ease");
|
||||
test_valid_value("animation-timing-function", "ease-in");
|
||||
test_valid_value("animation-timing-function", "ease-out");
|
||||
test_valid_value("animation-timing-function", "ease-in-out");
|
||||
test_valid_value("animation-timing-function", "cubic-bezier(0.1, 0.2, 0.8, 0.9)");
|
||||
test_valid_value("animation-timing-function", "cubic-bezier(0, -2, 1, 3)");
|
||||
test_valid_value("animation-timing-function", "cubic-bezier(0, 0.7, 1, 1.3)");
|
||||
|
||||
|
||||
test_valid_value("animation-timing-function", "steps(4, start)");
|
||||
test_valid_value("animation-timing-function", "steps(2, end)", "steps(2)");
|
||||
test_valid_value("animation-timing-function", "steps(2, jump-start)");
|
||||
test_valid_value("animation-timing-function", "steps(2, jump-end)", "steps(2)");
|
||||
test_valid_value("animation-timing-function", "steps(2, jump-both)");
|
||||
test_valid_value("animation-timing-function", "steps(2, jump-none)");
|
||||
|
||||
test_valid_value("animation-timing-function", "linear, ease, linear");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,35 @@
|
|||
<!DOCTYPE html>
|
||||
<title>Tests which properties are allowed in @keyframes</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-animations/#typedef-keyframe-block">
|
||||
<link rel="author" href="mailto:xiaochengh@chromium.org">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<style id=sheet>
|
||||
@keyframes foo {
|
||||
from {
|
||||
/* Non-animation properties are allowed */
|
||||
margin-top: 10px;
|
||||
/* animation-timing-function is specially allowed */
|
||||
animation-timing-function: ease;
|
||||
/* All other animation properties are not allowed */
|
||||
animation-name: none;
|
||||
animation-duration: 1s;
|
||||
animation-iteration-count: 1;
|
||||
animation-direction: normal;
|
||||
animation-play-state: running;
|
||||
animation-delay: 0s;
|
||||
animation-fill-mode: none;
|
||||
/* The animation shorthand is also not allowed */
|
||||
animation: bar 1s infinite;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
test(() => {
|
||||
const keyframe = sheet.sheet.cssRules[0].cssRules[0];
|
||||
const style = keyframe.style;
|
||||
assert_equals(style.length, 2);
|
||||
assert_equals(style.marginTop, '10px');
|
||||
assert_equals(style.animationTimingFunction, 'ease');
|
||||
}, '@keyframes allows all non-animation properties and animation-timing-function');
|
||||
</script>
|
||||
|
|
@ -0,0 +1,46 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>CSS Animations: parsing @keyframes name with invalid values</title>
|
||||
<link rel="author" title="yisibl(一丝)" href="https://github.com/yisibl"/>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-animations/#typedef-keyframes-name">
|
||||
<meta name="assert" content="@keyframes name supports the full grammar '<custom-ident> | <string>'.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div>
|
||||
<main id="main"></main>
|
||||
</div>
|
||||
<script>
|
||||
test_keyframes_name_invalid('none');
|
||||
|
||||
// The CSS-wide keywords are not valid <custom-ident>s. The default keyword is reserved and is also not a valid <custom-ident>.
|
||||
// Spec: https://drafts.csswg.org/css-values-4/#identifier-value
|
||||
test_keyframes_name_invalid('default');
|
||||
test_keyframes_name_invalid('initial');
|
||||
test_keyframes_name_invalid('inherit');
|
||||
test_keyframes_name_invalid('unset');
|
||||
test_keyframes_name_invalid('revert');
|
||||
test_keyframes_name_invalid('revert-layer');
|
||||
|
||||
test_keyframes_name_invalid('12');
|
||||
test_keyframes_name_invalid('-12');
|
||||
test_keyframes_name_invalid('12foo');
|
||||
test_keyframes_name_invalid('foo.bar');
|
||||
test_keyframes_name_invalid('one two');
|
||||
test_keyframes_name_invalid('one, two');
|
||||
|
||||
test_keyframes_name_invalid('one, initial');
|
||||
test_keyframes_name_invalid('one, inherit');
|
||||
test_keyframes_name_invalid('one, unset');
|
||||
test_keyframes_name_invalid('default, two');
|
||||
test_keyframes_name_invalid('revert, three');
|
||||
test_keyframes_name_invalid('revert-layer, four');
|
||||
// TODO: https://bugs.chromium.org/p/chromium/issues/detail?id=1342609
|
||||
// test_keyframes_name_invalid('--foo');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,70 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>CSS Animations: parsing @keyframes name with valid values</title>
|
||||
<link rel="author" title="yisibl(一丝)" href="https://github.com/yisibl"/>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-animations/#typedef-keyframes-name">
|
||||
<meta name="assert" content="@keyframes name supports the full grammar '<custom-ident> | <string>'.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div>
|
||||
<main id="main"></main>
|
||||
</div>
|
||||
<script>
|
||||
// Test <custom-ident>
|
||||
test_keyframes_name_valid(' foo ');
|
||||
test_keyframes_name_valid(' foo');
|
||||
test_keyframes_name_valid('-foo');
|
||||
test_keyframes_name_valid('_bar');
|
||||
test_keyframes_name_valid('__bar');
|
||||
test_keyframes_name_valid('__bar__');
|
||||
test_keyframes_name_valid('ease-out');
|
||||
test_keyframes_name_valid('example');
|
||||
test_keyframes_name_valid('EXAMPLE');
|
||||
|
||||
test_keyframes_name_valid('not');
|
||||
test_keyframes_name_valid('and');
|
||||
test_keyframes_name_valid('all');
|
||||
test_keyframes_name_valid('or');
|
||||
|
||||
// <custom-ident> may disable the `auto/normal` keywords in the future
|
||||
// https://github.com/w3c/csswg-drafts/issues/7431
|
||||
test_keyframes_name_valid('auto');
|
||||
test_keyframes_name_valid('normal');
|
||||
|
||||
// Test <string>
|
||||
test_keyframes_name_valid('" foo "');
|
||||
test_keyframes_name_valid('" foo"');
|
||||
test_keyframes_name_valid('"-foo"');
|
||||
test_keyframes_name_valid('"_bar"');
|
||||
test_keyframes_name_valid('"__bar"');
|
||||
test_keyframes_name_valid('"__bar__"');
|
||||
test_keyframes_name_valid('"ease-out"');
|
||||
test_keyframes_name_valid('"example"');
|
||||
test_keyframes_name_valid('"EXAMPLE"');
|
||||
|
||||
test_keyframes_name_valid('"one two"');
|
||||
test_keyframes_name_valid('"one, two"');
|
||||
|
||||
test_keyframes_name_valid('"not"');
|
||||
test_keyframes_name_valid('"and"');
|
||||
test_keyframes_name_valid('"all"');
|
||||
test_keyframes_name_valid('"or"');
|
||||
|
||||
test_keyframes_name_valid('"auto"');
|
||||
test_keyframes_name_valid('"normal"');
|
||||
test_keyframes_name_valid('"none"');
|
||||
|
||||
test_keyframes_name_valid('"default"');
|
||||
test_keyframes_name_valid('"initial"');
|
||||
test_keyframes_name_valid('"inherit"');
|
||||
test_keyframes_name_valid('"unset"');
|
||||
test_keyframes_name_valid('"revert"');
|
||||
test_keyframes_name_valid('"revert-layer"');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Add table
Add a link
Reference in a new issue