Update web-platform-tests to revision b'2d7c53f5bc604132d2c83955537e454ee9c788c0'

This commit is contained in:
WPT Sync Bot 2023-01-18 01:45:07 +00:00
parent 619a46113f
commit 1c6b303ef2
396 changed files with 29611 additions and 1967 deletions

View file

@ -0,0 +1,43 @@
<!DOCTYPE html>
<link rel="help" href="https://drafts.css-houdini.org/css-properties-values-api-1">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../resources/utils.js"></script>
<div id="container"><div id="target"></div></div>
<script>
test(() => {
const customProperty = generate_name();
CSS.registerProperty({
name: customProperty,
syntax: "<number>",
inherits: false,
initialValue: "1"
});
// Create transitions for our custom property with
// a longer list of transition-duration values.
const container = document.getElementById("container");
container.style.transitionProperty = customProperty;
container.style.transitionDuration = "100s, 200s";
const target = document.getElementById("target");
target.style.transitionProperty = "inherit";
target.style.transitionDuration = "inherit";
// Trigger a style change by getting the custom property
// value from the computed style.
getComputedStyle(target).getPropertyValue(customProperty);
// Set a new value for the custom property, which will yield a
// transition.
target.style.setProperty(customProperty, "2");
const animations = target.getAnimations();
assert_equals(animations.length, 1, "A single transition was generated");
const transition = animations[0];
assert_class_string(transition, "CSSTransition", "A CSSTransition is running");
assert_equals(transition.transitionProperty, customProperty);
}, 'Using a single "transition-property" value set to a custom property and two "transition-duration" values correctly yields a CSS Transition when the transition properties are set on a parent and the child inherits.');
</script>

View file

@ -0,0 +1,39 @@
<!DOCTYPE html>
<link rel="help" href="https://drafts.css-houdini.org/css-properties-values-api-1">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../resources/utils.js"></script>
<div id="target"></div>
<script>
test(() => {
const customProperty = generate_name();
CSS.registerProperty({
name: customProperty,
syntax: "<number>",
inherits: false,
initialValue: "1"
});
// Create transitions for our custom property with
// a longer list of transition-duration values.
const target = document.getElementById("target");
target.style.transitionProperty = customProperty;
target.style.transitionDuration = "100s, 200s";
// Trigger a style change by getting the custom property
// value from the computed style.
getComputedStyle(target).getPropertyValue(customProperty);
// Set a new value for the custom property, which will yield a
// transition.
target.style.setProperty(customProperty, "2");
const animations = target.getAnimations();
assert_equals(animations.length, 1, "A single transition was generated");
const transition = animations[0];
assert_class_string(transition, "CSSTransition", "A CSSTransition is running");
assert_equals(transition.transitionProperty, customProperty);
}, 'Using a single "transition-property" value set to a custom property and two "transition-duration" values correctly yields a CSS Transition.');
</script>

View file

@ -295,4 +295,47 @@ test(() => {
});
}, 'No transition when removing @property rule');
test_with_at_property({
syntax: '"<length>"',
inherits: false,
initialValue: '0px'
}, (name) => {
with_style_node(`
@keyframes test {
from { ${name}: 100px; }
to { ${name}: 200px; }
}
#div {
animation: test 100s -50s linear;
--unregistered: var(${name});
}
`, () => {
assert_equals(getComputedStyle(div).getPropertyValue('--unregistered'), '150px');
});
}, 'Unregistered properties referencing animated properties update correctly.');
test_with_at_property({
syntax: '"<length>"',
inherits: false,
initialValue: '0px'
}, (name) => {
with_style_node(`
@keyframes test {
from { ${name}: 100px; }
to { ${name}: 200px; }
}
@property --registered {
syntax: "<length>";
inherits: false;
initialValue: 0px;
}
#div {
animation: test 100s -50s linear;
--registered: var(${name});
}
`, () => {
assert_equals(getComputedStyle(div).getPropertyValue('--registered'), '150px');
});
}, 'Registered properties referencing animated properties update correctly.');
</script>

View file

@ -12,7 +12,7 @@ test(() => {
// Before registering the property, ${name} should reify as a
// a token sequence.
assert_equals(div.computedStyleMap().get(name).constructor.name, 'CSSUnparsedValue');
assert_equals(div.computedStyleMap().get(name).toString(), ' 100px');
assert_equals(div.computedStyleMap().get(name).toString(), '100px');
with_at_property({
name: name,
@ -29,7 +29,7 @@ test(() => {
// After @property is removed, the computed value is once again a token
// sequence.
assert_equals(div.computedStyleMap().get(name).constructor.name, 'CSSUnparsedValue');
assert_equals(div.computedStyleMap().get(name).toString(), ' 100px');
assert_equals(div.computedStyleMap().get(name).toString(), '100px');
});
}, 'Properties declared with @property reify correctly');

View file

@ -41,6 +41,7 @@ assert_valid("*", "([ brackets ]) { yay (??)}");
assert_valid("*", "yep 'this is valid too'");
assert_valid("*", "unmatched opening bracket is valid :(");
assert_valid("*", '"');
assert_valid("*", "default");
assert_valid("<length>", "0");
assert_valid("<length>", "10px /*:)*/");
@ -154,16 +155,14 @@ assert_invalid("<color>|REVert", "red");
assert_invalid("<integer>|deFAUlt", "1");
// Invalid initialValue
// The 6 tests that follow are not clearly backed by the specification,
// but (at least other than the one for 'default') they're probably a
// good idea and we should change the spec. See
// The 5 tests that follow are not clearly backed by the specification,
// but they're probably a good idea and we should change the spec. See
// https://github.com/w3c/css-houdini-drafts/issues/1076 .
assert_invalid("*", "initial");
assert_invalid("*", "inherit");
assert_invalid("*", "unset");
assert_invalid("*", "revert");
assert_invalid("*", "revert-layer");
assert_invalid("*", "default");
// ... end possibly-invalid tests.
assert_invalid("<custom-ident>", "initial");
assert_invalid("<custom-ident>", "inherit");

View file

@ -141,7 +141,7 @@ test(function(){
let universal = generate_property('*');
element.style = `font-size: 10px; ${length}: 10em; ${universal}: var(${length})`;
let computedStyle = getComputedStyle(element);
assert_equals(computedStyle.getPropertyValue(universal), ' 100px');
assert_equals(computedStyle.getPropertyValue(universal), '100px');
element.style = '';
}, 'Values are absolutized when substituting into properties with universal syntax');