mirror of
https://github.com/servo/servo.git
synced 2025-08-03 12:40:06 +01:00
Update web-platform-tests to revision b'2d7c53f5bc604132d2c83955537e454ee9c788c0'
This commit is contained in:
parent
619a46113f
commit
1c6b303ef2
396 changed files with 29611 additions and 1967 deletions
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
||||
|
|
|
@ -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');
|
||||
|
||||
|
|
|
@ -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");
|
||||
|
|
|
@ -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');
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue