Update web-platform-tests to revision fec3928f355e049657d19780aa4b412d9d3a714b
|
@ -0,0 +1,40 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:html="http://www.w3.org/1999/xhtml"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<g id="testmeta">
|
||||
<title>CSS Masking: mask with negative scale target</title>
|
||||
<html:link rel="author" title="Dirk Schulze" href="mailto:dschulze@adobe.com"/>
|
||||
<html:link rel="help" href="http://www.w3.org/TR/css-masking-1/#svg-masks"/>
|
||||
<html:link rel="help" href="http://www.w3.org/TR/css-masking-1/#MaskElement"/>
|
||||
<html:link rel="match" href="reference/mask-negative-scale-001-ref.svg"/>
|
||||
<metadata class="flags">svg</metadata>
|
||||
<desc class="assert">The masked target elements get scaled with negative
|
||||
factors. Check if that influences masking. You should see 4 green
|
||||
rectangles with smaller blue rectangles in it in various rotations.</desc>
|
||||
</g>
|
||||
<defs>
|
||||
<g id="img" transform="translate(10,10)">
|
||||
<rect width="200" height="200" fill="red"/>
|
||||
<rect width="100" height="100" fill="green"/>
|
||||
<rect width="50" height="50" fill="blue"/>
|
||||
</g>
|
||||
</defs>
|
||||
|
||||
<mask id="mask">
|
||||
<rect x="10" y="10" width="90" height="90" fill="white"/>
|
||||
</mask>
|
||||
|
||||
<g transform="translate(200, 200)">
|
||||
<g transform="matrix(1 0 0 1 -100 -100)" mask="url(#mask)">
|
||||
<use xlink:href="#img"/>
|
||||
</g>
|
||||
<g transform="matrix(-1 0 0 -1 -100 -100)" mask="url(#mask)">
|
||||
<use xlink:href="#img"/>
|
||||
</g>
|
||||
<g transform="matrix(-1 0 0 1 -100 -100)" mask="url(#mask)">
|
||||
<use xlink:href="#img"/>
|
||||
</g>
|
||||
<g transform="matrix(1 0 0 -1 -100 -100)" mask="url(#mask)">
|
||||
<use xlink:href="#img"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
After Width: | Height: | Size: 1.4 KiB |
|
@ -0,0 +1,18 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:html="http://www.w3.org/1999/xhtml"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink" width="100px" height="100px">
|
||||
<g id="testmeta">
|
||||
<title>CSS Masking: mask with transformed text content</title>
|
||||
<html:link rel="author" title="Dirk Schulze" href="mailto:dschulze@adobe.com"/>
|
||||
<html:link rel="help" href="http://www.w3.org/TR/css-masking-1/#svg-masks"/>
|
||||
<html:link rel="help" href="http://www.w3.org/TR/css-masking-1/#MaskElement"/>
|
||||
<html:link rel="match" href="reference/mask-text-001-ref.svg"/>
|
||||
<metadata class="flags">svg</metadata>
|
||||
<desc class="assert">The masked target elements get scaled with negative
|
||||
factors. Check if that influences masking. You should see 4 green
|
||||
rectangles with smaller blue rectangles in it in various rotations.</desc>
|
||||
</g>
|
||||
<mask id="mask">
|
||||
<text fill="#fff" font-family="Ahem" font-size="12px" transform="rotate(90 50 50)" x="50%" y="50%">foobar</text>
|
||||
</mask>
|
||||
<rect width="100%" height="100%" x="0" y="0" mask="url(#mask)"/>
|
||||
</svg>
|
After Width: | Height: | Size: 1,015 B |
|
@ -0,0 +1,19 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:html="http://www.w3.org/1999/xhtml">
|
||||
<g id="testmeta">
|
||||
<title>CSS Masking: mask without mask-type alpha</title>
|
||||
<html:link rel="author" title="Dirk Schulze" href="mailto:dschulze@adobe.com"/>
|
||||
<html:link rel="help" href="http://www.w3.org/TR/css-masking-1/#svg-masks"/>
|
||||
<html:link rel="help" href="http://www.w3.org/TR/css-masking-1/#MaskElement"/>
|
||||
<html:link rel="help" href="http://www.w3.org/TR/css-masking-1/#the-mask-type"/>
|
||||
<html:link rel="match" href="reference/mask-green-square-001-ref.svg"/>
|
||||
<metadata class="flags">svg</metadata>
|
||||
<desc class="assert">The mask type "alpha" is applied to the mask element.
|
||||
The mask should take the alpha channel of the content to mask. You should
|
||||
see a green square.</desc>
|
||||
</g>
|
||||
<mask id="mask" mask-type="alpha">
|
||||
<rect width="200" height="200" fill="black" opacity="0"/>
|
||||
<rect x="50" y="50" width="100" height="100" fill="black"/>
|
||||
</mask>
|
||||
<rect width="200" height="200" fill="green" mask="url(#mask)"/>
|
||||
</svg>
|
After Width: | Height: | Size: 1,011 B |
|
@ -0,0 +1,19 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:html="http://www.w3.org/1999/xhtml">
|
||||
<g id="testmeta">
|
||||
<title>CSS Masking: mask without mask-type luminance</title>
|
||||
<html:link rel="author" title="Dirk Schulze" href="mailto:dschulze@adobe.com"/>
|
||||
<html:link rel="help" href="http://www.w3.org/TR/css-masking-1/#svg-masks"/>
|
||||
<html:link rel="help" href="http://www.w3.org/TR/css-masking-1/#MaskElement"/>
|
||||
<html:link rel="help" href="http://www.w3.org/TR/css-masking-1/#the-mask-type"/>
|
||||
<html:link rel="match" href="reference/mask-green-square-001-ref.svg"/>
|
||||
<metadata class="flags">svg</metadata>
|
||||
<desc class="assert">The mask type "alpha" is applied to the mask element.
|
||||
The mask should take the luminocity of the content to mask. You should
|
||||
see a green square.</desc>
|
||||
</g>
|
||||
<mask id="mask" mask-type="luminance">
|
||||
<rect width="200" height="200" fill="black"/>
|
||||
<rect x="50" y="50" width="100" height="100" fill="white"/>
|
||||
</mask>
|
||||
<rect width="200" height="200" fill="green" mask="url(#mask)"/>
|
||||
</svg>
|
After Width: | Height: | Size: 1,004 B |
|
@ -0,0 +1,19 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:html="http://www.w3.org/1999/xhtml">
|
||||
<g id="testmeta">
|
||||
<title>CSS Masking: mask without specified mask-type</title>
|
||||
<html:link rel="author" title="Dirk Schulze" href="mailto:dschulze@adobe.com"/>
|
||||
<html:link rel="help" href="http://www.w3.org/TR/css-masking-1/#svg-masks"/>
|
||||
<html:link rel="help" href="http://www.w3.org/TR/css-masking-1/#MaskElement"/>
|
||||
<html:link rel="help" href="http://www.w3.org/TR/css-masking-1/#the-mask-type"/>
|
||||
<html:link rel="match" href="reference/mask-green-square-001-ref.svg"/>
|
||||
<metadata class="flags">svg</metadata>
|
||||
<desc class="assert">No mask type was specified the mask element should
|
||||
take the luminocity of the content to mask. You should see a green square.
|
||||
</desc>
|
||||
</g>
|
||||
<mask id="mask">
|
||||
<rect width="200" height="200" fill="black"/>
|
||||
<rect x="50" y="50" width="100" height="100" fill="white"/>
|
||||
</mask>
|
||||
<rect width="200" height="200" fill="green" mask="url(#mask)"/>
|
||||
</svg>
|
After Width: | Height: | Size: 964 B |
|
@ -0,0 +1,8 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:html="http://www.w3.org/1999/xhtml">
|
||||
<g id="testmeta">
|
||||
<title>CSS Masking: Reftest reference</title>
|
||||
<html:link rel="author" title="Dirk Schulze" href="mailto:dschulze@adobe.com"/>
|
||||
<metadata class="flags">svg</metadata>
|
||||
</g>
|
||||
<rect x="50" y="50" width="100" height="100" fill="green"/>
|
||||
</svg>
|
After Width: | Height: | Size: 341 B |
|
@ -0,0 +1,15 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:html="http://www.w3.org/1999/xhtml">
|
||||
<g id="testmeta">
|
||||
<title>CSS Masking: Reftest reference</title>
|
||||
<html:link rel="author" title="Dirk Schulze" href="mailto:dschulze@adobe.com"/>
|
||||
<metadata class="flags">svg</metadata>
|
||||
</g>
|
||||
<rect width="90" height="90" fill="green"/>
|
||||
<rect x="40" y="40" width="50" height="50" fill="blue"/>
|
||||
<rect x="110" width="90" height="90" fill="green"/>
|
||||
<rect x="110" y="40" width="50" height="50" fill="blue"/>
|
||||
<rect y="110" width="90" height="90" fill="green"/>
|
||||
<rect x="40" y="110" width="50" height="50" fill="blue"/>
|
||||
<rect x="110" y="110" width="90" height="90" fill="green"/>
|
||||
<rect x="110" y="110" width="50" height="50" fill="blue"/>
|
||||
</svg>
|
After Width: | Height: | Size: 721 B |
|
@ -0,0 +1,8 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:html="http://www.w3.org/1999/xhtml">
|
||||
<g id="testmeta">
|
||||
<title>CSS Masking: Reftest reference</title>
|
||||
<html:link rel="author" title="Dirk Schulze" href="mailto:dschulze@adobe.com"/>
|
||||
<metadata class="flags">svg</metadata>
|
||||
</g>
|
||||
<text fill="#000" font-family="Ahem" font-size="12px" transform="rotate(90 50 50)" x="50" y="50">foobar</text>
|
||||
</svg>
|
After Width: | Height: | Size: 391 B |
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Inheritance of CSS Scroll Snap properties</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-scroll-snap-1/#property-index">
|
||||
<meta name="assert" content="Properties inherit or not according to the spec.">
|
||||
<meta name="assert" content="Properties have initial values according to the spec.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/inheritance-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="container">
|
||||
<div id="target"></div>
|
||||
</div>
|
||||
<script>
|
||||
assert_not_inherited('scroll-margin-block-end', '0px', '10px');
|
||||
assert_not_inherited('scroll-margin-block-start', '0px', '10px');
|
||||
assert_not_inherited('scroll-margin-bottom', '0px', '10px');
|
||||
assert_not_inherited('scroll-margin-inline-end', '0px', '10px');
|
||||
assert_not_inherited('scroll-margin-inline-start', '0px', '10px');
|
||||
assert_not_inherited('scroll-margin-left', '0px', '10px');
|
||||
assert_not_inherited('scroll-margin-right', '0px', '10px');
|
||||
assert_not_inherited('scroll-margin-top', '0px', '10px');
|
||||
assert_not_inherited('scroll-padding-block-end', 'auto', '10px');
|
||||
assert_not_inherited('scroll-padding-block-start', 'auto', '10px');
|
||||
assert_not_inherited('scroll-padding-bottom', '0px', '10px');
|
||||
assert_not_inherited('scroll-padding-inline-end', 'auto', '10px');
|
||||
assert_not_inherited('scroll-padding-inline-start', 'auto', '10px');
|
||||
assert_not_inherited('scroll-padding-left', '0px', '10px');
|
||||
assert_not_inherited('scroll-padding-right', '0px', '10px');
|
||||
assert_not_inherited('scroll-padding-top', '0px', '10px');
|
||||
assert_not_inherited('scroll-snap-align', 'none', 'start end');
|
||||
assert_not_inherited('scroll-snap-stop', 'normal', 'always');
|
||||
assert_not_inherited('scroll-snap-type', 'none', 'inline proximity');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,20 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel="help" href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property">
|
||||
<link rel="match" href="../../../reference/ref-filled-green-100px-square-only.html">
|
||||
<meta name="assert" content="This checks that a float 'shadowing' a shape-outside float works as expected.">
|
||||
<style>
|
||||
#container { width: 100px; line-height: 0; }
|
||||
#float_1 { float: right; width: 30px; height: 30px; background: green; }
|
||||
#float_2 { float: left; width: 20px; height: 100px; background: green; shape-outside: inset(0 20px 0 0); }
|
||||
#float_3 { float: left; width: 30px; height: 50px; background: green; }
|
||||
.atomic { display: inline-block; background: green; }
|
||||
</style>
|
||||
<p>Test passes if there is a filled green square.</p>
|
||||
<div id="container">
|
||||
<div id="float_1"></div>
|
||||
<div id="float_2"></div>
|
||||
<div id="float_3"></div>
|
||||
<div class="atomic" style="width: 20px; height: 30px;"></div>
|
||||
<div class="atomic" style="width: 50px; height: 20px;"></div>
|
||||
<div class="atomic" style="width: 80px; height: 50px;"></div><div class="atomic" style="width: 20px; height: 50px;"></div>
|
||||
</div>
|
|
@ -0,0 +1,3 @@
|
|||
<!DOCTYPE html>
|
||||
<p>There should be a space between "Two" and "words".</p>
|
||||
Two words
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#white-space-rules">
|
||||
<link rel="match" href="reference/white-space-empty-text-sibling-ref.html">
|
||||
<p>There should be a space between "Two" and "words".</p>
|
||||
<div id="block"> <span>words</span></div>
|
||||
<script>
|
||||
block.insertBefore(document.createTextNode(""), block.firstChild);
|
||||
block.insertBefore(document.createTextNode(""), block.firstChild);
|
||||
block.offsetTop;
|
||||
block.firstChild.data = "Two";
|
||||
</script>
|
|
@ -36,6 +36,10 @@ test(function() {
|
|||
target.style.offsetPath = ' path( "m 10 20 a 10 20 30 1 0 40 50 a 110 120 30 1 1 140 50" ) ';
|
||||
assert_equals(target.style.offsetPath, 'path("m 10 20 a 10 20 30 1 0 40 50 a 110 120 30 1 1 140 50")');
|
||||
assert_equals(getComputedStyle(target).offsetPath, 'path("M 10 20 A 10 20 30 1 0 50 70 A 110 120 30 1 1 190 120")');
|
||||
|
||||
target.style.offsetPath = 'path("M 1 2 H 3 v 4 h 5 V 6 h 7 v 8")';
|
||||
assert_equals(target.style.offsetPath, 'path("M 1 2 H 3 v 4 h 5 V 6 h 7 v 8")');
|
||||
assert_equals(getComputedStyle(target).offsetPath, 'path("M 1 2 H 3 V 6 H 8 V 6 H 15 V 14")');
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
|
|
|
@ -0,0 +1,20 @@
|
|||
<!doctype html>
|
||||
<meta charset=utf-8>
|
||||
<title>Drop cap with U+05D0 in the document</title>
|
||||
<meta name="assert" content="The text placement within :first-line should not be affected by later presence of a right-to-left character.">
|
||||
<link rel=help href=https://drafts.csswg.org/css-pseudo-4/#first-line-styling>
|
||||
<link rel=match href=/css/selectors/floating-first-letter-ref.html>
|
||||
<style>
|
||||
p:first-line {
|
||||
background: lightblue;
|
||||
}
|
||||
|
||||
p::first-letter {
|
||||
float: left;
|
||||
font-size: 4rem;
|
||||
}
|
||||
div {
|
||||
color: transparent;
|
||||
}
|
||||
</style>
|
||||
<p>Ab</p><div>א</div>
|
|
@ -0,0 +1,17 @@
|
|||
<!doctype html>
|
||||
<meta charset=utf-8>
|
||||
<title>Drop cap with U+FEFF in the document</title>
|
||||
<meta name="assert" content="The text placement within :first-line should not be affected by later presence of U+FEFF.">
|
||||
<link rel=help href=https://drafts.csswg.org/css-pseudo-4/#first-line-styling>
|
||||
<link rel=match href=/css/selectors/floating-first-letter-ref.html>
|
||||
<style>
|
||||
p:first-line {
|
||||
background: lightblue;
|
||||
}
|
||||
|
||||
p::first-letter {
|
||||
float: left;
|
||||
font-size: 4rem;
|
||||
}
|
||||
</style>
|
||||
<p>Ab</p>
|
|
@ -0,0 +1,14 @@
|
|||
<!doctype html>
|
||||
<meta charset=utf-8>
|
||||
<title>Drop cap with no bidi in the document</title>
|
||||
<style>
|
||||
p:first-line {
|
||||
background: lightblue;
|
||||
}
|
||||
|
||||
p::first-letter {
|
||||
float: left;
|
||||
font-size: 4rem;
|
||||
}
|
||||
</style>
|
||||
<p>Ab</p>
|