mirror of
https://github.com/servo/servo.git
synced 2025-08-06 14:10:11 +01:00
Update web-platform-tests to revision 3840f46213d9a991acc9288e3863530f7502c05e
This commit is contained in:
parent
347d8bdf72
commit
141ba90a6d
58 changed files with 1507 additions and 883 deletions
|
@ -0,0 +1,19 @@
|
|||
<!doctype HTML>
|
||||
<link rel="author" title="Chris Harrelson" href="chrishtr@chromium.org">
|
||||
<style>
|
||||
#one, #two {
|
||||
width: 200px; height: 200px; background: lightblue; position: relative
|
||||
}
|
||||
#one {
|
||||
background: lightblue
|
||||
}
|
||||
#two {
|
||||
background: lightgray;
|
||||
margin-top: -200px;
|
||||
}
|
||||
</style>
|
||||
<div id=scroller style="overflow: scroll; width: 300px; height: 300px; will-change: transform">
|
||||
<div id=one></div>
|
||||
<div id=two></div>
|
||||
<div id=spacer style="width: 50px; height: 5000px"></div>
|
||||
</div>
|
|
@ -0,0 +1,39 @@
|
|||
<!doctype HTML>
|
||||
<link rel="author" title="Chris Harrelson" href="chrishtr@chromium.org">
|
||||
<link rel="match" href="composite-change-after-scroll-preserves-stacking-order-ref.html">
|
||||
<link rel="help" href="https://www.w3.org/TR/CSS2/zindex.html"/>
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
<script src="/web-animations/testcommon.js"></script>
|
||||
<style>
|
||||
#one, #two {
|
||||
width: 200px; height: 200px; background: lightblue; position: relative
|
||||
}
|
||||
#one {
|
||||
background: lightblue
|
||||
}
|
||||
#two {
|
||||
background: lightgray;
|
||||
margin-top: -200px;
|
||||
}
|
||||
</style>
|
||||
<html class=reftest-wait>
|
||||
<div id=scroller style="overflow: scroll; width: 300px; height: 300px; will-change: transform">
|
||||
<div id=one></div>
|
||||
<div id=two></div>
|
||||
<div id=spacer style="width: 50px; height: 5000px"></div>
|
||||
</div>
|
||||
</html>
|
||||
<script>
|
||||
onload = () => {
|
||||
waitForAnimationFrames(2).then(() => {
|
||||
scroller.scrollBy(0, 1000);
|
||||
waitForAnimationFrames(2).then(() => {
|
||||
one.style = 'will-change: transform';
|
||||
waitForAnimationFrames(2).then(() => {
|
||||
scroller.scrollBy(0, -1000);
|
||||
takeScreenshot();
|
||||
});
|
||||
});
|
||||
});
|
||||
};
|
||||
</script>
|
|
@ -11,7 +11,7 @@
|
|||
width: 100%;
|
||||
height: 100%;
|
||||
background: green;
|
||||
border-radius: 50px;
|
||||
border-radius: 99px;
|
||||
}
|
||||
</style>
|
||||
<p>Should be a green circle below</p>
|
||||
|
|
|
@ -40,7 +40,7 @@ container.style.color = currentColor;
|
|||
assert_not_inherited('background-attachment', 'scroll', 'fixed');
|
||||
assert_not_inherited('background-clip', 'border-box', 'padding-box');
|
||||
assert_not_inherited('background-color', transparentColor, 'rgb(42, 53, 64)');
|
||||
assert_not_inherited('background-image', 'none', 'url("https://example.com/")');
|
||||
assert_not_inherited('background-image', 'none', 'url("https://{{host}}/")');
|
||||
assert_not_inherited('background-origin', 'padding-box', 'content-box');
|
||||
assert_not_inherited('background-position', '0% 0%', '10px 20px');
|
||||
assert_not_inherited('background-position-x', '0%', '10px');
|
||||
|
@ -57,7 +57,7 @@ assert_not_inherited('border-bottom-width', mediumWidth, '10px');
|
|||
assert_not_inherited('border-image-outset', '0', '1px 2px 3px 4px');
|
||||
assert_not_inherited('border-image-repeat', 'stretch', 'repeat round');
|
||||
assert_not_inherited('border-image-slice', '100%', '1% 2% 3% 4% fill');
|
||||
assert_not_inherited('border-image-source', 'none', 'url("https://example.com/")');
|
||||
assert_not_inherited('border-image-source', 'none', 'url("https://{{host}}/")');
|
||||
assert_not_inherited('border-image-width', '1', '1px 2px 3px 4px');
|
||||
|
||||
assert_not_inherited('border-left-color', currentColor, 'rgb(42, 53, 64)');
|
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Containment Test: Size containment on select</title>
|
||||
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain-1/#containment-size">
|
||||
<link rel="match" href="reference/contain-size-select-001-ref.html">
|
||||
<meta name=assert content="Check that setting 'contain: size' on a <select> elements causes it to be sized as having no contents.">
|
||||
<style>
|
||||
select {
|
||||
color: white;
|
||||
background: white;
|
||||
}
|
||||
</style>
|
||||
<p>Test passes if it has the same output than the reference.</p>
|
||||
<select id="target">
|
||||
<option>AVeryLongOption</option>
|
||||
<option>Another Option</option>
|
||||
</select>
|
||||
<script>
|
||||
window.requestAnimationFrame( () => {
|
||||
target.style.contain = "size";
|
||||
});
|
||||
</script>
|
|
@ -11,6 +11,7 @@
|
|||
<meta name="assert" content="Test checks that css properties of grid layout exist.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
|
||||
<style>
|
||||
#container {
|
||||
width: 800px;
|
||||
|
@ -34,6 +35,8 @@
|
|||
</div>
|
||||
|
||||
<script>
|
||||
setup({explicit_done: true});
|
||||
document.fonts.ready.then(()=> {
|
||||
var myDiv = document.getElementById('myDiv')
|
||||
|
||||
test(function(){
|
||||
|
@ -228,6 +231,8 @@
|
|||
'reset': ['auto', 'auto'],
|
||||
},
|
||||
})
|
||||
done();
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -0,0 +1,79 @@
|
|||
<!DOCTYPE html>
|
||||
<head>
|
||||
<title>CSS Reference: min/max-content size on box-decoration-break:clone inline box with bidi text and white-space:nowrap</title>
|
||||
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||
<style>
|
||||
html,body {
|
||||
color:black; background-color:white; font:10px/1 monospace; padding:0; margin:0;
|
||||
}
|
||||
|
||||
div {
|
||||
border: 5px solid blue;
|
||||
white-space: pre;
|
||||
}
|
||||
.max > div {
|
||||
width: -moz-max-content;
|
||||
width: -webkit-max-content;
|
||||
width: max-content;
|
||||
}
|
||||
|
||||
span {
|
||||
border: 2px solid gray;
|
||||
padding: 0 10px 0 6px;
|
||||
border-width: 0 8px 0 5px;
|
||||
margin: 0 4px 0 3px;
|
||||
background: yellow;
|
||||
-webkit-box-decoration-break: clone;
|
||||
box-decoration-break: clone;
|
||||
}
|
||||
|
||||
f { margin-right: 30px; float: left; }
|
||||
</style>
|
||||
<body>
|
||||
<f class="max">
|
||||
<div><span>‮a‭bc</span><span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span>aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span> <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc </span><span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span><span> d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span> aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc </span>aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span>aa<span> d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span> aa <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span>aa <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span>aa</div>
|
||||
</f>
|
||||
|
||||
<f class="max">
|
||||
<div><span>‮a‭bc</span><span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span>aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span> <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc </span><span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span><span> d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span> aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc </span>aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span>aa<span> d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span> aa <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span>aa <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span>aa</div>
|
||||
</f>
|
|
@ -0,0 +1,110 @@
|
|||
<!DOCTYPE html>
|
||||
<head>
|
||||
<title>CSS Test: min/max-content size on box-decoration-break:clone inline box with bidi text and white-space:nowrap</title>
|
||||
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-sizing-3/#valdef-width-min-content">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-break-3/#break-decoration">
|
||||
<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1556709">
|
||||
<link rel="match" href="clone-nowrap-intrinsic-size-bidi-ref.html">
|
||||
<style>
|
||||
html,body {
|
||||
color:black; background-color:white; font:10px/1 monospace; padding:0; margin:0;
|
||||
}
|
||||
|
||||
div {
|
||||
border: 5px solid blue;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.max > div {
|
||||
width: -moz-max-content;
|
||||
width: -webkit-max-content;
|
||||
width: max-content;
|
||||
}
|
||||
.min > div {
|
||||
width: -moz-min-content;
|
||||
width: -webkit-min-content;
|
||||
width: min-content;
|
||||
}
|
||||
|
||||
span {
|
||||
border: 2px solid gray;
|
||||
padding: 0 10px 0 6px;
|
||||
border-width: 0 8px 0 5px;
|
||||
margin: 0 4px 0 3px;
|
||||
background: yellow;
|
||||
-webkit-box-decoration-break: clone;
|
||||
box-decoration-break: clone;
|
||||
}
|
||||
|
||||
f { margin-right: 30px; float: left; }
|
||||
</style>
|
||||
<body>
|
||||
<f class="max">
|
||||
<div>
|
||||
<span>‮a‭bc</span><span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span>aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span> <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc </span><span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span><span> d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span> aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc </span>aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span>aa<span> d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span> aa <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span>aa <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span>aa </div>
|
||||
</f>
|
||||
|
||||
<f class="min">
|
||||
<div>
|
||||
<span>‮a‭bc</span><span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span>aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span> <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc </span><span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span><span> d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span> aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc </span>aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span>aa<span> d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span> aa <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span>aa <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span>aa </div>
|
||||
</f>
|
|
@ -0,0 +1,79 @@
|
|||
<!DOCTYPE html>
|
||||
<head>
|
||||
<title>CSS Reference: min/max-content size on box-decoration-break:clone inline box w. white-space:nowrap</title>
|
||||
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||
<style>
|
||||
html,body {
|
||||
color:black; background-color:white; font:10px/1 monospace; padding:0; margin:0;
|
||||
}
|
||||
|
||||
div {
|
||||
border: 5px solid blue;
|
||||
white-space: pre;
|
||||
}
|
||||
.max > div {
|
||||
width: -moz-max-content;
|
||||
width: -webkit-max-content;
|
||||
width: max-content;
|
||||
}
|
||||
|
||||
span {
|
||||
border: 2px solid gray;
|
||||
padding: 0 10px 0 6px;
|
||||
border-width: 0 8px 0 5px;
|
||||
margin: 0 4px 0 3px;
|
||||
background: yellow;
|
||||
-webkit-box-decoration-break: clone;
|
||||
box-decoration-break: clone;
|
||||
}
|
||||
|
||||
f { margin-right: 30px; float: left; }
|
||||
</style>
|
||||
<body>
|
||||
<f class="max">
|
||||
<div><span>aaa</span><span>aaa</span>
|
||||
</div>
|
||||
<div><span>aaa</span>aa<span>aaa</span>
|
||||
</div>
|
||||
<div><span>aaa</span> <span>aaa</span>
|
||||
</div>
|
||||
<div><span>aaa </span><span>aaa</span>
|
||||
</div>
|
||||
<div><span>aaa</span><span> aaa</span>
|
||||
</div>
|
||||
<div><span>aaa</span> aa<span>aaa</span>
|
||||
</div>
|
||||
<div><span>aaa </span>aa<span>aaa</span>
|
||||
</div>
|
||||
<div><span>aaa</span>aa<span> aaa</span>
|
||||
</div>
|
||||
<div><span>aaa</span> aa <span>aaa</span>
|
||||
</div>
|
||||
<div><span>aaa</span>aa <span>aaa</span>
|
||||
</div>
|
||||
<div><span>aaa</span>aa</div>
|
||||
</f>
|
||||
|
||||
<f class="max">
|
||||
<div><span>aaa</span><span>aaa</span>
|
||||
</div>
|
||||
<div><span>aaa</span>aa<span>aaa</span>
|
||||
</div>
|
||||
<div><span>aaa</span> <span>aaa</span>
|
||||
</div>
|
||||
<div><span>aaa </span><span>aaa</span>
|
||||
</div>
|
||||
<div><span>aaa</span><span> aaa</span>
|
||||
</div>
|
||||
<div><span>aaa</span> aa<span>aaa</span>
|
||||
</div>
|
||||
<div><span>aaa </span>aa<span>aaa</span>
|
||||
</div>
|
||||
<div><span>aaa</span>aa<span> aaa</span>
|
||||
</div>
|
||||
<div><span>aaa</span> aa <span>aaa</span>
|
||||
</div>
|
||||
<div><span>aaa</span>aa <span>aaa</span>
|
||||
</div>
|
||||
<div><span>aaa</span>aa</div>
|
||||
</f>
|
|
@ -0,0 +1,110 @@
|
|||
<!DOCTYPE html>
|
||||
<head>
|
||||
<title>CSS Test: min/max-content size on box-decoration-break:clone inline box w. white-space:nowrap</title>
|
||||
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-sizing-3/#valdef-width-min-content">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-break-3/#break-decoration">
|
||||
<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1556709">
|
||||
<link rel="match" href="clone-nowrap-intrinsic-size-ref.html">
|
||||
<style>
|
||||
html,body {
|
||||
color:black; background-color:white; font:10px/1 monospace; padding:0; margin:0;
|
||||
}
|
||||
|
||||
div {
|
||||
border: 5px solid blue;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.max > div {
|
||||
width: -moz-max-content;
|
||||
width: -webkit-max-content;
|
||||
width: max-content;
|
||||
}
|
||||
.min > div {
|
||||
width: -moz-min-content;
|
||||
width: -webkit-min-content;
|
||||
width: min-content;
|
||||
}
|
||||
|
||||
span {
|
||||
border: 2px solid gray;
|
||||
padding: 0 10px 0 6px;
|
||||
border-width: 0 8px 0 5px;
|
||||
margin: 0 4px 0 3px;
|
||||
background: yellow;
|
||||
-webkit-box-decoration-break: clone;
|
||||
box-decoration-break: clone;
|
||||
}
|
||||
|
||||
f { margin-right: 30px; float: left; }
|
||||
</style>
|
||||
<body>
|
||||
<f class="max">
|
||||
<div>
|
||||
<span>aaa</span><span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span>aa<span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span> <span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa </span><span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span><span> aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span> aa<span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa </span>aa<span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span>aa<span> aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span> aa <span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span>aa <span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span>aa </div>
|
||||
</f>
|
||||
|
||||
<f class="min">
|
||||
<div>
|
||||
<span>aaa</span><span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span>aa<span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span> <span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa </span><span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span><span> aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span> aa<span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa </span>aa<span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span>aa<span> aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span> aa <span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span>aa <span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span>aa </div>
|
||||
</f>
|
|
@ -0,0 +1,79 @@
|
|||
<!DOCTYPE html>
|
||||
<head>
|
||||
<title>CSS Reference: min/max-content size on box-decoration-break:slice inline box with bidi text and white-space:nowrap</title>
|
||||
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||
<style>
|
||||
html,body {
|
||||
color:black; background-color:white; font:10px/1 monospace; padding:0; margin:0;
|
||||
}
|
||||
|
||||
div {
|
||||
border: 5px solid blue;
|
||||
white-space: pre;
|
||||
}
|
||||
.max > div {
|
||||
width: -moz-max-content;
|
||||
width: -webkit-max-content;
|
||||
width: max-content;
|
||||
}
|
||||
|
||||
span {
|
||||
border: 2px solid gray;
|
||||
padding: 0 10px 0 6px;
|
||||
border-width: 0 8px 0 5px;
|
||||
margin: 0 4px 0 3px;
|
||||
background: yellow;
|
||||
}
|
||||
|
||||
f { margin-right: 30px; float: left; }
|
||||
.l { margin-right:0; border-right-width:0; padding-right:0 }
|
||||
.r { margin-left:0; border-left-width:0; padding-left:0 }
|
||||
</style>
|
||||
<body>
|
||||
<f class="max">
|
||||
<div><span>‮a‭bc</span><span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span>aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span> <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc </span><span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span><span> d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span> aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc </span>aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span>aa<span> d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span> aa <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span>aa <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span>aa</div>
|
||||
</f>
|
||||
|
||||
<f class="max">
|
||||
<div><span>‮a‭bc</span><span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span>aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span> <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc </span><span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span><span> d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span> aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc </span>aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span>aa<span> d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span> aa <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span>aa <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div><span>‮a‭bc</span>aa</div>
|
||||
</f>
|
|
@ -0,0 +1,108 @@
|
|||
<!DOCTYPE html>
|
||||
<head>
|
||||
<title>CSS Test: min/max-content size on box-decoration-break:slice inline box with bidi text and white-space:nowrap</title>
|
||||
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-sizing-3/#valdef-width-min-content">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-break-3/#break-decoration">
|
||||
<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1556709">
|
||||
<link rel="match" href="slice-nowrap-intrinsic-size-bidi-ref.html">
|
||||
<style>
|
||||
html,body {
|
||||
color:black; background-color:white; font:10px/1 monospace; padding:0; margin:0;
|
||||
}
|
||||
|
||||
div {
|
||||
border: 5px solid blue;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.max > div {
|
||||
width: -moz-max-content;
|
||||
width: -webkit-max-content;
|
||||
width: max-content;
|
||||
}
|
||||
.min > div {
|
||||
width: -moz-min-content;
|
||||
width: -webkit-min-content;
|
||||
width: min-content;
|
||||
}
|
||||
|
||||
span {
|
||||
border: 2px solid gray;
|
||||
padding: 0 10px 0 6px;
|
||||
border-width: 0 8px 0 5px;
|
||||
margin: 0 4px 0 3px;
|
||||
background: yellow;
|
||||
}
|
||||
|
||||
f { margin-right: 30px; float: left; }
|
||||
</style>
|
||||
<body>
|
||||
<f class="max">
|
||||
<div>
|
||||
<span>‮a‭bc</span><span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span>aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span> <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc </span><span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span><span> d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span> aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc </span>aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span>aa<span> d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span> aa <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span>aa <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span>aa </div>
|
||||
</f>
|
||||
|
||||
<f class="min">
|
||||
<div>
|
||||
<span>‮a‭bc</span><span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span>aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span> <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc </span><span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span><span> d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span> aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc </span>aa<span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span>aa<span> d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span> aa <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span>aa <span>d‮e‭f</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>‮a‭bc</span>aa </div>
|
||||
</f>
|
|
@ -0,0 +1,57 @@
|
|||
<!DOCTYPE html>
|
||||
<head>
|
||||
<title>CSS Reference: min/max-content size on box-decoration-break:slice inline box w. white-space:nowrap</title>
|
||||
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||
<style>
|
||||
html,body {
|
||||
color:black; background-color:white; font:10px/1 monospace; padding:0; margin:0;
|
||||
}
|
||||
|
||||
div {
|
||||
border: 5px solid blue;
|
||||
white-space: pre;
|
||||
}
|
||||
.max > div {
|
||||
width: -moz-max-content;
|
||||
width: -webkit-max-content;
|
||||
width: max-content;
|
||||
}
|
||||
|
||||
span {
|
||||
border: 2px solid gray;
|
||||
padding: 0 10px 0 6px;
|
||||
border-width: 0 8px 0 5px;
|
||||
margin: 0 4px 0 3px;
|
||||
background: yellow;
|
||||
}
|
||||
|
||||
f { margin-right: 30px; float: left; }
|
||||
</style>
|
||||
<body>
|
||||
<f class="max">
|
||||
<div><span>aaa</span><span>aaa</span></div>
|
||||
<div><span>aaa</span>aa<span>aaa</span></div>
|
||||
<div><span>aaa</span> <span>aaa</span></div>
|
||||
<div><span>aaa </span><span>aaa</span></div>
|
||||
<div><span>aaa</span><span> aaa</span></div>
|
||||
<div><span>aaa</span> aa<span>aaa</span></div>
|
||||
<div><span>aaa </span>aa<span>aaa</span></div>
|
||||
<div><span>aaa</span>aa<span> aaa</span></div>
|
||||
<div><span>aaa</span> aa <span>aaa</span></div>
|
||||
<div><span>aaa</span>aa <span>aaa</span></div>
|
||||
<div><span>aaa</span>aa</div>
|
||||
</f>
|
||||
|
||||
<f class="max">
|
||||
<div><span>aaa</span><span>aaa</span></div>
|
||||
<div><span>aaa</span>aa<span>aaa</span></div>
|
||||
<div><span>aaa</span> <span>aaa</span></div>
|
||||
<div><span>aaa </span><span>aaa</span></div>
|
||||
<div><span>aaa</span><span> aaa</span></div>
|
||||
<div><span>aaa</span> aa<span>aaa</span></div>
|
||||
<div><span>aaa </span>aa<span>aaa</span></div>
|
||||
<div><span>aaa</span>aa<span> aaa</span></div>
|
||||
<div><span>aaa</span> aa <span>aaa</span></div>
|
||||
<div><span>aaa</span>aa <span>aaa</span></div>
|
||||
<div><span>aaa</span>aa</div>
|
||||
</f>
|
|
@ -0,0 +1,111 @@
|
|||
<!DOCTYPE html>
|
||||
<head>
|
||||
<title>CSS Test: min/max-content size on box-decoration-break:slice inline box w. white-space:nowrap</title>
|
||||
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-sizing-3/#valdef-width-min-content">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-break-3/#break-decoration">
|
||||
<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1556709">
|
||||
<link rel="match" href="slice-nowrap-intrinsic-size-ref.html">
|
||||
<style>
|
||||
html,body {
|
||||
color:black; background-color:white; font:10px/1 monospace; padding:0; margin:0;
|
||||
}
|
||||
|
||||
div {
|
||||
border: 5px solid blue;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.max > div {
|
||||
width: -moz-max-content;
|
||||
width: -webkit-max-content;
|
||||
width: max-content;
|
||||
}
|
||||
.min > div {
|
||||
width: -moz-min-content;
|
||||
width: -webkit-min-content;
|
||||
width: min-content;
|
||||
}
|
||||
|
||||
span {
|
||||
border: 2px solid gray;
|
||||
padding: 0 10px 0 6px;
|
||||
border-width: 0 8px 0 5px;
|
||||
margin: 0 4px 0 3px;
|
||||
background: yellow;
|
||||
/* for clarity: */
|
||||
-webkit-box-decoration-break: slice;
|
||||
box-decoration-break: slice;
|
||||
}
|
||||
|
||||
f { margin-right: 30px; float: left; }
|
||||
</style>
|
||||
<body>
|
||||
<f class="max">
|
||||
<div>
|
||||
<span>aaa</span><span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span>aa<span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span> <span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa </span><span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span><span> aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span> aa<span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa </span>aa<span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span>aa<span> aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span> aa <span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span>aa <span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span>aa </div>
|
||||
</f>
|
||||
|
||||
<f class="min">
|
||||
<div>
|
||||
<span>aaa</span><span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span>aa<span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span> <span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa </span><span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span><span> aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span> aa<span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa </span>aa<span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span>aa<span> aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span> aa <span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span>aa <span>aaa</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>aaa</span>aa </div>
|
||||
</f>
|
|
@ -0,0 +1,20 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration Test: parsing text-underline-offset computed values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-4/#underline-offset">
|
||||
<meta name="assert" content="text-underline-offset computed value is as specified.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/computed-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="target"></div>
|
||||
<script>
|
||||
test_computed_value("text-underline-offset", "auto");
|
||||
test_computed_value("text-underline-offset", "from-font");
|
||||
test_computed_value("text-underline-offset", "calc(10px - 8px)", "2px");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,17 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<link rel="help" title="2.4 Text Underline Offset: the 'text-underline-offset' property"
|
||||
href="https://drafts.csswg.org/css-text-decor-4/#underline-offset" />
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
test(function() {
|
||||
assert_equals(getComputedStyle(document.body)["text-underline-offset"], "auto", "Must be set to value auto as initial value.");
|
||||
}, "Initial value of text-underline-offset");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,27 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration Test: parsing text-underline-offset with invalid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-4/#underline-offset">
|
||||
<meta name="assert" content="text-underline-offset supports the following values: auto | from-font| <length>">
|
||||
<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("text-underline-offset", "otto");
|
||||
test_invalid_value("text-underline-offset", "asdlflj");
|
||||
test_invalid_value("text-underline-offset", "-10");
|
||||
test_invalid_value("text-underline-offset", "60002020");
|
||||
test_invalid_value("text-underline-offset", "!@#$%^&");
|
||||
test_invalid_value("text-underline-offset", "10e2");
|
||||
test_invalid_value("text-underline-offset", "from font");
|
||||
test_invalid_value("text-underline-offset", "10%");
|
||||
test_invalid_value("text-underline-offset", "-27%");
|
||||
test_invalid_value("text-underline-offset", "calc(40% - 20px)");
|
||||
test_invalid_value("text-underline-offset", "calc(100% - 40em)");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,24 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Decoration Test: parsing text-underline-offset with valid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-decor-4/#underline-offset">
|
||||
<meta name="assert" content="text-underline-offset supports the following values: auto | from-font| <length>">
|
||||
<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("text-underline-offset", "auto");
|
||||
test_valid_value("text-underline-offset", "from-font");
|
||||
test_valid_value("text-underline-offset", "-10px");
|
||||
test_valid_value("text-underline-offset", "2001em");
|
||||
test_valid_value("text-underline-offset", "-49em");
|
||||
test_valid_value("text-underline-offset", "53px");
|
||||
test_valid_value("text-underline-offset", "calc(40em - 10px)");
|
||||
test_valid_value("text-underline-offset", "calc(-13em + 50px)");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -15,6 +15,7 @@
|
|||
-->
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
|
||||
<style>
|
||||
#parent {
|
||||
position: absolute;
|
||||
|
@ -27,9 +28,13 @@
|
|||
</style>
|
||||
<div id=parent> <span id=target> </span></div>
|
||||
<script>
|
||||
test(
|
||||
function() {
|
||||
var e = document.elementFromPoint(125,25);
|
||||
assert_equals(e.id,"target", "the element targeted by a hit on the ellipsis is the elided inline.");
|
||||
}, "Checks hit testing on the ellipsis");
|
||||
setup({explicit_done: true});
|
||||
document.fonts.ready.then(()=> {
|
||||
test(
|
||||
function() {
|
||||
var e = document.elementFromPoint(125,25);
|
||||
assert_equals(e.id,"target", "the element targeted by a hit on the ellipsis is the elided inline.");
|
||||
}, "Checks hit testing on the ellipsis");
|
||||
done();
|
||||
});
|
||||
</script>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue