Update CSS tests to revision c68e4df16362489debde94340cc6f54945a72f2f

This commit is contained in:
Ms2ger 2015-11-17 10:00:53 +01:00
parent 32efe41299
commit 53608a60a4
1543 changed files with 42190 additions and 14617 deletions

View file

@ -0,0 +1,36 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>
CSS Values and Units Test:
Attribute references (colors)
</title>
<meta content="
Invalid color values in referenced attributes are replaced by the fallback value
" name="assert" />
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<link href="http://www.w3.org/TR/css3-values/#attr-notation" rel="help" />
<link href="reference/200-200-green.xht" rel="match" />
<style type="text/css">
html, body { margin: 0px; padding: 0px; }
html { background: white; overflow: hidden; }
#outer { position: relative; background: red; width: 200px; height: 200px; }
#outer { background: attr(data-test color, green); }
</style>
</head>
<body>
<div data-test="qqffuutt" id="outer"></div>
</body></html>

View file

@ -0,0 +1,36 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>
CSS Values and Units Test:
Attribute references (colors)
</title>
<meta content="
When the fallback value of an attr() function is invalid, the delcaration is ignored.
" name="assert" />
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<link href="http://www.w3.org/TR/css3-values/#attr-notation" rel="help" />
<link href="reference/200-200-green.xht" rel="match" />
<style type="text/css">
html, body { margin: 0px; padding: 0px; }
html { background: white; overflow: hidden; }
#outer { position: relative; background: green; width: 200px; height: 200px; }
#outer { background: attr(data-test color, qqffuutt); }
</style>
</head>
<body>
<div data-test="red" id="outer"></div>
</body></html>

View file

@ -0,0 +1,36 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>
CSS Values and Units Test:
Attribute references (colors)
</title>
<meta content="
The value of the reference attribute is used correctly in the layout when it's a color.
" name="assert" />
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<link href="http://www.w3.org/TR/css3-values/#attr-notation" rel="help" />
<link href="reference/200-200-green.xht" rel="match" />
<style type="text/css">
html, body { margin: 0px; padding: 0px; }
html { background: white; overflow: hidden; }
#outer { position: relative; background: red; width: 200px; height: 200px; }
#outer { background: attr(data-test color); }
</style>
</head>
<body>
<div data-test="green" id="outer"></div>
</body></html>

View file

@ -0,0 +1,36 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>
CSS Values and Units Test:
Attribute references (types)
</title>
<meta content="
When the type of an att() function is known and unexpected, the declaration is ingored
" name="assert" />
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<link href="http://www.w3.org/TR/css3-values/#attr-notation" rel="help" />
<link href="reference/200-200-green.xht" rel="match" />
<style type="text/css">
html, body { margin: 0px; padding: 0px; }
html { background: white; overflow: hidden; }
#outer { position: relative; background: green; }
#outer { width: 200px; width: attr(data-test color); height: 200px; }
</style>
</head>
<body>
<div data-test="green" id="outer"></div>
</body></html>

View file

@ -0,0 +1,39 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>
CSS Values and Units Test:
Attribute references (types)
</title>
<meta content="
When the type of an att() function is known and unexpected, the declaration is ignored
" name="assert" />
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<link href="http://www.w3.org/TR/css3-values/#attr-notation" rel="help" />
<link href="reference/200-200-green.xht" rel="match" />
<style type="text/css">
html, body { margin: 0px; padding: 0px; }
html { background: white; overflow: hidden; }
#outer { position: relative; background: green; }
#outer { width: 200px; width: attr(data-test number); height: 200px; }
/* NOTE: while '0' is a valid length AND a valid number, the number type isn't a valid representation of a length. */
/* The reason for this is that most numbers aren't valid length */
/* ! Spec need some updates to make those assumptions clearly valid (see Tab Atkins for details) */
</style>
</head>
<body>
<div data-test="0" id="outer"></div>
</body></html>

View file

@ -0,0 +1,39 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>
CSS Values and Units Test:
Attribute references (types)
</title>
<meta content="
When the type of an att() function is known and unexpected, the declaration is ignored
" name="assert" />
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<link href="http://www.w3.org/TR/css3-values/#attr-notation" rel="help" />
<link href="reference/200-200-green.xht" rel="match" />
<style type="text/css">
html, body { margin: 0px; padding: 0px; }
html { background: white; overflow: hidden; }
#outer { position: relative; background: green; }
#outer { width: 200px; width: attr(data-test number); height: 200px; }
/* NOTE: while '0' is a valid length AND a valid number, the number type isn't a valid representation of a length. */
/* The reason for this is that most numbers aren't valid length */
/* ! Spec need some updates to make those assumptions clearly valid (see Tab Atkins for details) */
</style>
</head>
<body>
<div data-test="0" id="outer"></div>
</body></html>

View file

@ -0,0 +1,36 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>
CSS Values and Units Test:
Attribute references (length)
</title>
<meta content="
When the value of referenced attribute isn't a valid length, the fallback value is unsed instead.
" name="assert" />
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<link href="http://www.w3.org/TR/css3-values/#attr-notation" rel="help" />
<link href="reference/200-200-green.xht" rel="match" />
<style type="text/css">
html, body { margin: 0px; padding: 0px; }
html { background: white; overflow: hidden; }
#outer { position: relative; background: green; }
#outer { width: attr(data-test length, 200px); height: 200px; }
</style>
</head>
<body>
<div data-test="qqffuutt" id="outer"></div>
</body></html>

View file

@ -0,0 +1,36 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>
CSS Values and Units Test:
Attribute references (length)
</title>
<meta content="
When the attr() fallback is an invalid length, the delcaration is correctly ignored.
" name="assert" />
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<link href="http://www.w3.org/TR/css3-values/#attr-notation" rel="help" />
<link href="reference/200-200-green.xht" rel="match" />
<style type="text/css">
html, body { margin: 0px; padding: 0px; }
html { background: white; overflow: hidden; }
#outer { position: relative; background: green; }
#outer { width: 200px; width: attr(data-test length, invalid); height: 200px; }
</style>
</head>
<body>
<div data-test="300px" id="outer"></div>
</body></html>

View file

