mirror of
https://github.com/servo/servo.git
synced 2025-08-18 11:55:39 +01:00
Update web-platform-tests to revision a412aa768f8558ec93bcab7e7f1aabcce6f38e88
This commit is contained in:
parent
b3eed5b5bd
commit
653b871d4f
64 changed files with 2136 additions and 64 deletions
|
@ -0,0 +1,64 @@
|
|||
<html>
|
||||
<body>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/common/get-host-info.sub.js"></script>
|
||||
<script>
|
||||
|
||||
// If the response for the HTML file contains "Accept-CH" in the response
|
||||
// headers, then the browser should attach the specified client hints in the
|
||||
// HTTP request headers depending on whether the resource is being fetched from
|
||||
// the same origin or a different origin. Test this functionality by fetching
|
||||
// same-origin and cross-origin resources from this page. The response headers
|
||||
// for this page include "Accept-CH: device-memory, dpr, viewport-width, rtt, downlink, ect".
|
||||
//
|
||||
// echo_client_hints_received.py sets the response headers depending on the set
|
||||
// of client hints it receives in the request headers.
|
||||
|
||||
promise_test(t => {
|
||||
return fetch(get_host_info()["HTTPS_ORIGIN"] + "/client-hints/echo_client_hints_received.py").then(r => {
|
||||
assert_equals(r.status, 200)
|
||||
// Verify that the browser includes client hints in the headers for a
|
||||
// same-origin fetch which not specifically excluded via Feature-Policy.
|
||||
assert_true(r.headers.has("device-memory-received"), "device-memory-received");
|
||||
assert_false(r.headers.has("dpr-received"), "dpr-received");
|
||||
assert_false(r.headers.has("lang-received"), "lang-received");
|
||||
assert_true(r.headers.has("viewport-width-received"), "viewport-width-received");
|
||||
|
||||
assert_true(r.headers.has("rtt-received"), "rtt-received");
|
||||
var rtt = parseInt(r.headers.get("rtt-received"));
|
||||
assert_greater_than_equal(rtt, 0);
|
||||
assert_less_than_equal(rtt, 3000);
|
||||
assert_equals(rtt % 50, 0, 'rtt must be a multiple of 50 msec');
|
||||
|
||||
assert_true(r.headers.has("downlink-received"), "downlink-received");
|
||||
var downlinkKbps = r.headers.get("downlink-received") * 1000;
|
||||
assert_greater_than_equal(downlinkKbps, 0);
|
||||
assert_less_than_equal(downlinkKbps, 10000);
|
||||
|
||||
assert_in_array(r.headers.get("ect-received"), ["slow-2g", "2g",
|
||||
"3g", "4g"], 'ect-received is unexpected');
|
||||
});
|
||||
}, "Accept-CH header test");
|
||||
|
||||
promise_test(t => {
|
||||
return fetch(get_host_info()["HTTPS_REMOTE_ORIGIN"] + "/client-hints/echo_client_hints_received.py").then(r => {
|
||||
assert_equals(r.status, 200)
|
||||
// Verify that the browser includes client hints in the headers for a
|
||||
// cross-origin fetch which are specifically requested via Feature-Policy.
|
||||
assert_true(r.headers.has("device-memory-received"), "device-memory-received");
|
||||
assert_false(r.headers.has("dpr-received"), "dpr-received");
|
||||
assert_false(r.headers.has("lang-received"), "lang-received");
|
||||
assert_false(r.headers.has("viewport-width-received"), "viewport-width-received");
|
||||
assert_false(r.headers.has("rtt-received"), "rtt-received");
|
||||
assert_false(r.headers.has("downlink-received"), "downlink-received");
|
||||
assert_false(r.headers.has("ect-received"), "ect-received");
|
||||
});
|
||||
}, "Cross-Origin Accept-CH header test");
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,2 @@
|
|||
Accept-CH: device-memory, dpr, viewport-width, rtt, downlink, ect, lang
|
||||
Feature-Policy: ch-device-memory *; ch-dpr 'none'; ch-viewport-width 'self'; ch-lang 'none'
|
|
@ -0,0 +1,62 @@
|
|||
<html>
|
||||
<body>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/common/get-host-info.sub.js"></script>
|
||||
<script>
|
||||
|
||||
// If the response for the HTML file contains "Accept-CH" in the response
|
||||
// headers, then the browser should attach the specified client hints in the
|
||||
// HTTP request headers depending on whether the resource is being fetched from
|
||||
// the same origin or a different origin. Test this functionality by fetching
|
||||
// same-origin and cross-origin resources from this page. The response headers
|
||||
// for this page include "Accept-CH: device-memory, dpr, viewport-width, rtt, downlink, ect".
|
||||
//
|
||||
// echo_client_hints_received.py sets the response headers depending on the set
|
||||
// of client hints it receives in the request headers.
|
||||
|
||||
promise_test(t => {
|
||||
return fetch(get_host_info()["HTTPS_ORIGIN"] + "/client-hints/echo_client_hints_received.py").then(r => {
|
||||
assert_equals(r.status, 200)
|
||||
// Verify that the browser includes client hints in the headers for a
|
||||
// same-origin fetch with the default feature policy in place.
|
||||
assert_true(r.headers.has("device-memory-received"), "device-memory-received");
|
||||
assert_true(r.headers.has("dpr-received"), "dpr-received");
|
||||
assert_true(r.headers.has("viewport-width-received"), "viewport-width-received");
|
||||
|
||||
assert_true(r.headers.has("rtt-received"), "rtt-received");
|
||||
var rtt = parseInt(r.headers.get("rtt-received"));
|
||||
assert_greater_than_equal(rtt, 0);
|
||||
assert_less_than_equal(rtt, 3000);
|
||||
assert_equals(rtt % 50, 0, 'rtt must be a multiple of 50 msec');
|
||||
|
||||
assert_true(r.headers.has("downlink-received"), "downlink-received");
|
||||
var downlinkKbps = r.headers.get("downlink-received") * 1000;
|
||||
assert_greater_than_equal(downlinkKbps, 0);
|
||||
assert_less_than_equal(downlinkKbps, 10000);
|
||||
|
||||
assert_in_array(r.headers.get("ect-received"), ["slow-2g", "2g",
|
||||
"3g", "4g"], 'ect-received is unexpected');
|
||||
});
|
||||
}, "Accept-CH header test");
|
||||
|
||||
promise_test(t => {
|
||||
return fetch(get_host_info()["HTTPS_REMOTE_ORIGIN"] + "/client-hints/echo_client_hints_received.py").then(r => {
|
||||
assert_equals(r.status, 200)
|
||||
// Verify that the browser includes no client hints in the headers for a
|
||||
// cross-origin fetch with the default feature policy in place.
|
||||
assert_false(r.headers.has("device-memory-received"), "device-memory-received");
|
||||
assert_false(r.headers.has("dpr-received"), "dpr-received");
|
||||
assert_false(r.headers.has("viewport-width-received"), "viewport-width-received");
|
||||
assert_false(r.headers.has("rtt-received"), "rtt-received");
|
||||
assert_false(r.headers.has("downlink-received"), "downlink-received");
|
||||
assert_false(r.headers.has("ect-received"), "ect-received");
|
||||
});
|
||||
}, "Cross-Origin Accept-CH header test");
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1 @@
|
|||
Accept-CH: device-memory, dpr, viewport-width, rtt, downlink, ect
|
|
@ -5,6 +5,8 @@ def main(request, response):
|
|||
"""
|
||||
|
||||
response.headers.append("Access-Control-Allow-Origin", "*")
|
||||
response.headers.append("Access-Control-Allow-Headers", "*")
|
||||
response.headers.append("Access-Control-Expose-Headers", "*")
|
||||
|
||||
if "device-memory" in request.headers:
|
||||
response.headers.set("device-memory-received", request.headers.get("device-memory"))
|
||||
|
|
|
@ -0,0 +1,35 @@
|
|||
<!DOCTYPE html>
|
||||
<style>
|
||||
html, body {
|
||||
margin: 0;
|
||||
}
|
||||
html {
|
||||
margin-left: 10px;
|
||||
}
|
||||
outer {
|
||||
display: block;
|
||||
border: blue 10px solid;
|
||||
width: 100px;
|
||||
}
|
||||
inner {
|
||||
display: block;
|
||||
border: orange 10px solid;
|
||||
margin-left: -20px;
|
||||
margin-right: -50px;
|
||||
height: 10px;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<outer>
|
||||
<inner></inner>
|
||||
</outer>
|
||||
<outer>
|
||||
<inner></inner>
|
||||
</outer>
|
||||
<outer>
|
||||
<inner></inner>
|
||||
</outer>
|
||||
<outer>
|
||||
<inner></inner>
|
||||
</outer>
|
||||
</body>
|
|
@ -0,0 +1,42 @@
|
|||
<!DOCTYPE html>
|
||||
<title>Negative margins in LTR/RTL and BFC/non-BFC</title>
|
||||
<link rel="author" title="Koji Ishii" href="kojii@chromium.org">
|
||||
<link rel="help" href="https://www.w3.org/TR/CSS22/box.html#margin-properties" title="Margin properties">
|
||||
<link rel="match" href="negative-margin-001-ref.html">
|
||||
<style>
|
||||
html, body {
|
||||
margin: 0;
|
||||
}
|
||||
html {
|
||||
margin-left: 10px;
|
||||
}
|
||||
outer {
|
||||
display: block;
|
||||
border: blue 10px solid;
|
||||
width: 100px;
|
||||
}
|
||||
inner {
|
||||
display: block;
|
||||
border: orange 10px solid;
|
||||
margin-left: -20px;
|
||||
margin-right: -50px;
|
||||
height: 10px;
|
||||
}
|
||||
inner.bfc {
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<outer>
|
||||
<inner></inner>
|
||||
</outer>
|
||||
<outer dir="rtl">
|
||||
<inner></inner>
|
||||
</outer>
|
||||
<outer>
|
||||
<inner class="bfc"></inner>
|
||||
</outer>
|
||||
<outer dir="rtl">
|
||||
<inner class="bfc"></inner>
|
||||
</outer>
|
||||
</body>
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Flexible Box Layout: getComputedValue().flex</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-flexbox/#propdef-flex">
|
||||
<meta name="assert" content="flex computed value is specified keywords and/or computed <length-percentage>.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/computed-testcommon.js"></script>
|
||||
<style>
|
||||
#target {
|
||||
font-size: 40px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="target"></div>
|
||||
<script>
|
||||
test_computed_value("flex", "none", "0 0 auto");
|
||||
test_computed_value("flex", "1", "1 1 0%");
|
||||
test_computed_value("flex", "2 3", "2 3 0%");
|
||||
test_computed_value("flex", "4 5 6px");
|
||||
test_computed_value("flex", "7% 8", "8 1 7%");
|
||||
test_computed_value("flex", "8 auto", "8 1 auto");
|
||||
test_computed_value("flex", "calc(10px + 0.5em)", "1 1 30px");
|
||||
test_computed_value("flex", "calc(10px - 0.5em)", "1 1 0px");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,13 @@
|
|||
<!DOCTYPE html>
|
||||
<title>Inheritance of CSS Forced Color Adjust properties</title>
|
||||
<link rel="help" href="https://www.w3.org/TR/css-color-adjust-1/#forced-color-adjust-prop">
|
||||
<meta name="assert" content="Properties inherit according to the spec.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/inheritance-testcommon.js"></script>
|
||||
<div id="container">
|
||||
<div id="target"></div>
|
||||
</div>
|
||||
<script>
|
||||
assert_inherited('forced-color-adjust', 'auto', 'none');
|
||||
</script>
|
|
@ -0,0 +1,18 @@
|
|||
<!DOCTYPE html>
|
||||
<title>CSS Forced Color Adjust: getComputedStyle for forced-color-adjust</title>
|
||||
<link rel="help" href="https://www.w3.org/TR/css-color-adjust-1/#forced-color-adjust-prop">
|
||||
<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("forced-color-adjust", "", "auto");
|
||||
test_computed_value("forced-color-adjust", "auto");
|
||||
test_computed_value("forced-color-adjust", "none");
|
||||
// reserved and css-wide keywords.
|
||||
test_computed_value("forced-color-adjust", "initial", "auto");
|
||||
test_computed_value("forced-color-adjust", "inherit", "auto");
|
||||
test_computed_value("forced-color-adjust", "unset", "auto");
|
||||
test_computed_value("forced-color-adjust", "revert", "auto");
|
||||
test_computed_value("forced-color-adjust", "default", "auto");
|
||||
</script>
|
|
@ -0,0 +1,13 @@
|
|||
<!DOCTYPE html>
|
||||
<title>CSS Forced Color Adjust: parsing forced-color-adjust with invalid values</title>
|
||||
<link rel="help" href="https://www.w3.org/TR/css-color-adjust-1/#forced-color-adjust-prop">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
<script>
|
||||
test_invalid_value("forced-color-adjust", "auto auto");
|
||||
test_invalid_value("forced-color-adjust", "auto none");
|
||||
test_invalid_value("forced-color-adjust", "none none");
|
||||
test_invalid_value("forced-color-adjust", "none auto");
|
||||
test_invalid_value("forced-color-adjust", "1");
|
||||
</script>
|
|
@ -0,0 +1,10 @@
|
|||
<!DOCTYPE html>
|
||||
<title>CSS Forced Color Adjust: parsing forced-color-adjust with valid values</title>
|
||||
<link rel="help" href="https://www.w3.org/TR/css-color-adjust-1/#forced-color-adjust-prop">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
<script>
|
||||
test_valid_value("forced-color-adjust", "none");
|
||||
test_valid_value("forced-color-adjust", "auto");
|
||||
</script>
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Logical Properties and Values: parsing margin-block and margin-inline with invalid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-logical/#propdef-margin-block">
|
||||
<meta name="assert" content="margin-block, margin-inline support only the grammar '<'margin-top'>{1,2}'.">
|
||||
<meta name="assert" content="margin-block, margin-inline longhands support only the grammar '<'margin-top'>'.">
|
||||
<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("margin-block-start", "none");
|
||||
test_invalid_value("margin-block-end", "10");
|
||||
test_invalid_value("margin-inline-start", "20% calc(10px - 0.5em)");
|
||||
test_invalid_value("margin-inline-end", "10px, auto");
|
||||
|
||||
test_invalid_value("margin-block", "none");
|
||||
test_invalid_value("margin-block", "20%, calc(10px - 0.5em)");
|
||||
test_invalid_value("margin-inline", "10px auto 20px");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,32 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Logical Properties and Values: parsing margin-block and margin-inline with valid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-logical/#propdef-margin-block">
|
||||
<meta name="assert" content="margin-block, margin-inline support the full grammar '<'margin-top'>{1,2}'.">
|
||||
<meta name="assert" content="margin-block, margin-inline longhands support the full grammar '<'margin-top'>'.">
|
||||
<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("margin-block-start", "calc(20% + 10px)");
|
||||
test_valid_value("margin-block-start", "auto");
|
||||
test_valid_value("margin-block-end", "-10px");
|
||||
test_valid_value("margin-inline-start", "-20%");
|
||||
test_valid_value("margin-inline-end", "calc(2em + 3ex)");
|
||||
|
||||
test_valid_value("margin-block", "auto");
|
||||
test_valid_value("margin-block", "-10px");
|
||||
test_valid_value("margin-block", "calc(2em + 3ex) -20%");
|
||||
test_valid_value("margin-block", "auto auto", "auto");
|
||||
test_valid_value("margin-block", "-20% calc(20% + 10px)");
|
||||
test_valid_value("margin-inline", "20%");
|
||||
test_valid_value("margin-inline", "calc(2em + 3ex)");
|
||||
test_valid_value("margin-inline", "-10px auto");
|
||||
test_valid_value("margin-inline", "auto calc(2em + 3ex)");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,32 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Logical Properties and Values: getComputedValue().maxBlockSize</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-logical/#propdef-max-block-size">
|
||||
<meta name="assert" content="Computed max-block-size is the specified keyword, or the length-percentage made absolute.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/computed-testcommon.js"></script>
|
||||
<style>
|
||||
#target {
|
||||
font-size: 40px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="target"></div>
|
||||
<script>
|
||||
test_computed_value("max-block-size", "none");
|
||||
|
||||
test_computed_value("max-block-size", "10px");
|
||||
test_computed_value("max-block-size", "20%");
|
||||
test_computed_value("max-block-size", "calc(10px + 0.5em)", "30px");
|
||||
test_computed_value("max-block-size", "calc(10px - 0.5em)", "0px");
|
||||
test_computed_value("max-block-size", "calc(20% + 10px)");
|
||||
|
||||
test_computed_value("max-block-size", "min-content");
|
||||
test_computed_value("max-block-size", "max-content");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,32 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Logical Properties and Values: getComputedValue().maxInlineSize</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-logical/#propdef-max-inline-size">
|
||||
<meta name="assert" content="Computed max-inline-size is the specified keyword, or the length-percentage made absolute.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/computed-testcommon.js"></script>
|
||||
<style>
|
||||
#target {
|
||||
font-size: 40px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="target"></div>
|
||||
<script>
|
||||
test_computed_value("max-inline-size", "none");
|
||||
|
||||
test_computed_value("max-inline-size", "10px");
|
||||
test_computed_value("max-inline-size", "20%");
|
||||
test_computed_value("max-inline-size", "calc(10px + 0.5em)", "30px");
|
||||
test_computed_value("max-inline-size", "calc(10px - 0.5em)", "0px");
|
||||
test_computed_value("max-inline-size", "calc(20% + 10px)");
|
||||
|
||||
test_computed_value("max-inline-size", "min-content");
|
||||
test_computed_value("max-inline-size", "max-content");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,47 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Logical Properties and Values: getComputedValue().minBlockSize</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-logical/#propdef-min-block-size">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#min-size-auto">
|
||||
<meta name="assert" content="Computed min-block-size is the specified keyword, or the length-percentage made absolute.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/computed-testcommon.js"></script>
|
||||
<style>
|
||||
#target {
|
||||
font-size: 40px;
|
||||
}
|
||||
#container {
|
||||
display: flex;
|
||||
}
|
||||
#box {
|
||||
min-block-size: auto;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="target"></div>
|
||||
<div id="container">
|
||||
<div id="box"></div>
|
||||
</div>
|
||||
<script>
|
||||
test_computed_value("min-block-size", "auto", "0px");
|
||||
|
||||
test_computed_value("min-block-size", "10px");
|
||||
test_computed_value("min-block-size", "20%");
|
||||
test_computed_value("min-block-size", "calc(10px + 0.5em)", "30px");
|
||||
test_computed_value("min-block-size", "calc(10px - 0.5em)", "0px");
|
||||
test_computed_value("min-block-size", "calc(20% + 10px)");
|
||||
|
||||
test_computed_value("min-block-size", "min-content");
|
||||
test_computed_value("min-block-size", "max-content");
|
||||
|
||||
test(() => {
|
||||
const picture = document.getElementById('box');
|
||||
assert_equals(getComputedStyle(picture).minBlockSize, 'auto');
|
||||
}, 'min-block-size auto computes to auto with flex layout.');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,47 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Logical Properties and Values: getComputedValue().minInlineSize</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-logical/#propdef-min-inline-size">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#min-size-auto">
|
||||
<meta name="assert" content="Computed min-inline-size is the specified keyword, or the length-percentage made absolute.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/computed-testcommon.js"></script>
|
||||
<style>
|
||||
#target {
|
||||
font-size: 40px;
|
||||
}
|
||||
#container {
|
||||
display: flex;
|
||||
}
|
||||
#box {
|
||||
min-inline-size: auto;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="target"></div>
|
||||
<div id="container">
|
||||
<div id="box"></div>
|
||||
</div>
|
||||
<script>
|
||||
test_computed_value("min-inline-size", "auto", "0px");
|
||||
|
||||
test_computed_value("min-inline-size", "10px");
|
||||
test_computed_value("min-inline-size", "20%");
|
||||
test_computed_value("min-inline-size", "calc(10px + 0.5em)", "30px");
|
||||
test_computed_value("min-inline-size", "calc(10px - 0.5em)", "0px");
|
||||
test_computed_value("min-inline-size", "calc(20% + 10px)");
|
||||
|
||||
test_computed_value("min-inline-size", "min-content");
|
||||
test_computed_value("min-inline-size", "max-content");
|
||||
|
||||
test(() => {
|
||||
const picture = document.getElementById('box');
|
||||
assert_equals(getComputedStyle(picture).minInlineSize, 'auto');
|
||||
}, 'min-inline-size auto computes to auto with flex layout.');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,35 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Logical Properties and Values: parsing padding-block and padding-inline with invalid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-logical/#propdef-padding-block">
|
||||
<meta name="assert" content="padding-block, padding-inline support only the grammar '<'padding-top'>{1,2}'.">
|
||||
<meta name="assert" content="padding-block, padding-inline longhands support only the grammar '<'padding-top'>'.">
|
||||
<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("padding-block-start", "none");
|
||||
test_invalid_value("padding-block-start", "-10px");
|
||||
test_invalid_value("padding-block-end", "1px 2px");
|
||||
test_invalid_value("padding-block-end", "auto");
|
||||
test_invalid_value("padding-block-end", "10");
|
||||
test_invalid_value("padding-block-end", "1px, 2px");
|
||||
test_invalid_value("padding-inline-start", "20% calc(10px - 0.5em)");
|
||||
test_invalid_value("padding-inline-start", "2px auto");
|
||||
test_invalid_value("padding-inline-end", "-20%");
|
||||
test_invalid_value("padding-inline-end", "10px, auto");
|
||||
|
||||
test_invalid_value("padding-block", "none");
|
||||
test_invalid_value("padding-block", "20% -10px");
|
||||
test_invalid_value("padding-block", "auto, -10px");
|
||||
test_invalid_value("padding-block", "20%, calc(10px - 0.5em)");
|
||||
test_invalid_value("padding-inline", "10px auto 20px");
|
||||
test_invalid_value("padding-inline", "1px 2px 3px");
|
||||
test_invalid_value("padding-inline", "-20% calc(20% + 10px)");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,27 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Logical Properties and Values: parsing padding-block and padding-inline with valid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-logical/#propdef-padding-block">
|
||||
<meta name="assert" content="padding-block, padding-inline support the full grammar '<'padding-top'>{1,2}'.">
|
||||
<meta name="assert" content="padding-block, padding-inline longhands support the full grammar '<'padding-top'>'.">
|
||||
<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("padding-block-start", "0", "0px");
|
||||
test_valid_value("padding-block-start", "calc(20% + 10px)");
|
||||
test_valid_value("padding-block-end", "10px");
|
||||
test_valid_value("padding-inline-start", "20%");
|
||||
test_valid_value("padding-inline-end", "calc(2em + 2ex)");
|
||||
|
||||
test_valid_value("padding-block", "10px");
|
||||
test_valid_value("padding-block", "10px 20%");
|
||||
test_valid_value("padding-inline", "20%");
|
||||
test_valid_value("padding-inline", "20% calc(20% + 10px)");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,37 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout: getComputedValue().columnRule</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-multicol/#propdef-column-rule">
|
||||
<meta name="assert" content="column-rule 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>
|
||||
<style>
|
||||
#reference {
|
||||
column-rule-style: dotted; /* Avoid column-rule-width computed style 0px */
|
||||
column-rule-width: medium;
|
||||
}
|
||||
#target {
|
||||
color: lime;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="reference"></div>
|
||||
<div id="target"></div>
|
||||
<script>
|
||||
const currentColor = 'rgb(0, 255, 0)';
|
||||
const mediumWidth = getComputedStyle(document.getElementById('reference')).columnRuleWidth; // e.g. 3px
|
||||
|
||||
test_computed_value("column-rule", "10px", "0px none " + currentColor);
|
||||
test_computed_value("column-rule", "dotted", mediumWidth + " dotted " + currentColor);
|
||||
test_computed_value("column-rule", "0px none rgb(255, 0, 255)");
|
||||
test_computed_value("column-rule", "10px dotted rgb(255, 0, 255)");
|
||||
|
||||
test_computed_value("column-rule", "medium hidden currentcolor", "0px hidden " + currentColor);
|
||||
test_computed_value("column-rule", "medium solid currentcolor", mediumWidth + " solid " + currentColor);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration Test: getComputedValue().textDecorationColor</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-decoration-color-property">
|
||||
<meta name="assert" content="Computed text-decoration-color is the computed color.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/computed-testcommon.js"></script>
|
||||
<style>
|
||||
#container {
|
||||
color: rgb(255, 0, 0);
|
||||
text-decoration-color: currentcolor;
|
||||
}
|
||||
#target {
|
||||
color: rgb(0, 255, 0);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="container">
|
||||
<div id="target"></div>
|
||||
</div>
|
||||
<script>
|
||||
test_computed_value("text-decoration-color", "rgb(0, 0, 255)");
|
||||
test_computed_value("text-decoration-color", "currentcolor", "rgb(0, 255, 0)");
|
||||
test_computed_value("text-decoration-color", "inherit", "rgb(0, 255, 0)"); // currentcolor
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,15 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration Test: Parsing text-decoration-color with invalid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-decoration-color-property">
|
||||
<meta name="assert" content="text-decoration-color supports only the grammar '<color>'.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
<script>
|
||||
test_invalid_value("text-decoration-color", "auto");
|
||||
test_invalid_value("text-decoration-color", "invert");
|
||||
test_invalid_value("text-decoration-color", "50%");
|
||||
test_invalid_value("text-decoration-color", "red green");
|
||||
</script>
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration Test: Parsing text-decoration-color with valid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-decoration-color-property">
|
||||
<meta name="assert" content="text-decoration-color supports the full grammar '<color>'.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
<script>
|
||||
test_valid_value("text-decoration-color", "currentcolor");
|
||||
test_valid_value("text-decoration-color", "red");
|
||||
test_valid_value("text-decoration-color", "rgba(10, 20, 30, 0.4)");
|
||||
</script>
|
||||
|
|
@ -0,0 +1,32 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration Test: getComputedValue().textDecoration</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-4/#text-decoration-line-property">
|
||||
<meta name="assert" content="text-decoration 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>
|
||||
<style>
|
||||
#target {
|
||||
color: blue;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="target"></div>
|
||||
<script>
|
||||
'use strict';
|
||||
const currentColor = "rgb(0, 0, 255)";
|
||||
test_computed_value("text-decoration", "none", "none solid " + currentColor);
|
||||
test_computed_value("text-decoration", "line-through", "line-through solid " + currentColor);
|
||||
test_computed_value("text-decoration", "solid", "none solid " + currentColor);
|
||||
test_computed_value("text-decoration", "currentcolor", "none solid " + currentColor);
|
||||
|
||||
test_computed_value("text-decoration", "double overline underline", "underline overline double " + currentColor);
|
||||
test_computed_value("text-decoration", "underline overline line-through red", "underline overline line-through solid rgb(255, 0, 0)");
|
||||
test_computed_value("text-decoration", "rgba(10, 20, 30, 0.4) dotted", "none dotted rgba(10, 20, 30, 0.4)");
|
||||
|
||||
test_computed_value("text-decoration", "underline dashed rgb(0, 255, 0)");
|
||||
</script>
|
|
@ -0,0 +1,16 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration Test: Parsing text-decoration with invalid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#propdef-text-decoration">
|
||||
<meta name="assert" content="text-decoration supports only the grammar '<‘text-decoration-line’> || <‘text-decoration-style’> || <‘text-decoration-color’>'.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
<script>
|
||||
test_invalid_value("text-decoration", "auto");
|
||||
test_invalid_value("text-decoration", "1px");
|
||||
|
||||
test_invalid_value("text-decoration", "double overline underline dotted");
|
||||
test_invalid_value("text-decoration", "red line-through green");
|
||||
test_invalid_value("text-decoration", "overline blue underline");
|
||||
</script>
|
|
@ -0,0 +1,41 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration Test: getComputedValue().textDecorationLine</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-4/#text-decoration-line-property">
|
||||
<meta name="assert" content="text-decoration-line computed value is specified keyword(s).">
|
||||
<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>
|
||||
// none
|
||||
test_computed_value("text-decoration-line", "none");
|
||||
|
||||
// underline || overline || line-through || blink
|
||||
test_computed_value("text-decoration-line", "underline");
|
||||
test_computed_value("text-decoration-line", "overline");
|
||||
test_computed_value("text-decoration-line", "line-through");
|
||||
test_computed_value("text-decoration-line", "blink");
|
||||
test_computed_value("text-decoration-line", "underline overline");
|
||||
test_computed_value("text-decoration-line", "underline line-through");
|
||||
test_computed_value("text-decoration-line", "underline blink");
|
||||
test_computed_value("text-decoration-line", "overline line-through");
|
||||
test_computed_value("text-decoration-line", "overline blink");
|
||||
test_computed_value("text-decoration-line", "line-through blink");
|
||||
test_computed_value("text-decoration-line", "underline overline line-through");
|
||||
test_computed_value("text-decoration-line", "underline overline blink");
|
||||
test_computed_value("text-decoration-line", "underline line-through blink");
|
||||
test_computed_value("text-decoration-line", "overline line-through blink");
|
||||
test_computed_value("text-decoration-line", "underline overline line-through blink");
|
||||
|
||||
// spelling-error
|
||||
test_computed_value("text-decoration-line", "spelling-error");
|
||||
|
||||
// grammar-error
|
||||
test_computed_value("text-decoration-line", "grammar-error");
|
||||
|
||||
</script>
|
|
@ -0,0 +1,20 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration Test: Parsing text-decoration with valid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#propdef-text-decoration">
|
||||
<meta name="assert" content="text-decoration supports the full grammar '<‘text-decoration-line’> || <‘text-decoration-style’> || <‘text-decoration-color’>'.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
<script>
|
||||
test_valid_value("text-decoration", "none");
|
||||
test_valid_value("text-decoration", "line-through");
|
||||
test_valid_value("text-decoration", "solid");
|
||||
test_valid_value("text-decoration", "currentcolor");
|
||||
|
||||
test_valid_value("text-decoration", "double overline underline", "underline overline double");
|
||||
test_valid_value("text-decoration", "underline overline line-through red");
|
||||
test_valid_value("text-decoration", "rgba(10, 20, 30, 0.4) dotted", "dotted rgba(10, 20, 30, 0.4)");
|
||||
|
||||
test_valid_value("text-decoration", "underline dashed green");
|
||||
</script>
|
|
@ -0,0 +1,27 @@
|
|||
<!doctype html>
|
||||
<meta charset="utf-8">
|
||||
<title>margin properties</title>
|
||||
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
|
||||
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
|
||||
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="../../resources/testhelper.js"></script>
|
||||
<script src="resources/testsuite.js"></script>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
for (const prefix of ['margin-', 'inset-', 'padding-']) {
|
||||
for (const suffix of ['block-start', 'block-end', 'inline-start', 'inline-end']) {
|
||||
runPropertyTests(prefix + suffix, [
|
||||
// TODO: Test 'auto'
|
||||
{ syntax: '<percentage>' },
|
||||
{ syntax: '<length>' },
|
||||
]);
|
||||
}
|
||||
}
|
||||
|
||||
// TODO: test shorthands and other logical properties.
|
||||
</script>
|
|
@ -0,0 +1,4 @@
|
|||
<!doctype html>
|
||||
<title>CSS Reftest Reference</title>
|
||||
<p>Clicking the right square should make the left one go green.</p>
|
||||
<div style="width: 100px; height: 100px; background: green;"></div>
|
|
@ -0,0 +1,40 @@
|
|||
<!doctype html>
|
||||
<html class="reftest-wait">
|
||||
<title>Selectors: :hover style cleared on ancestor when hovered element is removed.</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/selectors/#the-hover-pseudo">
|
||||
<link rel="match" href="remove-hovered-element-ref.html">
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
<script src="/resources/testdriver.js"></script>
|
||||
<script src="/resources/testdriver-actions.js"></script>
|
||||
<script src="/resources/testdriver-vendor.js"></script>
|
||||
<style>
|
||||
div {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background: green;
|
||||
}
|
||||
#outer:hover {
|
||||
background-color: red;
|
||||
}
|
||||
#relative {
|
||||
position: relative;
|
||||
left: 150px;
|
||||
}
|
||||
</style>
|
||||
<p>Clicking the right square should make the left one go green.</p>
|
||||
<div id="outer">
|
||||
<div id="relative"><div id="inner">Click me</div></div>
|
||||
</div>
|
||||
<script>
|
||||
inner.addEventListener("click", () => {
|
||||
relative.style.display = "none";
|
||||
// force layout box removal
|
||||
document.body.offsetTop;
|
||||
relative.remove();
|
||||
takeScreenshot();
|
||||
});
|
||||
|
||||
// Hover #inner and click.
|
||||
var actions = new test_driver.Actions();
|
||||
actions.pointerMove(0, 0, {origin: inner}).pointerDown().pointerUp().send();
|
||||
</script>
|
|
@ -14,6 +14,7 @@
|
|||
<body>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
setup({allow_uncaught_exception:true});
|
||||
|
||||
class PredefinedCustomElement extends HTMLElement {}
|
||||
customElements.define('predefined-custom-element', PredefinedCustomElement);
|
||||
|
@ -185,6 +186,23 @@ document_types().filter(function (entry) { return !entry.isOwner && entry.hasBro
|
|||
|
||||
});
|
||||
|
||||
test(() => {
|
||||
class ShadowDisabledElement extends HTMLElement {
|
||||
static get disabledFeatures() { return ['shadow']; }
|
||||
}
|
||||
let error = null;
|
||||
window.addEventListener('error', e => { error = e.error; }, {once: true});
|
||||
let element = document.createElement('shadow-disabled');
|
||||
element.attachShadow({mode: 'open'});
|
||||
customElements.define('shadow-disabled', ShadowDisabledElement);
|
||||
customElements.upgrade(element);
|
||||
assert_false(element instanceof ShadowDisabledElement,
|
||||
'Upgrading should fail.');
|
||||
assert_true(error instanceof DOMException);
|
||||
assert_equals(error.name, 'NotSupportedError');
|
||||
}, 'If definition\'s disable shadow is true and element\'s shadow root is ' +
|
||||
'non-null, then throw a "NotSupportedError" DOMException.');
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -0,0 +1,494 @@
|
|||
<!doctype html>
|
||||
<meta charset=utf-8>
|
||||
<title>Test that execCommand without editable element</title>
|
||||
<script src=../include/implementation.js></script>
|
||||
<script>var testsJsLibraryOnly = true</script>
|
||||
<script src=../include/tests.js></script>
|
||||
<script src=/resources/testharness.js></script>
|
||||
<script src=/resources/testharnessreport.js></script>
|
||||
<div contenteditable id="editor">abc</div>
|
||||
<iframe srcdoc="<div contenteditable id='editor'>def</div><span>ghi</span>"></iframe>
|
||||
<script>
|
||||
"use strict";
|
||||
|
||||
setup({explicit_done: true});
|
||||
|
||||
// This test calls execCommand() without editable element in the document,
|
||||
// but its parent or child document has editable element and it has focus.
|
||||
// In most cases, execCommand() should do nothing and return false. However,
|
||||
// "cut", "copy", "paste" and "selectall" commands should work without DOM tree
|
||||
// modification for making web apps can implement their own editor without
|
||||
// editable element.
|
||||
function runTests() {
|
||||
let parentWindow = window;
|
||||
let parentDocument = document;
|
||||
let parentSelection = parentDocument.getSelection();
|
||||
let parentEditor = parentDocument.getElementById("editor");
|
||||
parentEditor.focus();
|
||||
let iframe = document.getElementsByTagName("iframe")[0];
|
||||
let childWindow = iframe.contentWindow;
|
||||
let childDocument = iframe.contentDocument;
|
||||
let childSelection = childDocument.getSelection();
|
||||
let childEditor = childDocument.getElementById("editor");
|
||||
childEditor.focus();
|
||||
|
||||
// execCommand() in child document shouldn't affect to focused parent
|
||||
// document.
|
||||
doTest(parentWindow, parentDocument, parentSelection, parentEditor,
|
||||
childWindow, childDocument, childSelection, childEditor, false);
|
||||
// execCommand() in parent document shouldn't affect to focused child
|
||||
// document but "cut" and "copy" may affect the focused child document.
|
||||
doTest(childWindow, childDocument, childSelection, childEditor,
|
||||
parentWindow, parentDocument, parentSelection, parentEditor, true);
|
||||
|
||||
done();
|
||||
}
|
||||
|
||||
function doTest(aFocusWindow, aFocusDocument, aFocusSelection, aFocusEditor,
|
||||
aExecWindow, aExecDocument, aExecSelection, aExecEditor,
|
||||
aExecInParent) {
|
||||
const kTests = [
|
||||
/**
|
||||
* command: The command which you test.
|
||||
* focusContent: Will be set to innerHTML of div#editor element in focused
|
||||
* document.
|
||||
* execContent: Will be set to innerHTML of div#editor element in the
|
||||
* document whose execCommand() will be called.
|
||||
* initFunc: [optional] If you need to do something before running the
|
||||
* test, you can do it with a function.
|
||||
* expectedFocusContent: Expected content and selection in div#editor in
|
||||
* focused document after calling execCommand().
|
||||
* expectedExecContent: Expected content and selection in div#editor in
|
||||
* the document whose execCommand() is called.
|
||||
* event: The event which you need to check whether it's fired or not.
|
||||
* expectedFiredInFocus: true if the event should be fired on the focused
|
||||
* document node.
|
||||
* expectedFiredInExec: true if the event should be fired on the document
|
||||
* node whose execCommand() is called.
|
||||
* expectedResult: Expected result of execCommand().
|
||||
*/
|
||||
{command: "bold", value: "bold",
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "italic", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "underline", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "strikethrough", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "subscript", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "superscript", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
// "cut", "copy" and "paste" command should cause firing corresponding
|
||||
// events to make web apps be able to implement their own editor even
|
||||
// if there is no editor and selection is collapsed.
|
||||
{command: "cut", value: null,
|
||||
focusContent: "a[b]c", execContent: "ab[]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "ab[]c",
|
||||
event: "cut", expectedFiredInFocus: false, expectedFiredInExec: true,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "cut", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "cut", expectedFiredInFocus: false, expectedFiredInExec: true,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "copy", value: null,
|
||||
focusContent: "a[b]c", execContent: "ab[]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "ab[]c",
|
||||
event: "copy", expectedFiredInFocus: false, expectedFiredInExec: true,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "copy", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "copy", expectedFiredInFocus: false, expectedFiredInExec: true,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "paste", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
initFunc: () => { aFocusDocument.execCommand("copy", false, "b"); },
|
||||
event: "paste", expectedFiredInFocus: false, expectedFiredInExec: true,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "delete", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "forwarddelete", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
// "selectall" command should be available without editable content.
|
||||
{command: "selectall", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "[abc",
|
||||
event: "selectionchange", expectedFiredInFocus: false, expectedFiredInExec: true,
|
||||
expectedResult: true,
|
||||
},
|
||||
{command: "undo", value: null,
|
||||
focusContent: "a[]c", execContent: "a[b]c",
|
||||
initFunc: () => { aFocusDocument.execCommand("insertText", false, "b"); },
|
||||
expectedFocusContent: "ab[]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "redo", value: null,
|
||||
focusContent: "a[]c", execContent: "a[b]c",
|
||||
initFunc: () => {
|
||||
aFocusDocument.execCommand("insertText", false, "b");
|
||||
aFocusDocument.execCommand("undo", false, null);
|
||||
},
|
||||
expectedFocusContent: "a[]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "indent", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "outdent", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "backcolor", value: "#000000",
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "forecolor", value: "#F0F0F0",
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "hilitecolor", value: "#FFFF00",
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "fontname", value: "DummyFont",
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "fontsize", value: "5",
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "increasefontsize", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "decreasefontsize", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "inserthorizontalrule", value: null,
|
||||
focusContent: "a[]bc", execContent: "a[]bc",
|
||||
expectedFocusContent: "a[]bc", expectedExecContent: "a[]bc",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "createlink", value: "foo.html",
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "insertimage", value: "no-image.png",
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "inserthtml", value: "<b>inserted</b>",
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "inserttext", value: "**inserted**",
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "justifyleft", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "justifyright", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "justifycenter", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "justifyfull", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "removeformat", value: null,
|
||||
focusContent: "<b>a[b]c</b>", execContent: "<b>a[b]c</b>",
|
||||
expectedFocusContent: "<b>a[b]c</b>", expectedExecContent: "<b>a[b]c</b>",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "unlink", value: null,
|
||||
focusContent: "<a href=\"foo.html\">a[b]c</a>", execContent: "<a href=\"foo.html\">a[b]c</a>",
|
||||
expectedFocusContent: "<a href=\"foo.html\">a[b]c</a>", expectedExecContent: "<a href=\"foo.html\">a[b]c</a>",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "insertorderedlist", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "insertunorderedlist", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "insertparagraph", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "insertlinebreak", value: null,
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "formatblock", value: "div",
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "heading", value: "h1",
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedFocusContent: "a[b]c", expectedExecContent: "a[b]c",
|
||||
event: "input", expectedFiredInFocus: false, expectedFiredInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
/**
|
||||
* command: The command which you test.
|
||||
* state: The state which is used with execCommand().
|
||||
* initState: The state which should be set with execCommand() first.
|
||||
* focusContent: Will be set to innerHTML of div#editor element in focused
|
||||
* document.
|
||||
* execContent: Will be set to innerHTML of div#editor element in the
|
||||
* document whose execCommand() will be called.
|
||||
* initFunc: [optional] If you need to do something before running the
|
||||
* test, you can do it with a function.
|
||||
* expectedSetStateInFocus: Expected queryCommandState() result in focused
|
||||
* document.
|
||||
* expectedSetStateInExec: Expected queryCommandState() result in document
|
||||
* whose execCommand() is called.
|
||||
* expectedResult: Expected result of execCommand().
|
||||
*/
|
||||
{command: "styleWithCSS", state: "true", initState: "false",
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedSetStateInFocus: false, expectedSetStateInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "contentReadOnly", state: "true", initState: "false",
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedSetStateInFocus: false, expectedSetStateInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "insertBrOnReturn", state: "true", initState: "false",
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedSetStateInFocus: false, expectedSetStateInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "defaultParagraphSeparator", state: "div", initState: "p",
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedSetStateInFocus: false, expectedSetStateInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "defaultParagraphSeparator", state: "p", initState: "div",
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedSetStateInFocus: false, expectedSetStateInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "enableObjectResizing", state: "true", initState: "false",
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedSetStateInFocus: false, expectedSetStateInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "enableInlineTableEditing", state: "true", initState: "false",
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedSetStateInFocus: false, expectedSetStateInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
{command: "enableAbsolutePositionEditing", state: "true", initState: "false",
|
||||
focusContent: "a[b]c", execContent: "a[b]c",
|
||||
expectedSetStateInFocus: false, expectedSetStateInExec: false,
|
||||
expectedResult: false,
|
||||
},
|
||||
];
|
||||
|
||||
for (const kTest of kTests) {
|
||||
// Skip unsupported command since it's not purpose of this tests whether
|
||||
// each command is supported on the browser.
|
||||
if (!aExecDocument.queryCommandSupported(kTest.command)) {
|
||||
continue;
|
||||
}
|
||||
aExecEditor.removeAttribute("contenteditable"); // Disable commands in the exec document.
|
||||
let points = setupDiv(aFocusEditor, kTest.focusContent);
|
||||
aFocusSelection.setBaseAndExtent(points[0], points[1], points[2], points[3]);
|
||||
points = setupDiv(aExecEditor, kTest.execContent);
|
||||
aExecSelection.setBaseAndExtent(points[0], points[1], points[2], points[3]);
|
||||
aFocusWindow.focus();
|
||||
aFocusEditor.focus();
|
||||
if (kTest.initFunc) {
|
||||
kTest.initFunc();
|
||||
}
|
||||
if (kTest.state === undefined) {
|
||||
let eventFiredOnFocusDocument = false;
|
||||
function handlerOnFocusDocument() {
|
||||
eventFiredOnFocusDocument = true;
|
||||
}
|
||||
aFocusDocument.addEventListener(kTest.event, handlerOnFocusDocument, {capture: true});
|
||||
let eventFiredOnExecDocument = false;
|
||||
function handlerOnExecDocument() {
|
||||
eventFiredOnExecDocument = true;
|
||||
}
|
||||
aExecDocument.addEventListener(kTest.event, handlerOnExecDocument, {capture: true});
|
||||
const kDescription = `${aExecInParent ? "Parent" : "Child"}Document.execCommand(${kTest.command}, false, ${kTest.value}) with ${kTest.execContent}`;
|
||||
test(function () {
|
||||
let ret = aExecDocument.execCommand(kTest.command, false, kTest.value);
|
||||
assert_equals(ret, kTest.expectedResult, `execCommand should return ${kTest.expectedResult}`);
|
||||
}, `${kDescription}: calling execCommand`);
|
||||
test(function () {
|
||||
assert_equals(eventFiredOnFocusDocument, kTest.expectedFiredInFocus,
|
||||
`"${kTest.event}" event should${kTest.expectedFiredInFocus ? "" : " not"} be fired`);
|
||||
}, `${kDescription}: checking event on focused document`);
|
||||
test(function () {
|
||||
assert_equals(eventFiredOnExecDocument, kTest.expectedFiredInExec,
|
||||
`"${kTest.event}" event should${kTest.expectedFiredInExec ? "" : " not"} be fired`);
|
||||
}, `${kDescription}: checking event on executed document`);
|
||||
test(function () {
|
||||
if (aFocusSelection.rangeCount) {
|
||||
addBrackets(aFocusSelection.getRangeAt(0));
|
||||
}
|
||||
assert_equals(aFocusEditor.innerHTML, kTest.expectedFocusContent);
|
||||
}, `${kDescription}: checking result content in focused document`);
|
||||
test(function () {
|
||||
if (aExecSelection.rangeCount) {
|
||||
addBrackets(aExecSelection.getRangeAt(0));
|
||||
}
|
||||
assert_equals(aExecEditor.innerHTML, kTest.expectedExecContent);
|
||||
}, `${kDescription}: checking result content in executed document`);
|
||||
aFocusDocument.removeEventListener(kTest.event, handlerOnFocusDocument, {capture: true});
|
||||
aExecDocument.removeEventListener(kTest.event, handlerOnExecDocument, {capture: true});
|
||||
aExecEditor.setAttribute("contenteditable", "");
|
||||
} else {
|
||||
const kDescription = `${aExecInParent ? "Parent" : "Child"}Document.execCommand(${kTest.command}, false, ${kTest.state})`;
|
||||
test(function () {
|
||||
let ret = aExecDocument.execCommand(kTest.command, false, kTest.initState);
|
||||
assert_equals(ret, kTest.expectedResult, `execCommand should return ${kTest.expectedResult}`);
|
||||
}, `${kDescription}: calling execCommand to initialize`);
|
||||
let hasSetState = false;
|
||||
test(function () {
|
||||
hasSetState = aExecDocument.queryCommandState(kTest.command);
|
||||
assert_equals(hasSetState, kTest.expectedSetStateInExec, `queryCommandState on executed document should return ${kTest.expectedSetState}`);
|
||||
}, `${kDescription}: calling queryCommandState on executed document after initializing`);
|
||||
test(function () {
|
||||
let ret = aFocusDocument.queryCommandState(kTest.command);
|
||||
assert_equals(ret, kTest.expectedSetStateInFocus, `queryCommandState on focus document should return ${kTest.expectedSetState}`);
|
||||
}, `${kDescription}: calling queryCommandState on focus document after initializing`);
|
||||
if (hasSetState) {
|
||||
test(function () {
|
||||
let ret = aExecDocument.queryCommandValue(kTest.command);
|
||||
assert_equals(ret, kTest.initState, `queryCommandValue on executed document should return ${kTest.initState}`);
|
||||
}, `${kDescription}: calling queryCommandValue on executed document after initializing`);
|
||||
}
|
||||
test(function () {
|
||||
let ret = aExecDocument.execCommand(kTest.command, false, kTest.state);
|
||||
assert_equals(ret, kTest.expectedResult, `execCommand should return ${kTest.expectedResult}`);
|
||||
}, `${kDescription}: calling execCommand to set state`);
|
||||
test(function () {
|
||||
hasSetState = aExecDocument.queryCommandState(kTest.command);
|
||||
assert_equals(hasSetState, kTest.expectedSetStateInExec, `queryCommandState should return ${kTest.expectedSetState}`);
|
||||
}, `${kDescription}: calling queryCommandState on executed document`);
|
||||
test(function () {
|
||||
let ret = aFocusDocument.queryCommandState(kTest.command);
|
||||
assert_equals(ret, kTest.expectedSetStateInFocus, `queryCommandState should return ${kTest.expectedSetState}`);
|
||||
}, `${kDescription}: calling queryCommandState on focused document`);
|
||||
if (hasSetState) {
|
||||
test(function () {
|
||||
let ret = aExecDocument.queryCommandValue(kTest.command);
|
||||
assert_equals(ret, kTest.state, `queryCommandValue should return ${kTest.initState}`);
|
||||
}, `${kDescription}: calling queryCommandValue on executed document`);
|
||||
}
|
||||
aExecEditor.setAttribute("contenteditable", "");
|
||||
test(function () {
|
||||
let ret = aExecDocument.queryCommandState(kTest.command);
|
||||
assert_equals(ret, kTest.expectedSetStateInExec, `queryCommandState should return ${kTest.expectedSetState}`);
|
||||
}, `${kDescription}: calling queryCommandState on executed document after making executed document editable`);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
window.addEventListener("load", runTests, {once: true});
|
||||
</script>
|
|
@ -10,3 +10,10 @@ test(() => {
|
|||
"' are repeated or they are not in alphabetical order.")
|
||||
}
|
||||
}, "supportedEntryTypes exists and returns entries in alphabetical order");
|
||||
|
||||
test(() => {
|
||||
if (typeof PerformanceObserver.supportedEntryTypes === "undefined")
|
||||
assert_unreached("supportedEntryTypes is not supported.");
|
||||
assert_true(PerformanceObserver.supportedEntryTypes ===
|
||||
PerformanceObserver.supportedEntryTypes);
|
||||
}, "supportedEntryTypes caches result");
|
||||
|
|
|
@ -39,15 +39,6 @@ promise_test(t => {
|
|||
.then(e => {
|
||||
assert_equals(e.data, 'quit');
|
||||
return registration.unregister(scope);
|
||||
})
|
||||
.then(() => { return wait_for_state(t, worker, 'redundant'); })
|
||||
.then(() => {
|
||||
assert_equals(worker.state, 'redundant');
|
||||
assert_throws(
|
||||
{name:'InvalidStateError'},
|
||||
function() { worker.postMessage(''); },
|
||||
'Calling postMessage on a redundant ServiceWorker should ' +
|
||||
'throw InvalidStateError.');
|
||||
});
|
||||
}, 'postMessage to a ServiceWorker (and back via MessagePort)');
|
||||
|
||||
|
@ -178,4 +169,34 @@ promise_test(t => {
|
|||
});
|
||||
}, 'postMessage with dictionary a transferable ArrayBuffer between ServiceWorker and Client');
|
||||
|
||||
promise_test(async t => {
|
||||
const firstScript = 'resources/postmessage-echo-worker.js?one';
|
||||
const secondScript = 'resources/postmessage-echo-worker.js?two';
|
||||
const scope = 'resources/';
|
||||
|
||||
const registration = await service_worker_unregister_and_register(t, firstScript, scope);
|
||||
t.add_cleanup(() => registration.unregister());
|
||||
const firstWorker = registration.installing;
|
||||
|
||||
const messagePromise = new Promise(resolve => {
|
||||
navigator.serviceWorker.addEventListener('message', (event) => {
|
||||
resolve(event.data);
|
||||
}, {once: true});
|
||||
});
|
||||
|
||||
await wait_for_state(t, firstWorker, 'activated');
|
||||
await navigator.serviceWorker.register(secondScript, {scope});
|
||||
const secondWorker = registration.installing;
|
||||
await wait_for_state(t, firstWorker, 'redundant');
|
||||
|
||||
// postMessage() to a redundant worker should be dropped silently.
|
||||
// Historically, this threw an exception.
|
||||
firstWorker.postMessage('firstWorker');
|
||||
|
||||
// To test somewhat that it was not received, send a message to another
|
||||
// worker and check that we get a reply for that one.
|
||||
secondWorker.postMessage('secondWorker');
|
||||
const data = await messagePromise;
|
||||
assert_equals(data, 'secondWorker');
|
||||
}, 'postMessage to a redundant worker');
|
||||
</script>
|
||||
|
|
|
@ -0,0 +1,3 @@
|
|||
self.addEventListener('message', event => {
|
||||
event.source.postMessage(event.data);
|
||||
});
|
|
@ -10,7 +10,7 @@ promise_test(async function(t) {
|
|||
const registration = await service_worker_unregister_and_register(t, worker_url, scope);
|
||||
t.add_cleanup(() => registration.unregister());
|
||||
|
||||
await wait_for_state(t, r.installing, 'activated');
|
||||
await wait_for_state(t, registration.installing, 'activated');
|
||||
await registration.unregister();
|
||||
const newRegistration = await navigator.serviceWorker.register(worker_url, { scope });
|
||||
t.add_cleanup(() => newRegistration.unregister());
|
||||
|
|
|
@ -28,7 +28,12 @@ tmpdir=$(mktemp -d)
|
|||
echo -n OCSP >$tmpdir/ocsp
|
||||
gen-certurl -pem $certfile -ocsp $tmpdir/ocsp > $certfile.cbor
|
||||
|
||||
cert_base64=$(base64 -w 0 $certfile.cbor)
|
||||
option="-w 0"
|
||||
if [ "$(uname -s)" = "Darwin" ]; then
|
||||
option=""
|
||||
fi
|
||||
|
||||
cert_base64=$(base64 ${option} ${certfile}.cbor)
|
||||
data_cert_url="data:application/cert-chain+cbor;base64,$cert_base64"
|
||||
|
||||
|
||||
|
|
|
@ -0,0 +1,95 @@
|
|||
<!doctype HTML>
|
||||
<head>
|
||||
<link rel="help" href="https://www.w3.org/TR/SVG/coords.html#SizingSVGInCSS">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-sizing-3/#intrinsic-sizes">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<style>
|
||||
#wrapper {
|
||||
width: 500px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<svg id="mySVG"></svg>
|
||||
</div>
|
||||
<script>
|
||||
let svgElem = document.getElementById("mySVG");
|
||||
function expect_svg_width_and_height(width, height) {
|
||||
let rect = svgElem.getBoundingClientRect();
|
||||
assert_equals(rect.width, width, "checking width.");
|
||||
assert_equals(rect.height, height, "checking height.");
|
||||
}
|
||||
test(function() {
|
||||
expect_svg_width_and_height(300, 150);
|
||||
}, "no sizing attributes set");
|
||||
|
||||
// Just setting width and/or height:
|
||||
test(function() {
|
||||
svgElem.setAttribute("width", "100");
|
||||
expect_svg_width_and_height(100, 150);
|
||||
}, "specified width");
|
||||
test(function() {
|
||||
svgElem.setAttribute("width", "400");
|
||||
expect_svg_width_and_height(400, 150);
|
||||
}, "modified specified width");
|
||||
|
||||
test(function() {
|
||||
// (set height, leaving width still set)
|
||||
svgElem.setAttribute("height", "100");
|
||||
expect_svg_width_and_height(400, 100);
|
||||
}, "specified width and height");
|
||||
test(function() {
|
||||
svgElem.setAttribute("height", "200");
|
||||
expect_svg_width_and_height(400, 200);
|
||||
}, "specified width and modified specified height");
|
||||
test(function() {
|
||||
svgElem.removeAttribute("width"); // leaving only 'height':
|
||||
expect_svg_width_and_height(300, 200);
|
||||
}, "specified height");
|
||||
test(function() {
|
||||
svgElem.setAttribute("height", "250");
|
||||
expect_svg_width_and_height(300, 250);
|
||||
}, "modified specified height");
|
||||
test(function() {
|
||||
// clean up (go back to having no sizing attrs set)
|
||||
svgElem.removeAttribute("height");
|
||||
expect_svg_width_and_height(300, 150);
|
||||
}, "no specified sizing attrs (after setting & removing them)");
|
||||
|
||||
|
||||
// Just setting viewBox:
|
||||
test(function() {
|
||||
svgElem.setAttribute("viewBox", "0 0 10 8");
|
||||
expect_svg_width_and_height(500, 400);
|
||||
}, "set a 10x8 viewBox");
|
||||
test(function() {
|
||||
// Adjusting already-set viewBox:
|
||||
svgElem.setAttribute("viewBox", "0 0 50 10");
|
||||
expect_svg_width_and_height(500, 100);
|
||||
}, "modified viewBox to 50x20");
|
||||
test(function() {
|
||||
svgElem.setAttribute("width", "100");
|
||||
expect_svg_width_and_height(100, 20);
|
||||
}, "adding specified width, in presence of specified viewBox");
|
||||
test(function() {
|
||||
svgElem.setAttribute("viewBox", "0 0 40 30");
|
||||
expect_svg_width_and_height(100, 75);
|
||||
}, "modifiying specified viewBox, in presence of specified width");
|
||||
|
||||
test(function() {
|
||||
svgElem.removeAttribute("width");
|
||||
expect_svg_width_and_height(500, 375);
|
||||
}, "removing specified width, in presence of specified viewBox");
|
||||
|
||||
test(function() {
|
||||
svgElem.setAttribute("height", "60");
|
||||
expect_svg_width_and_height(80, 60);
|
||||
}, "adding specified height, in presence of specified viewBox");
|
||||
test(function() {
|
||||
svgElem.setAttribute("viewBox", "0 0 100 120");
|
||||
expect_svg_width_and_height(50, 60);
|
||||
}, "modifiying specified viewBox, in presence of specified height");
|
||||
</script>
|
||||
</body>
|
|
@ -0,0 +1,103 @@
|
|||
<!doctype HTML>
|
||||
<head>
|
||||
<link rel="help" href="https://www.w3.org/TR/SVG/coords.html#SizingSVGInCSS">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-sizing-3/#intrinsic-sizes">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<style>
|
||||
#wrapper {
|
||||
width: 500px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<object id="myObj" data="support/simple.svg"
|
||||
onload="go()"></object>
|
||||
</div>
|
||||
<script>
|
||||
let objElem = document.getElementById("myObj");
|
||||
let svgElem; // initialized after obj doc loads
|
||||
|
||||
function expect_svg_width_and_height(width, height) {
|
||||
let rect = objElem.getBoundingClientRect();
|
||||
assert_equals(rect.width, width, "checking width.");
|
||||
assert_equals(rect.height, height, "checking height.");
|
||||
}
|
||||
|
||||
function go() {
|
||||
svgElem = objElem.contentDocument.documentElement;
|
||||
|
||||
test(function() {
|
||||
expect_svg_width_and_height(300, 150);
|
||||
}, "no sizing attributes set");
|
||||
|
||||
// Just setting width and/or height:
|
||||
test(function() {
|
||||
svgElem.setAttribute("width", "100");
|
||||
expect_svg_width_and_height(100, 150);
|
||||
}, "specified width");
|
||||
test(function() {
|
||||
svgElem.setAttribute("width", "400");
|
||||
expect_svg_width_and_height(400, 150);
|
||||
}, "modified specified width");
|
||||
|
||||
test(function() {
|
||||
// (set height, leaving width still set)
|
||||
svgElem.setAttribute("height", "100");
|
||||
expect_svg_width_and_height(400, 100);
|
||||
}, "specified width and height");
|
||||
test(function() {
|
||||
svgElem.setAttribute("height", "200");
|
||||
expect_svg_width_and_height(400, 200);
|
||||
}, "specified width and modified specified height");
|
||||
test(function() {
|
||||
svgElem.removeAttribute("width"); // leaving only 'height':
|
||||
expect_svg_width_and_height(300, 200);
|
||||
}, "specified height");
|
||||
test(function() {
|
||||
svgElem.setAttribute("height", "250");
|
||||
expect_svg_width_and_height(300, 250);
|
||||
}, "modified specified height");
|
||||
test(function() {
|
||||
// clean up (go back to having no sizing attrs set)
|
||||
svgElem.removeAttribute("height");
|
||||
expect_svg_width_and_height(300, 150);
|
||||
}, "no specified sizing attrs (after setting & removing them)");
|
||||
|
||||
|
||||
// Just setting viewBox:
|
||||
test(function() {
|
||||
svgElem.setAttribute("viewBox", "0 0 10 8");
|
||||
expect_svg_width_and_height(500, 400);
|
||||
}, "set a 10x8 viewBox");
|
||||
test(function() {
|
||||
// Adjusting already-set viewBox:
|
||||
svgElem.setAttribute("viewBox", "0 0 50 10");
|
||||
expect_svg_width_and_height(500, 100);
|
||||
}, "modified viewBox to 50x20");
|
||||
test(function() {
|
||||
svgElem.setAttribute("width", "100");
|
||||
expect_svg_width_and_height(100, 20);
|
||||
}, "adding specified width, in presence of specified viewBox");
|
||||
test(function() {
|
||||
svgElem.setAttribute("viewBox", "0 0 40 30");
|
||||
expect_svg_width_and_height(100, 75);
|
||||
}, "modifiying specified viewBox, in presence of specified width");
|
||||
|
||||
test(function() {
|
||||
svgElem.removeAttribute("width");
|
||||
expect_svg_width_and_height(500, 375);
|
||||
}, "removing specified width, in presence of specified viewBox");
|
||||
|
||||
test(function() {
|
||||
svgElem.setAttribute("height", "60");
|
||||
expect_svg_width_and_height(80, 60);
|
||||
}, "adding specified height, in presence of specified viewBox");
|
||||
test(function() {
|
||||
svgElem.setAttribute("viewBox", "0 0 100 120");
|
||||
expect_svg_width_and_height(50, 60);
|
||||
}, "modifiying specified viewBox, in presence of specified height");
|
||||
};
|
||||
</script>
|
||||
</body>
|
|
@ -0,0 +1,2 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg">
|
||||
</svg>
|
After Width: | Height: | Size: 48 B |
|
@ -0,0 +1,7 @@
|
|||
<!doctype html>
|
||||
<title>Render is synchronized with font-size change</title>
|
||||
<svg width="400" height="400" style="font-size:20px">
|
||||
<rect width="5em" height="5em" rx="5px" ry="5px" fill="magenta" />
|
||||
<circle cx="10em" cy="5em" r="4em" fill="purple" />
|
||||
<line y1="6em" x2="15em" y2="6em" stroke="skyblue" />
|
||||
</svg>
|
|
@ -0,0 +1,21 @@
|
|||
<!doctype html>
|
||||
<html class="reftest-wait">
|
||||
<title>Render is synchronized with font-size change</title>
|
||||
<link rel="match" href="render-sync-with-font-size-ref.html">
|
||||
<svg width="400" height="400" style="font-size:10px" onload="main()">
|
||||
<rect width="5em" height="5em" rx="5px" ry="5px" fill="magenta" />
|
||||
<circle cx="10em" cy="5em" r="4em" fill="purple" />
|
||||
<line y1="6em" x2="15em" y2="6em" stroke="skyblue" />
|
||||
</svg>
|
||||
<script>
|
||||
function main() {
|
||||
window.requestAnimationFrame(() => {
|
||||
let s = document.querySelector("svg");
|
||||
s.style.fontSize = "20px";
|
||||
window.requestAnimationFrame(() => {
|
||||
document.documentElement.removeAttribute("class");
|
||||
});
|
||||
});
|
||||
};
|
||||
</script>
|
||||
</html>
|
|
@ -222,7 +222,11 @@ function coupleIceCandidates(pc1, pc2) {
|
|||
}
|
||||
|
||||
// Helper function for doing one round of offer/answer exchange
|
||||
// between two local peer connections
|
||||
// between two local peer connections.
|
||||
// Calls setRemoteDescription(offer/answer) before
|
||||
// setLocalDescription(offer/answer) to ensure the remote description
|
||||
// is set and candidates can be added before the local peer connection
|
||||
// starts generating candidates and ICE checks.
|
||||
async function doSignalingHandshake(localPc, remotePc, options={}) {
|
||||
let offer = await localPc.createOffer();
|
||||
// Modify offer if callback has been provided
|
||||
|
@ -230,9 +234,9 @@ async function doSignalingHandshake(localPc, remotePc, options={}) {
|
|||
offer = await options.modifyOffer(offer);
|
||||
}
|
||||
|
||||
// Apply offer
|
||||
await localPc.setLocalDescription(offer);
|
||||
// Apply offer.
|
||||
await remotePc.setRemoteDescription(offer);
|
||||
await localPc.setLocalDescription(offer);
|
||||
|
||||
let answer = await remotePc.createAnswer();
|
||||
// Modify answer if callback has been provided
|
||||
|
@ -240,7 +244,7 @@ async function doSignalingHandshake(localPc, remotePc, options={}) {
|
|||
answer = await options.modifyAnswer(answer);
|
||||
}
|
||||
|
||||
// Apply answer. Note: localPc should enter stable state first.
|
||||
// Apply answer.
|
||||
await localPc.setRemoteDescription(answer);
|
||||
await remotePc.setLocalDescription(answer);
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue