mirror of
https://github.com/servo/servo.git
synced 2025-08-06 14:10:11 +01:00
Update web-platform-tests to revision b'66a2552e58afc4f50e87b2306839664c1447e265'
This commit is contained in:
WPT Sync Bot
parent
d7cade7a66
commit
702d7621cf
183 changed files with 6761 additions and 938 deletions
|
|
@ -0,0 +1,16 @@
|
|||
<!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>
|
||||
|
||||
transition_test({
|
||||
syntax: "<angle>",
|
||||
from: "100deg",
|
||||
to: "200deg",
|
||||
expected: "150deg"
|
||||
}, 'A custom property of type <angle> can yield a CSS Transition');
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!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>
|
||||
|
||||
transition_test({
|
||||
syntax: "<color>",
|
||||
from: "rgb(100, 100, 100)",
|
||||
to: "rgb(200, 200, 200)",
|
||||
expected: "rgb(150, 150, 150)"
|
||||
}, 'A custom property of type <color> can yield a CSS Transition');
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<!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>
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<custom-ident>",
|
||||
from: "from",
|
||||
to: "to",
|
||||
}, 'A custom property of type <custom-ident> cannot yield a CSS Transition');
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<!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>
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<image>",
|
||||
from: 'url("https://example.com/from")',
|
||||
to: 'url("https://example.com/to")',
|
||||
}, 'A custom property of type <image> cannot yield a CSS Transition');
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!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 = "--my-length";
|
||||
|
||||
CSS.registerProperty({
|
||||
name: customProperty,
|
||||
syntax: "<length>",
|
||||
inherits: true,
|
||||
initialValue: "100px"
|
||||
});
|
||||
|
||||
target.style.marginLeft = `var(${customProperty})`;
|
||||
assert_equals(getComputedStyle(target).marginLeft, "100px");
|
||||
assert_equals(getComputedStyle(target).getPropertyValue(customProperty), "100px");
|
||||
|
||||
container.style.transition = `${customProperty} 1s -500ms linear`;
|
||||
container.style.setProperty(customProperty, "200px");
|
||||
|
||||
assert_equals(getComputedStyle(target).marginLeft, "150px");
|
||||
}, "Running a transition an inherited CSS variable is reflected on a standard property using that variable as a value");
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!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>
|
||||
|
||||
transition_test({
|
||||
syntax: "<integer>",
|
||||
from: "100",
|
||||
to: "200",
|
||||
expected: "150"
|
||||
}, 'A custom property of type <integer> can yield a CSS Transition');
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!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>
|
||||
|
||||
transition_test({
|
||||
syntax: "<length-percentage>",
|
||||
from: "100px",
|
||||
to: "100%",
|
||||
expected: "calc(50% + 50px)"
|
||||
}, 'A custom property of type <length-percentage> can yield a CSS Transition');
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!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>
|
||||
|
||||
transition_test({
|
||||
syntax: "<length>",
|
||||
from: "100px",
|
||||
to: "200px",
|
||||
expected: "150px"
|
||||
}, 'A custom property of type <length> can yield a CSS Transition');
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,153 @@
|
|||
<!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>
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<angle>#",
|
||||
from: '100deg, 200deg',
|
||||
to: '300deg',
|
||||
}, 'A custom property of type <angle># does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<angle>+",
|
||||
from: '100deg 200deg',
|
||||
to: '300deg',
|
||||
}, 'A custom property of type <angle>+ does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<color>#",
|
||||
from: 'rgb(100, 100, 100), rgb(150, 150, 150)',
|
||||
to: 'rgb(200, 200, 200)',
|
||||
}, 'A custom property of type <color># does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<color>+",
|
||||
from: 'rgb(100, 100, 100) rgb(150, 150, 150)',
|
||||
to: 'rgb(200, 200, 200)',
|
||||
}, 'A custom property of type <color>+ does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<custom-ident>#",
|
||||
from: 'foo, bar',
|
||||
to: 'baz',
|
||||
}, 'A custom property of type <custom-ident># does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<custom-ident>+",
|
||||
from: 'foo bar',
|
||||
to: 'baz',
|
||||
}, 'A custom property of type <custom-ident>+ does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<image>#",
|
||||
from: 'url("https://example.com/foo"), url("https://example.com/bar")',
|
||||
to: 'url("https://example.com/to")',
|
||||
}, 'A custom property of type <image># does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<image>+",
|
||||
from: 'url("https://example.com/foo") url("https://example.com/bar")',
|
||||
to: 'url("https://example.com/to")',
|
||||
}, 'A custom property of type <image>+ does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<integer>#",
|
||||
from: '100, 200',
|
||||
to: '300',
|
||||
}, 'A custom property of type <integer># does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<integer>+",
|
||||
from: '100 200',
|
||||
to: '300',
|
||||
}, 'A custom property of type <integer>+ does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<length-percentage>#",
|
||||
from: '100px, 200px',
|
||||
to: '300%',
|
||||
}, 'A custom property of type <length-percentage># does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<length-percentage>+",
|
||||
from: '100px 200px',
|
||||
to: '300%',
|
||||
}, 'A custom property of type <length-percentage>+ does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<length>#",
|
||||
from: '100px, 200px',
|
||||
to: '300px',
|
||||
}, 'A custom property of type <length># does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<length>+",
|
||||
from: '100px 200px',
|
||||
to: '300px',
|
||||
}, 'A custom property of type <length>+ does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<number>#",
|
||||
from: '100, 200',
|
||||
to: '300',
|
||||
}, 'A custom property of type <number># does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<number>+",
|
||||
from: '100 200',
|
||||
to: '300',
|
||||
}, 'A custom property of type <number>+ does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<percentage>#",
|
||||
from: '100%, 200%',
|
||||
to: '300%',
|
||||
}, 'A custom property of type <percentage># does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<percentage>+",
|
||||
from: '100% 200%',
|
||||
to: '300%',
|
||||
}, 'A custom property of type <percentage>+ does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<resolution>#",
|
||||
from: '100dppx, 200dppx',
|
||||
to: '300dppx',
|
||||
}, 'A custom property of type <resolution># does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<resolution>+",
|
||||
from: '100dppx 200dppx',
|
||||
to: '300dppx',
|
||||
}, 'A custom property of type <resolution>+ does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<time>#",
|
||||
from: '100s, 200s',
|
||||
to: '300s',
|
||||
}, 'A custom property of type <time># does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<time>+",
|
||||
from: '100s 200s',
|
||||
to: '300s',
|
||||
}, 'A custom property of type <time>+ does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<url>#",
|
||||
from: 'url("https://example.com/foo"), url("https://example.com/bar")',
|
||||
to: 'url("https://example.com/to")',
|
||||
}, 'A custom property of type <url># does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<url>+",
|
||||
from: 'url("https://example.com/foo") url("https://example.com/bar")',
|
||||
to: 'url("https://example.com/to")',
|
||||
}, 'A custom property of type <url>+ does not yield a CSS Transition if the lists do not contain the same number of values');
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
<!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 = "--my-length";
|
||||
|
||||
CSS.registerProperty({
|
||||
name: customProperty,
|
||||
syntax: "<length>",
|
||||
inherits: false,
|
||||
initialValue: "100px"
|
||||
});
|
||||
|
||||
target.style.marginLeft = `var(${customProperty})`;
|
||||
assert_equals(getComputedStyle(target).marginLeft, "100px");
|
||||
|
||||
target.style.transition = `${customProperty} 1s -500ms linear`;
|
||||
target.style.setProperty(customProperty, "200px");
|
||||
|
||||
assert_equals(getComputedStyle(target).marginLeft, "150px");
|
||||
}, "Running a transition a non-inherited CSS variable is reflected on a standard property using that variable as a value");
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!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>
|
||||
|
||||
transition_test({
|
||||
syntax: "<number>",
|
||||
from: "100",
|
||||
to: "200",
|
||||
expected: "150"
|
||||
}, 'A custom property of type <number> can yield a CSS Transition');
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!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>
|
||||
|
||||
transition_test({
|
||||
syntax: "<percentage>",
|
||||
from: "100%",
|
||||
to: "200%",
|
||||
expected: "150%"
|
||||
}, 'A custom property of type <percentage> can yield a CSS Transition');
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!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>
|
||||
|
||||
transition_test({
|
||||
syntax: "<resolution>",
|
||||
from: "100dppx",
|
||||
to: "200dppx",
|
||||
expected: "150dppx"
|
||||
}, 'A custom property of type <resolution> can yield a CSS Transition');
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!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>
|
||||
|
||||
transition_test({
|
||||
syntax: "<time>",
|
||||
from: "100s",
|
||||
to: "200s",
|
||||
expected: "150s"
|
||||
}, 'A custom property of type <time> can yield a CSS Transition');
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!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>
|
||||
|
||||
transition_test({
|
||||
syntax: "<transform-function>",
|
||||
from: "translateX(100px)",
|
||||
to: "translateX(200px)",
|
||||
expected: "translateX(150px)"
|
||||
}, 'A custom property of type <transform-function> can yield a CSS Transition');
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!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>
|
||||
|
||||
transition_test({
|
||||
syntax: "<transform-list>",
|
||||
from: "translateX(100px) scale(2)",
|
||||
to: "translateX(200px) scale(4)",
|
||||
expected: "translateX(150px) scale(3)"
|
||||
}, 'A custom property of type <transform-list> can yield a CSS Transition');
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<!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>
|
||||
|
||||
no_transition_test({
|
||||
syntax: "<url>",
|
||||
from: 'url("https://example.com/from")',
|
||||
to: 'url("https://example.com/to")',
|
||||
}, 'A custom property of type <url> cannot yield a CSS Transition');
|
||||
|
||||
</script>
|
||||
Loading…
Add table
Add a link
Reference in a new issue