@ -0,0 +1,39 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>
CSS Values and Units Test:
Attribute references (length)
</title>
<meta content="
The value of referenced attribute is used correctly as a length (even if it's 0).
" name="assert" />
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<link href="http://www.w3.org/TR/css3-values/#attr-notation" rel="help" />
<link href="reference/200-200-green.xht" rel="match" />
<style type="text/css">
html, body { margin: 0px; padding: 0px; }
html { background: white; overflow: hidden; }
#outer { position: relative; background: green; }
#outer2 { background: red; }
#outer { width: 200px; height: 200px; }
#outer2 { width: 200px; width: attr(data-test length); height: 200px; }
</style>
</head>
<body>
<div id="outer"></div>
<div data-test="0" id="outer2"></div>
</body></html>

View file

@ -0,0 +1,39 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>
CSS Values and Units Test:
Attribute references (length)
</title>
<meta content="
The value of referenced attribute is used correctly as a length (even if it's 0).
" name="assert" />
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<link href="http://www.w3.org/TR/css3-values/#attr-notation" rel="help" />
<link href="reference/200-200-green.xht" rel="match" />
<style type="text/css">
html, body { margin: 0px; padding: 0px; }
html { background: white; overflow: hidden; }
#outer { position: relative; background: green; }
#outer2 { background: red; }
#outer { width: 200px; height: 200px; }
#outer2 { width: 200px; width: attr(data-test length, 0); height: 200px; }
</style>
</head>
<body>
<div id="outer"></div>
<div data-test="0" id="outer2"></div>
</body></html>

View file

@ -0,0 +1,36 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>
CSS Values and Units Test:
Attribute references (length)
</title>
<meta content="
The value of referenced attribute is used correctly as a length.
" name="assert" />
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<link href="http://www.w3.org/TR/css3-values/#attr-notation" rel="help" />
<link href="reference/200-200-green.xht" rel="match" />
<style type="text/css">
html, body { margin: 0px; padding: 0px; }
html { background: white; overflow: hidden; }
#outer { position: relative; background: green; }
#outer { width: attr(data-test length); height: 200px; }
</style>
</head>
<body>
<div data-test="200px" id="outer"></div>
</body></html>

View file

@ -0,0 +1,36 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>
CSS Values and Units Test:
Attributes references (pixels)
</title>
<meta content="
When the value of the referenced attribute is not a pixel value, the fallback value is used instead.
" name="assert" />
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<link href="http://www.w3.org/TR/css3-values/#attr-notation" rel="help" />
<link href="reference/200-200-green.xht" rel="match" />
<style type="text/css">
html, body { margin: 0px; padding: 0px; }
html { background: white; overflow: hidden; }
#outer { position: relative; background: green; }
#outer { width: attr(data-test px, 200); height: 200px; }
</style>
</head>
<body>
<div data-test="300px" id="outer"></div>
</body></html>

View file

@ -0,0 +1,36 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>
CSS Values and Units Test:
Attribute references (pixels)
</title>
<meta content="
When the fallback of a pixel attribute reference is invalid, the declaration is ignored.
" name="assert" />
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<link href="http://www.w3.org/TR/css3-values/#attr-notation" rel="help" />
<link href="reference/200-200-green.xht" rel="match" />
<style type="text/css">
html, body { margin: 0px; padding: 0px; }
html { background: white; overflow: hidden; }
#outer { position: relative; background: green; }
#outer { width: 200px; width: attr(data-test px, 300px); height: 200px; }
</style>
</head>
<body>
<div data-test="300" id="outer"></div>
</body></html>

View file

@ -0,0 +1,36 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>
CSS Values and Units Test:
Attribute references (pixels)
</title>
<meta content="
Attribute references for pixel values are replaced correctly at computed time.
" name="assert" />
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<link href="http://www.w3.org/TR/css3-values/#attr-notation" rel="help" />
<link href="reference/200-200-green.xht" rel="match" />
<style type="text/css">
html, body { margin: 0px; padding: 0px; }
html { background: white; overflow: hidden; }
#outer { position: relative; background: green; }
#outer { width: attr(data-test px); height: 200px; }
</style>
</head>
<body>
<div data-test="200" id="outer"></div>
</body></html>

View file

@ -0,0 +1,35 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>
CSS Values and Units Test:
Calc() inside calc()
</title>
<meta content="
The calc() function notation is allowed inside a calc() notation.
" name="assert" />
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<link href="http://www.w3.org/TR/css3-values/#calc-notation" rel="help" />
<link href="reference/all-green.xht" rel="match" />
<style type="text/css">
html, body { margin: 0px; padding: 0px; }
html { background: red; overflow: hidden; }
#outer { position: absolute; top: 0px; left: 0px; background: green; width: 100%; }
#outer { height: calc(calc(100%));
</style>
</head>
<body>
<div id="outer"></div>
</body></html>

View file

@ -0,0 +1,35 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>
CSS Values and Units and Media Queries Test:
Calc function inside media queries
</title>
<meta content="
The calc() expression is supported in the min-width media query.
" name="assert" />
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<link href="http://www.w3.org/TR/css3-values/#calc-notation" rel="help" />
<link href="http://www.w3.org/TR/css3-mediaqueries/#width" rel="help" />
<link href="reference/all-green.xht" rel="match" />
<style type="text/css">
html { background: red; }
@media (min-width: calc(100px)) {
html { background: green; }
}
</style>
</head>
<body>
<div id="target"></div>
</body></html>

View file

@ -0,0 +1,35 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>
CSS Values and Units and Media Queries Test:
Calc function inside media queries
</title>
<meta content="
The calc() expression is supported in the min-width media query properly (=with range clamping).
" name="assert" />
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<link href="http://www.w3.org/TR/css3-values/#calc-notation" rel="help" />
<link href="http://www.w3.org/TR/css3-mediaqueries/#width" rel="help" />
<link href="reference/all-green.xht" rel="match" />
<style type="text/css">
html { background: red; }
@media (min-width: calc(-100px)) { /* should clamp to 0px */
html { background: green; }
}
</style>
</head>
<body>
<div id="target"></div>
</body></html>

View file

@ -0,0 +1,37 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>
CSS Values and Units Test:
Range clamping into calc() expressions
</title>
<meta content="
A calc expression can evaluate to a value which is outside the validity range.
If it does, this value must be clamped into the range.
The declaration must not be ignored.
" name="assert" />
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<link href="http://www.w3.org/TR/css3-values/#calc-notation" rel="help" />
<link href="reference/200-200-green.xht" rel="match" />
<style type="text/css">
html, body { margin: 0px; padding: 0px; }
html { background: white; overflow: hidden; }
#outer { background: green; width: 200px; height: 200px; }
#outer { border-radius: 10px; border-radius: calc(-10px); }
</style>
</head>
<body>
<div id="outer"></div>
</body></html>

View file

@ -0,0 +1,35 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>
CSS Values and Units Test:
Calc() inside calc()
</title>
<meta content="
The calc() function notation is allowed inside a calc() notation.
" name="assert" />
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<link href="http://www.w3.org/TR/css3-values/#calc-notation" rel="help" />
<link href="reference/all-green.xht" rel="match" />
<style type="text/css">
html, body { margin: 0px; padding: 0px; }
html { background: red; overflow: hidden; }
#outer { position: absolute; top: 0px; left: 0px; background: green; width: 100%; }
#outer { height: calc((((((((((((((((((((((((100%)))))))))))))))))))))))); }
</style>
</head>
<body>
<div id="outer"></div>
</body></html>

View file

@ -13,7 +13,7 @@
<body>
<h1>CSS Values and Units Module Level 3 CR Test Suite</h1>
<h2>Functional Notations (32 tests)</h2>
<h2>Functional Notations (66 tests)</h2>
<table width="100%">
<col id="test-column"></col>
<col id="refs-column"></col>
@ -43,7 +43,7 @@
<tr><th colspan="4" scope="rowgroup">
<a href="#s8.1">+</a>
<a href="http://www.w3.org/TR/css3-values/#calc-notation">8.1 Mathematical Expressions: calc()</a></th></tr>
<!-- 31 tests -->
<!-- 50 tests -->
<tr id="calc-background-image-gradient-1-8.1" class="primary">
<td><strong>
<a href="calc-background-image-gradient-1.xht">calc-background-image-gradient-1</a></strong></td>
@ -100,6 +100,50 @@
<td>Test that height:calc() with no percentages has an effect on inner table elements
</td>
</tr>
<tr id="calc-in-calc-8.1" class="primary">
<td><strong>
<a href="calc-in-calc.xht">calc-in-calc</a></strong></td>
<td><a href="reference/all-green.xht">=</a> </td>
<td></td>
<td>Calc() inside calc()
<ul class="assert">
<li>The calc() function notation is allowed inside a calc() notation.</li>
</ul>
</td>
</tr>
<tr id="calc-in-media-queries-001-8.1" class="primary">
<td><strong>
<a href="calc-in-media-queries-001.xht">calc-in-media-queries-001</a></strong></td>
<td><a href="reference/all-green.xht">=</a> </td>
<td></td>
<td>Calc function inside media queries
<ul class="assert">
<li>The calc() expression is supported in the min-width media query.</li>
</ul>
</td>
</tr>
<tr id="calc-in-media-queries-002-8.1" class="primary">
<td><strong>
<a href="calc-in-media-queries-002.xht">calc-in-media-queries-002</a></strong></td>
<td><a href="reference/all-green.xht">=</a> </td>
<td></td>
<td>Calc function inside media queries
<ul class="assert">
<li>The calc() expression is supported in the min-width media query properly (=with range clamping).</li>
</ul>
</td>
</tr>
<tr id="calc-invalid-range-clamping-8.1" class="primary">
<td><strong>
<a href="calc-invalid-range-clamping.xht">calc-invalid-range-clamping</a></strong></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td></td>
<td>Range clamping into calc() expressions
<ul class="assert">
<li>A calc expression can evaluate to a value which is outside the validity range. If it does, this value must be clamped into the range. The declaration must not be ignored.</li>
</ul>
</td>
</tr>
<tr id="calc-margin-block-1-8.1" class="primary">
<td><strong>
<a href="calc-margin-block-1.xht">calc-margin-block-1</a></strong></td>
@ -228,6 +272,17 @@
<td>Test of padding-*: calc()
</td>
</tr>
<tr id="calc-parenthesis-stack-8.1" class="primary">
<td><strong>
<a href="calc-parenthesis-stack.xht">calc-parenthesis-stack</a></strong></td>
<td><a href="reference/all-green.xht">=</a> </td>
<td></td>
<td>Calc() inside calc()
<ul class="assert">
<li>The calc() function notation is allowed inside a calc() notation.</li>
</ul>
</td>
</tr>
<tr id="calc-text-indent-1-8.1" class="primary">
<td><strong>
<a href="calc-text-indent-1.xht">calc-text-indent-1</a></strong></td>
@ -292,6 +347,160 @@
<td>width: calc() on table-layout: auto tables
</td>
</tr>
<tr id="mq-calc-001-8.1" class="primary">
<td><strong>
<a href="mq-calc-001.xht">mq-calc-001</a></strong></td>
<td><a href="reference/mq-calc-001-ref.xht">=</a> </td>
<td></td>
<td>support for calc in Media Queries
<ul class="assert">
<li>calc can be used in Media Queries</li>
</ul>
</td>
</tr>
<tr id="mq-calc-002-8.1" class="primary">
<td><strong>
<a href="mq-calc-002.xht">mq-calc-002</a></strong></td>
<td><a href="reference/mq-calc-001-ref.xht">=</a> </td>
<td></td>
<td>evaluation of em in calc in Media Queries
<ul class="assert">
<li>The size in pixels of the 'em' unit used in calc inside a media query does not depend on declarations and use the initial value.</li>
</ul>
</td>
</tr>
<tr id="mq-calc-003-8.1" class="primary">
<td><strong>
<a href="mq-calc-003.xht">mq-calc-003</a></strong></td>
<td><a href="reference/mq-calc-001-ref.xht">=</a> </td>
<td></td>
<td>evaluation of ex in calc in Media Queries
<ul class="assert">
<li>The size in pixels of the 'ex' unit used in calc inside a media query does not depend on declarations and use the initial value.</li>
</ul>
</td>
</tr>
<tr id="mq-calc-004-8.1" class="primary">
<td><strong>
<a href="mq-calc-004.xht">mq-calc-004</a></strong></td>
<td><a href="reference/mq-calc-001-ref.xht">=</a> </td>
<td></td>
<td>evaluation of ch in calc in Media Queries
<ul class="assert">
<li>The size in pixels of the 'ch' unit used in calc inside a media query does not depend on declarations and use the initial value.</li>
</ul>
</td>
</tr>
<tr id="mq-calc-005-8.1" class="primary">
<td><strong>
<a href="mq-calc-005.xht">mq-calc-005</a></strong></td>
<td><a href="reference/mq-calc-001-ref.xht">=</a> </td>
<td></td>
<td>evaluation of rem in calc in Media Queries
<ul class="assert">
<li>The size in pixels of the 'rem' unit used in calc inside a media query does not depend on declarations and use the initial value.</li>
</ul>
</td>
</tr>
<tr id="shape-outside-circle-010-8.1" class="dom script">
<td>
<a href="shape-outside-circle-010.xht">shape-outside-circle-010</a></td>
<td></td>
<td><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
<td>Shape Outside Circle args - calc() values
<ul class="assert">
<li>A circle's arguments may be in calc() values.</li>
</ul>
</td>
</tr>
<tr id="shape-outside-circle-011-8.1" class="dom script">
<td>
<a href="shape-outside-circle-011.xht">shape-outside-circle-011</a></td>
<td></td>
<td><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
<td>Shape Outside Circle position args - calc() values
<ul class="assert">
<li>A circle's &lt;position&gt; arguments may be in calc() values.</li>
</ul>
</td>
</tr>
<tr id="shape-outside-ellipse-010-8.1" class="dom script">
<td>
<a href="shape-outside-ellipse-010.xht">shape-outside-ellipse-010</a></td>
<td></td>
<td><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
<td>Shape Outside Ellipse args - calc() values
<ul class="assert">
<li>An ellipse's arguments may be in calc() values.</li>
</ul>
</td>
</tr>
<tr id="shape-outside-ellipse-011-8.1" class="dom script">
<td>
<a href="shape-outside-ellipse-011.xht">shape-outside-ellipse-011</a></td>
<td></td>
<td><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
<td>Shape Outside Ellipse position args - calc() values
<ul class="assert">
<li>An ellipse's &lt;position&gt; arguments may be in calc() values.</li>
</ul>
</td>
</tr>
<tr id="shape-outside-inset-008-8.1" class="dom script">
<td>
<a href="shape-outside-inset-008.xht">shape-outside-inset-008</a></td>
<td></td>
<td><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
<td>Shape Outside Inset Args - calc() values
<ul class="assert">
<li>An inset's arguments may be in calc() values.</li>
</ul>
</td>
</tr>
<tr id="shape-outside-inset-009-8.1" class="dom script">
<td>
<a href="shape-outside-inset-009.xht">shape-outside-inset-009</a></td>
<td></td>
<td><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
<td>Shape Outside Inset round args - calc() values
<ul class="assert">
<li>An inset's radial component arguments may be in calc() values.</li>
</ul>
</td>
</tr>
<tr id="shape-outside-polygon-006-8.1" class="dom script">
<td>
<a href="shape-outside-polygon-006.xht">shape-outside-polygon-006</a></td>
<td></td>
<td><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
<td>Shape Outside Polygon args - calc() values
<ul class="assert">
<li>A polygon's arguments may be in calc() values.</li>
</ul>
</td>
</tr>
<tr id="vh-calc-support-8.1" class="">
<td>
<a href="vh-calc-support.xht">vh-calc-support</a></td>
<td><a href="reference/all-green.xht">=</a> </td>
<td></td>
<td>Viewport units are supported inside calc expressions.
<ul class="assert">
<li>Check that viewport units add correctly to pixels in calc() expressions</li>
</ul>
</td>
</tr>
<tr id="vh-calc-support-pct-8.1" class="">
<td>
<a href="vh-calc-support-pct.xht">vh-calc-support-pct</a></td>
<td><a href="reference/all-green.xht">=</a> </td>
<td></td>
<td>Viewport units are supported inside calc expressions.
<ul class="assert">
<li>Check that viewport units add correctly to percentages in calc() expressions</li>
</ul>
</td>
</tr>
</tbody>
<tbody id="s8.1.#example-0bd12a8e">
<!-- 0 tests -->
@ -392,7 +601,172 @@
<tr><th colspan="4" scope="rowgroup">
<a href="#s8.3">+</a>
<a href="http://www.w3.org/TR/css3-values/#attr-notation">8.3 Attribute References: attr()</a></th></tr>
<!-- 0 tests -->
<!-- 15 tests -->
<tr id="attr-color-invalid-cast-8.3" class="primary">
<td><strong>
<a href="attr-color-invalid-cast.xht">attr-color-invalid-cast</a></strong></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td></td>
<td>Attribute references (colors)
<ul class="assert">
<li>Invalid color values in referenced attributes are replaced by the fallback value</li>
</ul>
</td>
</tr>
<tr id="attr-color-invalid-fallback-8.3" class="primary">
<td><strong>
<a href="attr-color-invalid-fallback.xht">attr-color-invalid-fallback</a></strong></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td></td>
<td>Attribute references (colors)
<ul class="assert">
<li>When the fallback value of an attr() function is invalid, the delcaration is ignored.</li>
</ul>
</td>
</tr>
<tr id="attr-color-valid-8.3" class="primary">
<td><strong>
<a href="attr-color-valid.xht">attr-color-valid</a></strong></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td></td>
<td>Attribute references (colors)
<ul class="assert">
<li>The value of the reference attribute is used correctly in the layout when it's a color.</li>
</ul>
</td>
</tr>
<tr id="attr-invalid-type-001-8.3" class="primary">
<td><strong>
<a href="attr-invalid-type-001.xht">attr-invalid-type-001</a></strong></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td></td>
<td>Attribute references (types)
<ul class="assert">
<li>When the type of an att() function is known and unexpected, the declaration is ingored</li>
</ul>
</td>
</tr>
<tr id="attr-invalid-type-002-8.3" class="primary">
<td><strong>
<a href="attr-invalid-type-002.xht">attr-invalid-type-002</a></strong></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td></td>
<td>Attribute references (types)
<ul class="assert">
<li>When the type of an att() function is known and unexpected, the declaration is ignored</li>
</ul>
</td>
</tr>
<tr id="attr-invalid-type-003-8.3" class="primary">
<td><strong>
<a href="attr-invalid-type-003.xht">attr-invalid-type-003</a></strong></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td></td>
<td>Attribute references (types)
<ul class="assert">
<li>When the type of an att() function is known and unexpected, the declaration is ignored</li>
</ul>
</td>
</tr>
<tr id="attr-length-invalid-cast-8.3" class="primary">
<td><strong>
<a href="attr-length-invalid-cast.xht">attr-length-invalid-cast</a></strong></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td></td>
<td>Attribute references (length)
<ul class="assert">
<li>When the value of referenced attribute isn't a valid length, the fallback value is unsed instead.</li>
</ul>
</td>
</tr>
<tr id="attr-length-invalid-fallback-8.3" class="primary">
<td><strong>
<a href="attr-length-invalid-fallback.xht">attr-length-invalid-fallback</a></strong></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td></td>
<td>Attribute references (length)
<ul class="assert">
<li>When the attr() fallback is an invalid length, the delcaration is correctly ignored.</li>
</ul>
</td>
</tr>
<tr id="attr-length-valid-8.3" class="primary">
<td><strong>
<a href="attr-length-valid.xht">attr-length-valid</a></strong></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td></td>
<td>Attribute references (length)
<ul class="assert">
<li>The value of referenced attribute is used correctly as a length.</li>
</ul>
</td>
</tr>
<tr id="attr-length-valid-zero-8.3" class="primary">
<td><strong>
<a href="attr-length-valid-zero.xht">attr-length-valid-zero</a></strong></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td></td>
<td>Attribute references (length)
<ul class="assert">
<li>The value of referenced attribute is used correctly as a length (even if it's 0).</li>
</ul>
</td>
</tr>
<tr id="attr-length-valid-zero-nofallback-8.3" class="primary">
<td><strong>
<a href="attr-length-valid-zero-nofallback.xht">attr-length-valid-zero-nofallback</a></strong></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td></td>
<td>Attribute references (length)
<ul class="assert">
<li>The value of referenced attribute is used correctly as a length (even if it's 0).</li>
</ul>
</td>
</tr>
<tr id="attr-px-invalid-cast-8.3" class="primary">
<td><strong>
<a href="attr-px-invalid-cast.xht">attr-px-invalid-cast</a></strong></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td></td>
<td>Attributes references (pixels)
<ul class="assert">
<li>When the value of the referenced attribute is not a pixel value, the fallback value is used instead.</li>
</ul>
</td>
</tr>
<tr id="attr-px-invalid-fallback-8.3" class="primary">
<td><strong>
<a href="attr-px-invalid-fallback.xht">attr-px-invalid-fallback</a></strong></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td></td>
<td>Attribute references (pixels)
<ul class="assert">
<li>When the fallback of a pixel attribute reference is invalid, the declaration is ignored.</li>
</ul>
</td>
</tr>
<tr id="attr-px-valid-8.3" class="primary">
<td><strong>
<a href="attr-px-valid.xht">attr-px-valid</a></strong></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td></td>
<td>Attribute references (pixels)
<ul class="assert">
<li>Attribute references for pixel values are replaced correctly at computed time.</li>
</ul>
</td>
</tr>
<tr id="initial-background-color-8.3" class="primary">
<td><strong>
<a href="initial-background-color.xht">initial-background-color</a></strong></td>
<td><a href="reference/all-green.xht">=</a> </td>
<td></td>
<td>Initial property and background-color
<ul class="assert">
<li>The initial keyword is supported on background-color.</li>
</ul>
</td>
</tr>
</tbody>
<tbody id="s8.3.#example-0366e27a">
<!-- 0 tests -->

View file

@ -0,0 +1,35 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>
CSS Values and Units + CSS Background and Borders Test:
Initial property and background-color
</title>
<meta content="
The initial keyword is supported on background-color.
" name="assert" />
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<link href="http://www.w3.org/TR/css3-values/#attr-notation" rel="help" />
<link href="reference/all-green.xht" rel="match" />
<style type="text/css">
html, body { margin: 0px; padding: 0px; }
html { background: green; overflow: hidden; }
#outer { position: absolute; top: 0px; left: 0px; red; width: 100%; height: 100%; }
#outer { background: red; background-color: initial; }
</style>
</head>
<body>
<div id="outer"></div>
</body></html>

View file

@ -0,0 +1,26 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>Test: support for calc in Media Queries</title>
<link href="http://florian.rivoal.net/" rel="author" title="Florian Rivoal" />
<link href="http://www.w3.org/TR/css3-values/#calc-notation" rel="help" />
<link href="reference/mq-calc-001-ref.xht" rel="match" />
<meta content="calc can be used in Media Queries" name="assert" />
<meta content="" name="flags" />
<style>
div {
width: 100px;
height: 100px;
background-color: red;
}
@media (min-width: calc(1px - 1px)){
div { background-color: green; }
}
</style>
</head>
<body>
<p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
<div></div>
</body></html>

View file

@ -0,0 +1,29 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>Test: evaluation of em in calc in Media Queries</title>
<link href="http://florian.rivoal.net/" rel="author" title="Florian Rivoal" />
<link href="http://www.w3.org/TR/css3-values/#calc-notation" rel="help" />
<link href="http://www.w3.org/TR/css3-mediaqueries/#units" rel="help" />
<link href="reference/mq-calc-001-ref.xht" rel="match" />
<meta content="The size in pixels of the 'em' unit used in calc inside a media query does not depend on declarations and use the initial value." name="assert" />
<meta content="" name="flags" />
<style>
:root { font-size: 30000px; }
p { font-size: 16px; }
div {
width: 100px;
height: 100px;
background-color: red;
}
@media (min-width: calc(1em)){
div { background-color: green; }
}
</style>
</head>
<body>
<p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
<div></div>
</body></html>

View file

@ -0,0 +1,29 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>Test: evaluation of ex in calc in Media Queries</title>
<link href="http://florian.rivoal.net/" rel="author" title="Florian Rivoal" />
<link href="http://www.w3.org/TR/css3-values/#calc-notation" rel="help" />
<link href="http://www.w3.org/TR/css3-mediaqueries/#units" rel="help" />
<link href="reference/mq-calc-001-ref.xht" rel="match" />
<meta content="The size in pixels of the 'ex' unit used in calc inside a media query does not depend on declarations and use the initial value." name="assert" />
<meta content="" name="flags" />
<style>
:root { font-size: 30000px; }
p { font-size: 16px; }
div {
width: 100px;
height: 100px;
background-color: red;
}
@media (min-width: calc(1ex)){
div { background-color: green; }
}
</style>
</head>
<body>
<p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
<div></div>
</body></html>

View file

@ -0,0 +1,29 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>Test: evaluation of ch in calc in Media Queries</title>
<link href="http://florian.rivoal.net/" rel="author" title="Florian Rivoal" />
<link href="http://www.w3.org/TR/css3-values/#calc-notation" rel="help" />
<link href="http://www.w3.org/TR/css3-mediaqueries/#units" rel="help" />
<link href="reference/mq-calc-001-ref.xht" rel="match" />
<meta content="The size in pixels of the 'ch' unit used in calc inside a media query does not depend on declarations and use the initial value." name="assert" />
<meta content="" name="flags" />
<style>
:root { font-size: 30000px; }
p { font-size: 16px; }
div {
width: 100px;
height: 100px;
background-color: red;
}
@media (min-width: calc(1ch)){
div { background-color: green; }
}
</style>
</head>
<body>
<p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
<div></div>
</body></html>

View file

@ -0,0 +1,29 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>Test: evaluation of rem in calc in Media Queries</title>
<link href="http://florian.rivoal.net/" rel="author" title="Florian Rivoal" />
<link href="http://www.w3.org/TR/css3-values/#calc-notation" rel="help" />
<link href="http://www.w3.org/TR/css3-mediaqueries/#units" rel="help" />
<link href="reference/mq-calc-001-ref.xht" rel="match" />
<meta content="The size in pixels of the 'rem' unit used in calc inside a media query does not depend on declarations and use the initial value." name="assert" />
<meta content="" name="flags" />
<style>
:root { font-size: 30000px; }
p { font-size: 16px; }
div {
width: 100px;
height: 100px;
background-color: red;
}
@media (min-width: calc(1rem)){
div { background-color: green; }
}
</style>
</head>
<body>
<p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
<div></div>
</body></html>

View file

@ -0,0 +1,29 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>
CSS Values and Units Test:
Viewport units are interpolated correctly (reference rendering)
</title>
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<style type="text/css">
html, body { margin: 0px; padding: 0px; }
html { background: white; overflow: hidden; }
#outer { position: relative; background: green; }
#outer { width: 200px; height: 200px; }
</style>
</head>
<body>
<div id="outer"></div>
</body></html>

View file

@ -0,0 +1,18 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>CSS Reftest Reference</title>
<link href="http://florian.rivoal.net/" rel="author" title="Florian Rivoal" />
<style>
div {
background-color:green;
height:100px;
width:100px;
}
</style>
</head>
<body>
<p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
<div></div>
</body></html>

View file

@ -24,6 +24,118 @@
<th>Flags</th>
</tr>
</thead>
<tbody id="attr-color-invalid-cast" class="">
<tr>
<td rowspan="1" title="Attribute references (colors)">
<a href="attr-color-invalid-cast.xht">attr-color-invalid-cast</a></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="attr-color-invalid-fallback" class="">
<tr>
<td rowspan="1" title="Attribute references (colors)">
<a href="attr-color-invalid-fallback.xht">attr-color-invalid-fallback</a></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="attr-color-valid" class="">
<tr>
<td rowspan="1" title="Attribute references (colors)">
<a href="attr-color-valid.xht">attr-color-valid</a></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="attr-invalid-type-001" class="">
<tr>
<td rowspan="1" title="Attribute references (types)">
<a href="attr-invalid-type-001.xht">attr-invalid-type-001</a></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="attr-invalid-type-002" class="">
<tr>
<td rowspan="1" title="Attribute references (types)">
<a href="attr-invalid-type-002.xht">attr-invalid-type-002</a></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="attr-invalid-type-003" class="">
<tr>
<td rowspan="1" title="Attribute references (types)">
<a href="attr-invalid-type-003.xht">attr-invalid-type-003</a></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="attr-length-invalid-cast" class="">
<tr>
<td rowspan="1" title="Attribute references (length)">
<a href="attr-length-invalid-cast.xht">attr-length-invalid-cast</a></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="attr-length-invalid-fallback" class="">
<tr>
<td rowspan="1" title="Attribute references (length)">
<a href="attr-length-invalid-fallback.xht">attr-length-invalid-fallback</a></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="attr-length-valid" class="">
<tr>
<td rowspan="1" title="Attribute references (length)">
<a href="attr-length-valid.xht">attr-length-valid</a></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="attr-length-valid-zero" class="">
<tr>
<td rowspan="1" title="Attribute references (length)">
<a href="attr-length-valid-zero.xht">attr-length-valid-zero</a></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="attr-length-valid-zero-nofallback" class="">
<tr>
<td rowspan="1" title="Attribute references (length)">
<a href="attr-length-valid-zero-nofallback.xht">attr-length-valid-zero-nofallback</a></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="attr-px-invalid-cast" class="">
<tr>
<td rowspan="1" title="Attributes references (pixels)">
<a href="attr-px-invalid-cast.xht">attr-px-invalid-cast</a></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="attr-px-invalid-fallback" class="">
<tr>
<td rowspan="1" title="Attribute references (pixels)">
<a href="attr-px-invalid-fallback.xht">attr-px-invalid-fallback</a></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="attr-px-valid" class="">
<tr>
<td rowspan="1" title="Attribute references (pixels)">
<a href="attr-px-valid.xht">attr-px-valid</a></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="calc-background-image-gradient-1" class="">
<tr>
<td rowspan="1" title="Test for calc() on background-image gradients">
@ -80,6 +192,38 @@
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="calc-in-calc" class="">
<tr>
<td rowspan="1" title="Calc() inside calc()">
<a href="calc-in-calc.xht">calc-in-calc</a></td>
<td><a href="reference/all-green.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="calc-in-media-queries-001" class="">
<tr>
<td rowspan="1" title="Calc function inside media queries">
<a href="calc-in-media-queries-001.xht">calc-in-media-queries-001</a></td>
<td><a href="reference/all-green.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="calc-in-media-queries-002" class="">
<tr>
<td rowspan="1" title="Calc function inside media queries">
<a href="calc-in-media-queries-002.xht">calc-in-media-queries-002</a></td>
<td><a href="reference/all-green.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="calc-invalid-range-clamping" class="">
<tr>
<td rowspan="1" title="Range clamping into calc() expressions">
<a href="calc-invalid-range-clamping.xht">calc-invalid-range-clamping</a></td>
<td><a href="reference/200-200-green.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="calc-margin-block-1" class="">
<tr>
<td rowspan="1" title="Test of margin-*: calc()">
@ -208,6 +352,14 @@
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="calc-parenthesis-stack" class="">
<tr>
<td rowspan="1" title="Calc() inside calc()">
<a href="calc-parenthesis-stack.xht">calc-parenthesis-stack</a></td>
<td><a href="reference/all-green.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="calc-text-indent-1" class="">
<tr>
<td rowspan="1" title="text-indent: calc() on blocks">
@ -280,6 +432,14 @@
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="initial-background-color" class="">
<tr>
<td rowspan="1" title="Initial property and background-color">
<a href="initial-background-color.xht">initial-background-color</a></td>
<td><a href="reference/all-green.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="min-width-001" class="">
<tr>
<td rowspan="1" title="min-width length value approximation">
@ -288,6 +448,46 @@
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="mq-calc-001" class="">
<tr>
<td rowspan="1" title="support for calc in Media Queries">
<a href="mq-calc-001.xht">mq-calc-001</a></td>
<td><a href="reference/mq-calc-001-ref.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="mq-calc-002" class="">
<tr>
<td rowspan="1" title="evaluation of em in calc in Media Queries">
<a href="mq-calc-002.xht">mq-calc-002</a></td>
<td><a href="reference/mq-calc-001-ref.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="mq-calc-003" class="">
<tr>
<td rowspan="1" title="evaluation of ex in calc in Media Queries">
<a href="mq-calc-003.xht">mq-calc-003</a></td>
<td><a href="reference/mq-calc-001-ref.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="mq-calc-004" class="">
<tr>
<td rowspan="1" title="evaluation of ch in calc in Media Queries">
<a href="mq-calc-004.xht">mq-calc-004</a></td>
<td><a href="reference/mq-calc-001-ref.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="mq-calc-005" class="">
<tr>
<td rowspan="1" title="evaluation of rem in calc in Media Queries">
<a href="mq-calc-005.xht">mq-calc-005</a></td>
<td><a href="reference/mq-calc-001-ref.xht">=</a> </td>
<td rowspan="1"></td>
</tr>
</tbody>
<tbody id="multicol-count-non-integer-001" class="ahem invalid">
<tr>
<td rowspan="1" title="non-integer 'column-count' value">

View file

@ -1,4 +1,18 @@
attr-color-invalid-cast.xht == reference/200-200-green.xht
attr-color-invalid-fallback.xht == reference/200-200-green.xht
attr-color-valid.xht == reference/200-200-green.xht
attr-invalid-type-001.xht == reference/200-200-green.xht
attr-invalid-type-002.xht == reference/200-200-green.xht
attr-invalid-type-003.xht == reference/200-200-green.xht
attr-length-invalid-cast.xht == reference/200-200-green.xht
attr-length-invalid-fallback.xht == reference/200-200-green.xht
attr-length-valid.xht == reference/200-200-green.xht
attr-length-valid-zero.xht == reference/200-200-green.xht
attr-length-valid-zero-nofallback.xht == reference/200-200-green.xht
attr-px-invalid-cast.xht == reference/200-200-green.xht
attr-px-invalid-fallback.xht == reference/200-200-green.xht
attr-px-valid.xht == reference/200-200-green.xht
calc-background-image-gradient-1.xht == reference/calc-background-image-gradient-1-ref.xht
calc-background-linear-gradient-1.xht == reference/calc-background-linear-gradient-1-ref.xht
calc-background-position-1.xht == reference/calc-background-position-1-ref.xht
@ -6,6 +20,10 @@ calc-background-size-1.xht == reference/calc-background-size-1-ref.xht
calc-border-radius-1.xht == reference/calc-border-radius-1-ref.xht
calc-height-block-1.xht == reference/calc-height-block-1-ref.xht
calc-height-table-1.xht == reference/calc-height-table-1-ref.xht
calc-in-calc.xht == reference/all-green.xht
calc-in-media-queries-001.xht == reference/all-green.xht
calc-in-media-queries-002.xht == reference/all-green.xht
calc-invalid-range-clamping.xht == reference/200-200-green.xht
calc-margin-block-1.xht == reference/calc-margin-block-1-ref.xht
calc-max-height-block-1.xht == reference/calc-max-height-block-1-ref.xht
calc-max-width-block-1.xht == reference/calc-width-block-1-ref.xht
@ -22,6 +40,7 @@ calc-offsets-relative-left-1.xht == reference/calc-offsets-relative-left-1-ref.x
calc-offsets-relative-right-1.xht == reference/calc-offsets-relative-left-1-ref.xht
calc-offsets-relative-top-1.xht == reference/calc-offsets-relative-top-1-ref.xht
calc-padding-block-1.xht == reference/calc-padding-block-1-ref.xht
calc-parenthesis-stack.xht == reference/all-green.xht
calc-text-indent-1.xht == reference/calc-text-indent-1-ref.xht
calc-text-indent-intrinsic-1.xht == reference/calc-text-indent-intrinsic-1-ref.xht
calc-transform-origin-1.xht == reference/calc-transform-origin-1-ref.xht
@ -31,7 +50,13 @@ calc-width-block-intrinsic-1.xht == reference/calc-width-block-intrinsic-1-ref.x
calc-width-table-auto-1.xht == reference/calc-width-table-auto-1-ref.xht
calc-width-table-fixed-1.xht == reference/calc-width-table-fixed-1-ref.xht
ch-unit-001.xht == reference/ch-unit-001-ref.xht
initial-background-color.xht == reference/all-green.xht
min-width-001.xht == ref.xht
mq-calc-001.xht == reference/mq-calc-001-ref.xht
mq-calc-002.xht == reference/mq-calc-001-ref.xht
mq-calc-003.xht == reference/mq-calc-001-ref.xht
mq-calc-004.xht == reference/mq-calc-001-ref.xht
mq-calc-005.xht == reference/mq-calc-001-ref.xht
multicol-count-non-integer-001.xht == reference/multicol-columns-invalid-001-ref.xht
multicol-count-non-integer-002.xht == reference/multicol-columns-invalid-001-ref.xht
multicol-count-non-integer-003.xht == reference/multicol-columns-invalid-001-ref.xht

View file

@ -0,0 +1,34 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>Shape Outside Circle args - calc() values</title>
<link href="http://html.adobe.com/" rel="author" title="Adobe" />
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
<link href="mailto:stearns@adobe.com" rel="reviewer" title="Alan Stearns" /> <!-- 2014-03-04 -->
<link href="http://www.w3.org/TR/css-shapes-1/#funcdef-circle" rel="help" />
<link href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property" rel="help" />
<link href="http://www.w3.org/TR/css3-values/#calc-notation" rel="help" />
<meta content="A circle's arguments may be in calc() values." name="assert" />
<meta content="dom" name="flags" />
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="support/parsing-utils.js"></script>
</head>
<body>
<div id="log"></div>
<script type="text/javascript">
var circle_calc_tests = [];
ParsingUtils.calcTestValues.forEach(function(value) {
testCase = ['circle('+ value[0] +')', 'circle('+ value[1] + ' at 50% 50%)'];
if(Object.prototype.toString.call( value[2] ) === '[object Array]' &amp;&amp; value[2].length == 2) {
testCase.push([ 'circle('+ value[2][0] + ' at 50% 50%)', 'circle('+ value[2][1] + ' at 50% 50%)']);
} else {
testCase.push('circle('+ value[2] + ' at 50% 50%)');
}
circle_calc_tests.push(testCase);
});
generate_tests(ParsingUtils.testInlineStyle, ParsingUtils.buildCalcTests(circle_calc_tests, 'value'));
generate_tests(ParsingUtils.testComputedStyle, ParsingUtils.buildCalcTests(circle_calc_tests, 'computed'));
</script>
</body></html>

View file

@ -0,0 +1,37 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>Shape Outside Circle position args - calc() values</title>
<link href="http://html.adobe.com/" rel="author" title="Adobe" />
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
<link href="mailto:stearns@adobe.com" rel="reviewer" title="Alan Stearns" /> <!-- 2014-03-04 -->
<link href="http://www.w3.org/TR/css-shapes-1/#funcdef-circle" rel="help" />
<link href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property" rel="help" />
<link href="http://www.w3.org/TR/css3-values/#calc-notation" rel="help" />
<meta content="A circle's &lt;position> arguments may be in calc() values." name="assert" />
<meta content="dom" name="flags" />
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="support/parsing-utils.js"></script>
</head>
<body>
<div id="log"></div>
<script type="text/javascript">
var circle_position_calc_tests = [];
ParsingUtils.calcTestValues.forEach(function(value) {
testCase = ['circle(at '+ value[0] +')',
'circle(at '+ value[1] +' 50%)'];
if(Object.prototype.toString.call( value[2] ) === '[object Array]' &amp;&amp; value[2].length == 2) {
testCase.push([ 'circle(at '+ value[2][0] +' 50%)',
'circle(at '+ value[2][1] +' 50%)'
]);
} else {
testCase.push('circle(at '+ value[2] +' 50%)');
}
circle_position_calc_tests.push(testCase);
});
generate_tests(ParsingUtils.testInlineStyle, ParsingUtils.buildCalcTests(circle_position_calc_tests, 'inline'));
generate_tests(ParsingUtils.testComputedStyle, ParsingUtils.buildCalcTests(circle_position_calc_tests, 'computed'));
</script>
</body></html>

View file

@ -0,0 +1,66 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>Shape Outside Ellipse args - calc() values</title>
<link href="http://html.adobe.com/" rel="author" title="Adobe" />
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
<link href="mailto:stearns@adobe.com" rel="reviewer" title="Alan Stearns" /> <!-- 2014-03-04 -->
<link href="http://www.w3.org/TR/css-shapes-1/#funcdef-ellipse" rel="help" />
<link href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property" rel="help" />
<link href="http://www.w3.org/TR/css3-values/#calc-notation" rel="help" />
<meta content="An ellipse's arguments may be in calc() values." name="assert" />
<meta content="dom" name="flags" />
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="support/parsing-utils.js"></script>
</head>
<body>
<div id="log"></div>
<script type="text/javascript">
var ellipse_calc_tests = [];
var defaultPosition = ' at 50% 50%';
ParsingUtils.calcTestValues.forEach(function(value) {
testCase = ['ellipse('+ value[0] +')',
'ellipse('+ value[1] + defaultPosition +')'];
if(Object.prototype.toString.call( value[2] ) === '[object Array]' &amp;&amp; value[2].length == 2) {
testCase.push([
'ellipse('+ value[2][0] + defaultPosition +')',
'ellipse('+ value[2][1] + defaultPosition +')',
]);
} else {
testCase.push('ellipse('+ value[2] + defaultPosition +')');
}
ellipse_calc_tests.push(testCase);
});
ParsingUtils.calcTestValues.forEach(function(value) {
testCase = ['ellipse(farthest-side '+ value[0] +')',
'ellipse(farthest-side '+ value[1] + defaultPosition +')'];
if(Object.prototype.toString.call( value[2] ) === '[object Array]' &amp;&amp; value[2].length == 2) {
testCase.push([
'ellipse(farthest-side '+ value[2][0] + defaultPosition +')',
'ellipse(farthest-side '+ value[2][1] + defaultPosition +')'
]);
} else {
testCase.push('ellipse(farthest-side '+ value[2] + defaultPosition +')');
}
ellipse_calc_tests.push(testCase);
});
ParsingUtils.calcTestValues.forEach(function(value) {
testCase = ['ellipse('+ value[0] +' '+ value[0] +')',
'ellipse('+ value[1] +' '+ value[1] + defaultPosition +')'];
if(Object.prototype.toString.call( value[2] ) === '[object Array]' &amp;&amp; value[2].length == 2) {
testCase.push([
'ellipse('+ value[2][0] +' '+ value[2][0] + defaultPosition +')',
'ellipse('+ value[2][1] +' '+ value[2][1] + defaultPosition +')'
]);
} else {
testCase.push('ellipse('+ value[2] +' '+ value[2] + defaultPosition +')');
}
ellipse_calc_tests.push(testCase);
});
generate_tests(ParsingUtils.testInlineStyle, ParsingUtils.buildCalcTests(ellipse_calc_tests, 'value'));
generate_tests(ParsingUtils.testComputedStyle, ParsingUtils.buildCalcTests(ellipse_calc_tests, 'computed'));
</script>
</body></html>

View file

@ -0,0 +1,64 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>Shape Outside Ellipse position args - calc() values</title>
<link href="http://html.adobe.com/" rel="author" title="Adobe" />
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
<link href="mailto:stearns@adobe.com" rel="reviewer" title="Alan Stearns" /> <!-- 2014-03-04 -->
<link href="http://www.w3.org/TR/css-shapes-1/#funcdef-ellipse" rel="help" />
<link href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property" rel="help" />
<link href="http://www.w3.org/TR/css3-values/#calc-notation" rel="help" />
<meta content="An ellipse's &lt;position> arguments may be in calc() values." name="assert" />
<meta content="dom" name="flags" />
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="support/parsing-utils.js"></script>
</head>
<body>
<div id="log"></div>
<script type="text/javascript">
var ellipse_position_calc_tests = [];
ParsingUtils.calcTestValues.forEach(function(value) {
testCase = ['ellipse(at '+ value[0] +' 50%)',
'ellipse(at '+ value[1] +' 50%)'];
if(Object.prototype.toString.call( value[2] ) === '[object Array]' &amp;&amp; value[2].length == 2) {
testCase.push([
'ellipse(at '+ value[2][0] +' 50%)',
'ellipse(at '+ value[2][1] +' 50%)'
]);
} else {
testCase.push('ellipse(at '+ value[2] +' 50%)');
}
ellipse_position_calc_tests.push(testCase);
});
ParsingUtils.calcTestValues.forEach(function(value) {
testCase = ['ellipse(farthest-side at '+ value[0] +' 50%)',
'ellipse(farthest-side at '+ value[1] +' 50%)'];
if(Object.prototype.toString.call( value[2] ) === '[object Array]' &amp;&amp; value[2].length == 2) {
testCase.push([
'ellipse(farthest-side at '+ value[2][0] +' 50%)',
'ellipse(farthest-side at '+ value[2][1] +' 50%)'
]);
} else {
testCase.push('ellipse(farthest-side at '+ value[2] +' 50%)');
}
ellipse_position_calc_tests.push(testCase);
});
ParsingUtils.calcTestValues.forEach(function(value) {
testCase = ['ellipse(closest-side farthest-side at '+ value[0] +' '+ value[0] +')',
'ellipse(closest-side farthest-side at '+ value[1] +' '+ value[1] +')'];
if(Object.prototype.toString.call( value[2] ) === '[object Array]' &amp;&amp; value[2].length == 2) {
testCase.push([
'ellipse(closest-side farthest-side at '+ value[2][0] +' '+ value[2][0] +')',
'ellipse(closest-side farthest-side at '+ value[2][1] +' '+ value[2][1] +')'
]);
} else {
testCase.push('ellipse(closest-side farthest-side at '+ value[2] +' '+ value[2] +')');
}
ellipse_position_calc_tests.push(testCase);
});
generate_tests(ParsingUtils.testInlineStyle, ParsingUtils.buildCalcTests(ellipse_position_calc_tests, 'inline'));
generate_tests(ParsingUtils.testComputedStyle, ParsingUtils.buildCalcTests(ellipse_position_calc_tests, 'computed'));
</script>
</body></html>

View file

@ -0,0 +1,45 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>Shape Outside Inset Args - calc() values</title>
<link href="http://html.adobe.com/" rel="author" title="Adobe" />
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
<link href="mailto:stearns@adobe.com" rel="reviewer" title="Alan Stearns" /> <!-- 2014-03-04 -->
<link href="http://www.w3.org/TR/css-shapes-1/#funcdef-inset" rel="help" />
<link href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property" rel="help" />
<link href="http://www.w3.org/TR/css3-values/#calc-notation" rel="help" />
<meta content="An inset's arguments may be in calc() values." name="assert" />
<meta content="dom" name="flags" />
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="support/parsing-utils.js"></script>
</head>
<body>
<div id="log"></div>
<script type="text/javascript">
var inset_calc_tests = [];
ParsingUtils.calcTestValues.forEach(function(value) {
testCase = ['inset('+ value[0] +')',
'inset('+ value[1] +')'];
if(Object.prototype.toString.call( value[2] ) === '[object Array]' &amp;&amp; value[2].length == 2) {
testCase.push([ 'inset('+ value[2][0] +')', 'inset('+ value[2][1] +')' ]);
} else {
testCase.push('inset('+ value[2] +')');
}
inset_calc_tests.push(testCase);
});
ParsingUtils.calcTestValues.forEach(function(value) {
testCase = ['inset('+ value[0] +' '+ value[0] +')',
'inset('+ value[1] +')'];
if(Object.prototype.toString.call( value[2] ) === '[object Array]' &amp;&amp; value[2].length == 2) {
testCase.push([ 'inset('+ value[2][0] +')', 'inset('+ value[2][1] +')' ]);
} else {
testCase.push('inset('+ value[2] +')');
}
inset_calc_tests.push(testCase);
});
generate_tests(ParsingUtils.testInlineStyle, ParsingUtils.buildCalcTests(inset_calc_tests, 'value'));
generate_tests(ParsingUtils.testComputedStyle, ParsingUtils.buildCalcTests(inset_calc_tests, 'computed'));
</script>
</body></html>

View file

@ -0,0 +1,55 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>Shape Outside Inset round args - calc() values</title>
<link href="http://html.adobe.com/" rel="author" title="Adobe" />
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
<link href="mailto:stearns@adobe.com" rel="reviewer" title="Alan Stearns" /> <!-- 2014-03-04 -->
<link href="http://www.w3.org/TR/css-shapes-1/#funcdef-inset" rel="help" />
<link href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property" rel="help" />
<link href="http://www.w3.org/TR/css3-values/#calc-notation" rel="help" />
<meta content="An inset's radial component arguments may be in calc() values." name="assert" />
<meta content="dom" name="flags" />
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="support/parsing-utils.js"></script>
</head>
<body>
<div id="log"></div>
<script type="text/javascript">
var fullInset = '10px 10px 10px 10px';
var serializedInset = "10px";
var inset_round_calc_tests = [];
ParsingUtils.calcTestValues.forEach(function(value) {
testCase = ['inset('+ fullInset +' round '+ value[0] +')',
'inset('+ serializedInset +' round '+ value[1] +')'];
// array check
if(Object.prototype.toString.call( value[2] ) === '[object Array]' &amp;&amp; value[2].length == 2) {
testCase.push([
'inset('+ serializedInset +' round '+ value[2][0] +')',
'inset('+ serializedInset +' round '+ value[2][1] +')'
]);
} else {
testCase.push('inset('+ serializedInset +' round '+ value[2] +')');
}
inset_round_calc_tests.push(testCase);
});
ParsingUtils.calcTestValues.forEach(function(value) {
testCase = ['inset('+ fullInset +' round '+ value[0] +' '+ value[0] +')',
'inset('+ serializedInset +' round '+ value[1] +')'];
if(Object.prototype.toString.call( value[2] ) === '[object Array]' &amp;&amp; value[2].length == 2) {
testCase.push([
'inset('+ serializedInset +' round '+ value[2][0] +')',
'inset('+ serializedInset +' round '+ value[2][1] +')'
]);
} else {
testCase.push('inset('+ serializedInset +' round '+ value[2] +')');
}
inset_round_calc_tests.push(testCase);
});
generate_tests(ParsingUtils.testInlineStyle, ParsingUtils.buildCalcTests(inset_round_calc_tests, 'inline'));
generate_tests(ParsingUtils.testComputedStyle, ParsingUtils.buildCalcTests(inset_round_calc_tests, 'computed'));
</script>
</body></html>

View file

@ -0,0 +1,51 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>Shape Outside Polygon args - calc() values</title>
<link href="http://html.adobe.com/" rel="author" title="Adobe" />
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
<link href="mailto:stearns@adobe.com" rel="reviewer" title="Alan Stearns" /> <!-- 2014-03-04 -->
<link href="http://www.w3.org/TR/css-shapes-1/#funcdef-polygon" rel="help" />
<link href="http://www.w3.org/TR/css-shapes-1/#shape-outside-property" rel="help" />
<link href="http://www.w3.org/TR/css3-values/#calc-notation" rel="help" />
<meta content="A polygon's arguments may be in calc() values." name="assert" />
<meta content="dom" name="flags" />
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="support/parsing-utils.js"></script>
</head>
<body>
<div id="log"></div>
<script type="text/javascript">
var polygon_calc_tests = [];
ParsingUtils.calcTestValues.forEach(function(value) {
testCase = ['polygon('+ value[0] +' '+ value[0] +')',
'polygon('+ value[1] +' '+ value[1] +')'];
if(Object.prototype.toString.call( value[2] ) === '[object Array]' &amp;&amp; value[2].length == 2) {
testCase.push([
'polygon('+ value[2][0] +' '+ value[2][0] +')',
'polygon('+ value[2][1] +' '+ value[2][1] +')'
]);
} else {
testCase.push('polygon('+ value[2] +' '+ value[2] +')');
}
polygon_calc_tests.push(testCase);
});
ParsingUtils.calcTestValues.forEach(function(value) {
testCase = ['polygon(evenodd, '+ value[0] +' '+ value[0] +', '+ value[0] +' '+ value[0] +')',
'polygon(evenodd, '+ value[1] +' '+ value[1] +', '+ value[1] +' '+ value[1] +')'];
if(Object.prototype.toString.call( value[2] ) === '[object Array]' &amp;&amp; value[2].length == 2) {
testCase.push([
'polygon(evenodd, '+ value[2][0] +' '+ value[2][0] +', '+ value[2][0] +' '+ value[2][0] +')',
'polygon(evenodd, '+ value[2][1] +' '+ value[2][1] +', '+ value[2][1] +' '+ value[2][1] +')'
]);
} else {
testCase.push('polygon(evenodd, '+ value[2] +' '+ value[2] +', '+ value[2] +' '+ value[2] +')');
}
polygon_calc_tests.push(testCase);
});
generate_tests(ParsingUtils.testInlineStyle, ParsingUtils.buildCalcTests(polygon_calc_tests, 'inline'));
generate_tests(ParsingUtils.testComputedStyle, ParsingUtils.buildCalcTests(polygon_calc_tests, 'computed'));
</script>
</body></html>

View file

@ -57,7 +57,7 @@
<tbody id="s8">
<tr><th><a href="chapter-8.xht">Chapter 8 -
Functional Notations</a></th>
<td>(32 Tests)</td></tr>
<td>(66 Tests)</td></tr>
</tbody>
<tbody id="s9">
<tr><th><a href="chapter-9.xht">Chapter 9 -

View file

@ -13,7 +13,7 @@
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<link href="http://www.w3.org/TR/css3-values/#viewport-relative-lengths" rel="help" />
<link href="http://www.w3.org/TR/css3-values/#calc" rel="help" />
<link href="http://www.w3.org/TR/css3-values/#calc-notation" rel="help" />
<link href="reference/all-green.xht" rel="match" />

View file

@ -13,7 +13,7 @@
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
<link href="http://www.w3.org/TR/css3-values/#viewport-relative-lengths" rel="help" />
<link href="http://www.w3.org/TR/css3-values/#calc" rel="help" />
<link href="http://www.w3.org/TR/css3-values/#calc-notation" rel="help" />
<link href="reference/all-green.xht" rel="match" />