mirror of
https://github.com/servo/servo.git
synced 2025-08-07 06:25:32 +01:00
Update CSS tests to revision c68e4df16362489debde94340cc6f54945a72f2f
This commit is contained in:
parent
32efe41299
commit
53608a60a4
1543 changed files with 42190 additions and 14617 deletions
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
36
tests/wpt/css-tests/css-values-3_dev/html/attr-px-valid.htm
Normal file
36
tests/wpt/css-tests/css-values-3_dev/html/attr-px-valid.htm
Normal file
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
35
tests/wpt/css-tests/css-values-3_dev/html/calc-in-calc.htm
Normal file
35
tests/wpt/css-tests/css-values-3_dev/html/calc-in-calc.htm
Normal file
|
@ -0,0 +1,35 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
|
@ -0,0 +1,35 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
|
@ -0,0 +1,35 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
|
@ -0,0 +1,37 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
|
@ -0,0 +1,35 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
|
@ -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 id="refs-column">
|
||||
|
@ -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.htm">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.htm">calc-in-calc</a></strong></td>
|
||||
<td><a href="reference/all-green.htm">=</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.htm">calc-in-media-queries-001</a></strong></td>
|
||||
<td><a href="reference/all-green.htm">=</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.htm">calc-in-media-queries-002</a></strong></td>
|
||||
<td><a href="reference/all-green.htm">=</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.htm">calc-invalid-range-clamping</a></strong></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">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.htm">calc-parenthesis-stack</a></strong></td>
|
||||
<td><a href="reference/all-green.htm">=</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.htm">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.htm">mq-calc-001</a></strong></td>
|
||||
<td><a href="reference/mq-calc-001-ref.htm">=</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.htm">mq-calc-002</a></strong></td>
|
||||
<td><a href="reference/mq-calc-001-ref.htm">=</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.htm">mq-calc-003</a></strong></td>
|
||||
<td><a href="reference/mq-calc-001-ref.htm">=</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.htm">mq-calc-004</a></strong></td>
|
||||
<td><a href="reference/mq-calc-001-ref.htm">=</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.htm">mq-calc-005</a></strong></td>
|
||||
<td><a href="reference/mq-calc-001-ref.htm">=</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.htm">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.htm">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 <position> 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.htm">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.htm">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 <position> 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.htm">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.htm">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.htm">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.htm">vh-calc-support</a></td>
|
||||
<td><a href="reference/all-green.htm">=</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.htm">vh-calc-support-pct</a></td>
|
||||
<td><a href="reference/all-green.htm">=</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.htm">attr-color-invalid-cast</a></strong></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-color-invalid-fallback</a></strong></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-color-valid</a></strong></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-invalid-type-001</a></strong></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-invalid-type-002</a></strong></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-invalid-type-003</a></strong></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-length-invalid-cast</a></strong></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-length-invalid-fallback</a></strong></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-length-valid</a></strong></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-length-valid-zero</a></strong></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-length-valid-zero-nofallback</a></strong></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-px-invalid-cast</a></strong></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-px-invalid-fallback</a></strong></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-px-valid</a></strong></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">initial-background-color</a></strong></td>
|
||||
<td><a href="reference/all-green.htm">=</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 -->
|
||||
|
|
|
@ -0,0 +1,35 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
26
tests/wpt/css-tests/css-values-3_dev/html/mq-calc-001.htm
Normal file
26
tests/wpt/css-tests/css-values-3_dev/html/mq-calc-001.htm
Normal file
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
29
tests/wpt/css-tests/css-values-3_dev/html/mq-calc-002.htm
Normal file
29
tests/wpt/css-tests/css-values-3_dev/html/mq-calc-002.htm
Normal file
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
29
tests/wpt/css-tests/css-values-3_dev/html/mq-calc-003.htm
Normal file
29
tests/wpt/css-tests/css-values-3_dev/html/mq-calc-003.htm
Normal file
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
29
tests/wpt/css-tests/css-values-3_dev/html/mq-calc-004.htm
Normal file
29
tests/wpt/css-tests/css-values-3_dev/html/mq-calc-004.htm
Normal file
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
29
tests/wpt/css-tests/css-values-3_dev/html/mq-calc-005.htm
Normal file
29
tests/wpt/css-tests/css-values-3_dev/html/mq-calc-005.htm
Normal file
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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.htm" 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>
|
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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>
|
|
@ -0,0 +1,18 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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>
|
|
@ -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.htm">attr-color-invalid-cast</a></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-color-invalid-fallback</a></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-color-valid</a></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-invalid-type-001</a></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-invalid-type-002</a></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-invalid-type-003</a></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-length-invalid-cast</a></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-length-invalid-fallback</a></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-length-valid</a></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-length-valid-zero</a></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-length-valid-zero-nofallback</a></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-px-invalid-cast</a></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-px-invalid-fallback</a></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">attr-px-valid</a></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">calc-in-calc</a></td>
|
||||
<td><a href="reference/all-green.htm">=</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.htm">calc-in-media-queries-001</a></td>
|
||||
<td><a href="reference/all-green.htm">=</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.htm">calc-in-media-queries-002</a></td>
|
||||
<td><a href="reference/all-green.htm">=</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.htm">calc-invalid-range-clamping</a></td>
|
||||
<td><a href="reference/200-200-green.htm">=</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.htm">calc-parenthesis-stack</a></td>
|
||||
<td><a href="reference/all-green.htm">=</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.htm">initial-background-color</a></td>
|
||||
<td><a href="reference/all-green.htm">=</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.htm">mq-calc-001</a></td>
|
||||
<td><a href="reference/mq-calc-001-ref.htm">=</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.htm">mq-calc-002</a></td>
|
||||
<td><a href="reference/mq-calc-001-ref.htm">=</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.htm">mq-calc-003</a></td>
|
||||
<td><a href="reference/mq-calc-001-ref.htm">=</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.htm">mq-calc-004</a></td>
|
||||
<td><a href="reference/mq-calc-001-ref.htm">=</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.htm">mq-calc-005</a></td>
|
||||
<td><a href="reference/mq-calc-001-ref.htm">=</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">
|
||||
|
|
|
@ -1,4 +1,18 @@
|
|||
|
||||
attr-color-invalid-cast.htm == reference/200-200-green.htm
|
||||
attr-color-invalid-fallback.htm == reference/200-200-green.htm
|
||||
attr-color-valid.htm == reference/200-200-green.htm
|
||||
attr-invalid-type-001.htm == reference/200-200-green.htm
|
||||
attr-invalid-type-002.htm == reference/200-200-green.htm
|
||||
attr-invalid-type-003.htm == reference/200-200-green.htm
|
||||
attr-length-invalid-cast.htm == reference/200-200-green.htm
|
||||
attr-length-invalid-fallback.htm == reference/200-200-green.htm
|
||||
attr-length-valid.htm == reference/200-200-green.htm
|
||||
attr-length-valid-zero.htm == reference/200-200-green.htm
|
||||
attr-length-valid-zero-nofallback.htm == reference/200-200-green.htm
|
||||
attr-px-invalid-cast.htm == reference/200-200-green.htm
|
||||
attr-px-invalid-fallback.htm == reference/200-200-green.htm
|
||||
attr-px-valid.htm == reference/200-200-green.htm
|
||||
calc-background-image-gradient-1.htm == reference/calc-background-image-gradient-1-ref.htm
|
||||
calc-background-linear-gradient-1.htm == reference/calc-background-linear-gradient-1-ref.htm
|
||||
calc-background-position-1.htm == reference/calc-background-position-1-ref.htm
|
||||
|
@ -6,6 +20,10 @@ calc-background-size-1.htm == reference/calc-background-size-1-ref.htm
|
|||
calc-border-radius-1.htm == reference/calc-border-radius-1-ref.htm
|
||||
calc-height-block-1.htm == reference/calc-height-block-1-ref.htm
|
||||
calc-height-table-1.htm == reference/calc-height-table-1-ref.htm
|
||||
calc-in-calc.htm == reference/all-green.htm
|
||||
calc-in-media-queries-001.htm == reference/all-green.htm
|
||||
calc-in-media-queries-002.htm == reference/all-green.htm
|
||||
calc-invalid-range-clamping.htm == reference/200-200-green.htm
|
||||
calc-margin-block-1.htm == reference/calc-margin-block-1-ref.htm
|
||||
calc-max-height-block-1.htm == reference/calc-max-height-block-1-ref.htm
|
||||
calc-max-width-block-1.htm == reference/calc-width-block-1-ref.htm
|
||||
|
@ -22,6 +40,7 @@ calc-offsets-relative-left-1.htm == reference/calc-offsets-relative-left-1-ref.h
|
|||
calc-offsets-relative-right-1.htm == reference/calc-offsets-relative-left-1-ref.htm
|
||||
calc-offsets-relative-top-1.htm == reference/calc-offsets-relative-top-1-ref.htm
|
||||
calc-padding-block-1.htm == reference/calc-padding-block-1-ref.htm
|
||||
calc-parenthesis-stack.htm == reference/all-green.htm
|
||||
calc-text-indent-1.htm == reference/calc-text-indent-1-ref.htm
|
||||
calc-text-indent-intrinsic-1.htm == reference/calc-text-indent-intrinsic-1-ref.htm
|
||||
calc-transform-origin-1.htm == reference/calc-transform-origin-1-ref.htm
|
||||
|
@ -31,7 +50,13 @@ calc-width-block-intrinsic-1.htm == reference/calc-width-block-intrinsic-1-ref.h
|
|||
calc-width-table-auto-1.htm == reference/calc-width-table-auto-1-ref.htm
|
||||
calc-width-table-fixed-1.htm == reference/calc-width-table-fixed-1-ref.htm
|
||||
ch-unit-001.htm == reference/ch-unit-001-ref.htm
|
||||
initial-background-color.htm == reference/all-green.htm
|
||||
min-width-001.htm == ref.htm
|
||||
mq-calc-001.htm == reference/mq-calc-001-ref.htm
|
||||
mq-calc-002.htm == reference/mq-calc-001-ref.htm
|
||||
mq-calc-003.htm == reference/mq-calc-001-ref.htm
|
||||
mq-calc-004.htm == reference/mq-calc-001-ref.htm
|
||||
mq-calc-005.htm == reference/mq-calc-001-ref.htm
|
||||
multicol-count-non-integer-001.htm == reference/multicol-columns-invalid-001-ref.htm
|
||||
multicol-count-non-integer-002.htm == reference/multicol-columns-invalid-001-ref.htm
|
||||
multicol-count-non-integer-003.htm == reference/multicol-columns-invalid-001-ref.htm
|
||||
|
|
|
@ -0,0 +1,34 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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]' && 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>
|
|
@ -0,0 +1,37 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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 <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]' && 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>
|
|
@ -0,0 +1,66 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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]' && 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]' && 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]' && 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>
|
|
@ -0,0 +1,64 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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 <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]' && 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]' && 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]' && 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>
|
|
@ -0,0 +1,45 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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]' && 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]' && 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>
|
|
@ -0,0 +1,55 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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]' && 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]' && 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>
|
|
@ -0,0 +1,51 @@
|
|||
<!DOCTYPE html>
|
||||
<html><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]' && 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]' && 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>
|
|
@ -57,7 +57,7 @@
|
|||
<tbody id="s8">
|
||||
<tr><th><a href="chapter-8.htm">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.htm">Chapter 9 -
|
||||
|
|
|
@ -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.htm" rel="match">
|
||||
|
||||
|
|
|
@ -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.htm" rel="match">
|
||||
|
||||
|
|
|
@ -5,6 +5,34 @@
|
|||
testname revision result comment
|
||||
html/absolute_length_units.htm 1e0e4f150942320da5e8bab9f573add223fe72f7 ?
|
||||
xhtml1/absolute_length_units.xht 1e0e4f150942320da5e8bab9f573add223fe72f7 ?
|
||||
html/attr-color-invalid-cast.htm 407532d9777573b35ed46612258978b12fdad220 ?
|
||||
xhtml1/attr-color-invalid-cast.xht 407532d9777573b35ed46612258978b12fdad220 ?
|
||||
html/attr-color-invalid-fallback.htm d235a2253570f1e0931b2c399282bcee80c60fe5 ?
|
||||
xhtml1/attr-color-invalid-fallback.xht d235a2253570f1e0931b2c399282bcee80c60fe5 ?
|
||||
html/attr-color-valid.htm d66b104469808e8525a049ec46a8d6b90f4ab97d ?
|
||||
xhtml1/attr-color-valid.xht d66b104469808e8525a049ec46a8d6b90f4ab97d ?
|
||||
html/attr-invalid-type-001.htm 6648df36d70c701b70a4270e090b1e9769be591d ?
|
||||
xhtml1/attr-invalid-type-001.xht 6648df36d70c701b70a4270e090b1e9769be591d ?
|
||||
html/attr-invalid-type-002.htm 08d0d3e0d1916b5318bfbb33d0d9679f9e7f8116 ?
|
||||
xhtml1/attr-invalid-type-002.xht 08d0d3e0d1916b5318bfbb33d0d9679f9e7f8116 ?
|
||||
html/attr-invalid-type-003.htm 08d0d3e0d1916b5318bfbb33d0d9679f9e7f8116 ?
|
||||
xhtml1/attr-invalid-type-003.xht 08d0d3e0d1916b5318bfbb33d0d9679f9e7f8116 ?
|
||||
html/attr-length-invalid-cast.htm 27e0c4488ea1905ecc2decfb5a3784e0b4ce9271 ?
|
||||
xhtml1/attr-length-invalid-cast.xht 27e0c4488ea1905ecc2decfb5a3784e0b4ce9271 ?
|
||||
html/attr-length-invalid-fallback.htm 2c6160116c968d46cda19c9745eeea3f53f2fca8 ?
|
||||
xhtml1/attr-length-invalid-fallback.xht 2c6160116c968d46cda19c9745eeea3f53f2fca8 ?
|
||||
html/attr-length-valid-zero-nofallback.htm fe4957c7464b362b065dba15c2440d5942efe37b ?
|
||||
xhtml1/attr-length-valid-zero-nofallback.xht fe4957c7464b362b065dba15c2440d5942efe37b ?
|
||||
html/attr-length-valid-zero.htm f2c1bdf2abb7438c21a7aec70d7d59adb607b7df ?
|
||||
xhtml1/attr-length-valid-zero.xht f2c1bdf2abb7438c21a7aec70d7d59adb607b7df ?
|
||||
html/attr-length-valid.htm 375b35da15f09380b6106b3f10fe69eae8804eb3 ?
|
||||
xhtml1/attr-length-valid.xht 375b35da15f09380b6106b3f10fe69eae8804eb3 ?
|
||||
html/attr-px-invalid-cast.htm 801574b1a020ef54bb489c8a791fd10e0fab0a69 ?
|
||||
xhtml1/attr-px-invalid-cast.xht 801574b1a020ef54bb489c8a791fd10e0fab0a69 ?
|
||||
html/attr-px-invalid-fallback.htm ed5e6e890516bf17df250f5d6d4ba7fd373c3f2f ?
|
||||
xhtml1/attr-px-invalid-fallback.xht ed5e6e890516bf17df250f5d6d4ba7fd373c3f2f ?
|
||||
html/attr-px-valid.htm cfd19762bc5e2469a63dcf798ccaf7ab416b0542 ?
|
||||
xhtml1/attr-px-valid.xht cfd19762bc5e2469a63dcf798ccaf7ab416b0542 ?
|
||||
html/calc-background-image-gradient-1.htm 4908626b6c3bd6da5d47ec5ee366e0c06d8cae50 ?
|
||||
xhtml1/calc-background-image-gradient-1.xht 4908626b6c3bd6da5d47ec5ee366e0c06d8cae50 ?
|
||||
html/calc-background-linear-gradient-1.htm 89f5dc390231b59bc044bde93bb4cc3133002df6 ?
|
||||
|
@ -19,6 +47,14 @@ html/calc-height-block-1.htm 952526a2250e62df4cd71c656df40c8e1583d802 ?
|
|||
xhtml1/calc-height-block-1.xht 952526a2250e62df4cd71c656df40c8e1583d802 ?
|
||||
html/calc-height-table-1.htm aaa87fc375b1f80271853d2c80fa30e6e7953c05 ?
|
||||
xhtml1/calc-height-table-1.xht aaa87fc375b1f80271853d2c80fa30e6e7953c05 ?
|
||||
html/calc-in-calc.htm bdf08b589fb1b18d33858b1fadbf22dbdbcd8b10 ?
|
||||
xhtml1/calc-in-calc.xht bdf08b589fb1b18d33858b1fadbf22dbdbcd8b10 ?
|
||||
html/calc-in-media-queries-001.htm 76041848c2d73ff643ff2ae5b858e92ecc0661eb ?
|
||||
xhtml1/calc-in-media-queries-001.xht 76041848c2d73ff643ff2ae5b858e92ecc0661eb ?
|
||||
html/calc-in-media-queries-002.htm 4b4079fde947d7f5774601249a38067946206375 ?
|
||||
xhtml1/calc-in-media-queries-002.xht 4b4079fde947d7f5774601249a38067946206375 ?
|
||||
html/calc-invalid-range-clamping.htm b27b28c5a0fe3027e23fadc94ca18e15cecc1668 ?
|
||||
xhtml1/calc-invalid-range-clamping.xht b27b28c5a0fe3027e23fadc94ca18e15cecc1668 ?
|
||||
html/calc-margin-block-1.htm 1d7889b64fd00e87e2b2961c5e42e6af8577ae5a ?
|
||||
xhtml1/calc-margin-block-1.xht 1d7889b64fd00e87e2b2961c5e42e6af8577ae5a ?
|
||||
html/calc-max-height-block-1.htm f59e64c55e4610b5e23a0cf99f646f657d0ae58f ?
|
||||
|
@ -51,6 +87,8 @@ html/calc-offsets-relative-top-1.htm 138f42115aa281eabba1eb4ea3b327d917c05e83 ?
|
|||
xhtml1/calc-offsets-relative-top-1.xht 138f42115aa281eabba1eb4ea3b327d917c05e83 ?
|
||||
html/calc-padding-block-1.htm 0a6fcb06af632bc921b8fdcf6e84dc9632747d0d ?
|
||||
xhtml1/calc-padding-block-1.xht 0a6fcb06af632bc921b8fdcf6e84dc9632747d0d ?
|
||||
html/calc-parenthesis-stack.htm ffdf1230c02a969b14103645c50a5940603c1dda ?
|
||||
xhtml1/calc-parenthesis-stack.xht ffdf1230c02a969b14103645c50a5940603c1dda ?
|
||||
html/calc-text-indent-1.htm 4791e504f1036b2c117a842014409132ffc0f8e0 ?
|
||||
xhtml1/calc-text-indent-1.xht 4791e504f1036b2c117a842014409132ffc0f8e0 ?
|
||||
html/calc-text-indent-intrinsic-1.htm 212d0b36c668eb0ce4b8fbffb7ddc91faac7ef10 ?
|
||||
|
@ -71,8 +109,20 @@ html/calc-width-table-fixed-1.htm b16a53e8a8072b68c6bd91790cc982cccbcf2bc6 ?
|
|||
xhtml1/calc-width-table-fixed-1.xht b16a53e8a8072b68c6bd91790cc982cccbcf2bc6 ?
|
||||
html/ch-unit-001.htm 4c390e4f1e8b24beaa0520c61466cd43e87a62c8 ?
|
||||
xhtml1/ch-unit-001.xht 4c390e4f1e8b24beaa0520c61466cd43e87a62c8 ?
|
||||
html/initial-background-color.htm 272a0b7d54a124e269f48dea39a62c62f8340943 ?
|
||||
xhtml1/initial-background-color.xht 272a0b7d54a124e269f48dea39a62c62f8340943 ?
|
||||
html/min-width-001.htm edff68d05ca48525e5456d924b43578c8dfdbf57 ?
|
||||
xhtml1/min-width-001.xht edff68d05ca48525e5456d924b43578c8dfdbf57 ?
|
||||
html/mq-calc-001.htm 7e98c39bcf90aaad01b9a98249c7577476980edc ?
|
||||
xhtml1/mq-calc-001.xht 7e98c39bcf90aaad01b9a98249c7577476980edc ?
|
||||
html/mq-calc-002.htm 0cacb89c9a83b3c696156eb81b19fbe466dc0fa1 ?
|
||||
xhtml1/mq-calc-002.xht 0cacb89c9a83b3c696156eb81b19fbe466dc0fa1 ?
|
||||
html/mq-calc-003.htm 3412e0e24953015d4e8f2f3d98b76cd63adf5eb6 ?
|
||||
xhtml1/mq-calc-003.xht 3412e0e24953015d4e8f2f3d98b76cd63adf5eb6 ?
|
||||
html/mq-calc-004.htm 68791138cef29002ea9c8fc54d0dd7ec34375fd1 ?
|
||||
xhtml1/mq-calc-004.xht 68791138cef29002ea9c8fc54d0dd7ec34375fd1 ?
|
||||
html/mq-calc-005.htm 305ee11ac9a53f8610670beb20e1bb8ce9392d75 ?
|
||||
xhtml1/mq-calc-005.xht 305ee11ac9a53f8610670beb20e1bb8ce9392d75 ?
|
||||
html/multicol-count-non-integer-001.htm 6ebfd7a8bb7081898fed146d154ff0c1119f05e1 ?
|
||||
xhtml1/multicol-count-non-integer-001.xht 6ebfd7a8bb7081898fed146d154ff0c1119f05e1 ?
|
||||
html/multicol-count-non-integer-002.htm ed064290bd392497aad5107e30a9e336532a4d31 ?
|
||||
|
@ -95,22 +145,36 @@ html/shape-outside-circle-002.htm 8a1c43c953fe3b82edd77025bbf55b77475c59f0 ?
|
|||
xhtml1/shape-outside-circle-002.xht 8a1c43c953fe3b82edd77025bbf55b77475c59f0 ?
|
||||
html/shape-outside-circle-004.htm 44092ed692b65149dd5593c1aecce3f4d3352600 ?
|
||||
xhtml1/shape-outside-circle-004.xht 44092ed692b65149dd5593c1aecce3f4d3352600 ?
|
||||
html/shape-outside-circle-010.htm 607e2d5c6f3cff8a2d826c391d39d86c68759214 ?
|
||||
xhtml1/shape-outside-circle-010.xht 607e2d5c6f3cff8a2d826c391d39d86c68759214 ?
|
||||
html/shape-outside-circle-011.htm 6ec13da059ac1bf92db6fa4455e8f40c20af958e ?
|
||||
xhtml1/shape-outside-circle-011.xht 6ec13da059ac1bf92db6fa4455e8f40c20af958e ?
|
||||
html/shape-outside-ellipse-002.htm e069870229afea5bc6dbf4b6768c847230aafc09 ?
|
||||
xhtml1/shape-outside-ellipse-002.xht e069870229afea5bc6dbf4b6768c847230aafc09 ?
|
||||
html/shape-outside-ellipse-004.htm cf7a179b06597950e51c08580c0bcc5d7476e1c1 ?
|
||||
xhtml1/shape-outside-ellipse-004.xht cf7a179b06597950e51c08580c0bcc5d7476e1c1 ?
|
||||
html/shape-outside-ellipse-010.htm 3fc7f06c7d68753e41e7ed78c9ebf3d695419a12 ?
|
||||
xhtml1/shape-outside-ellipse-010.xht 3fc7f06c7d68753e41e7ed78c9ebf3d695419a12 ?
|
||||
html/shape-outside-ellipse-011.htm 8efb4584d3c1c812aea1831ef4e272f719cd4e7d ?
|
||||
xhtml1/shape-outside-ellipse-011.xht 8efb4584d3c1c812aea1831ef4e272f719cd4e7d ?
|
||||
html/shape-outside-inset-003.htm a28821639a481807aba32477b3ad98a7bec40b41 ?
|
||||
xhtml1/shape-outside-inset-003.xht a28821639a481807aba32477b3ad98a7bec40b41 ?
|
||||
html/shape-outside-inset-008.htm 99dbe179f30b42dea217ec39b2776c4418f7101b ?
|
||||
xhtml1/shape-outside-inset-008.xht 99dbe179f30b42dea217ec39b2776c4418f7101b ?
|
||||
html/shape-outside-inset-009.htm 8106a6db182206593437508cfb2a5a1f8bff3c53 ?
|
||||
xhtml1/shape-outside-inset-009.xht 8106a6db182206593437508cfb2a5a1f8bff3c53 ?
|
||||
html/shape-outside-polygon-004.htm e4bb8c0597a4b08fe5d5e94f83f94e7adf0dfb90 ?
|
||||
xhtml1/shape-outside-polygon-004.xht e4bb8c0597a4b08fe5d5e94f83f94e7adf0dfb90 ?
|
||||
html/shape-outside-polygon-006.htm d7519eee54407dff4909d0ab804580dcae8e96b9 ?
|
||||
xhtml1/shape-outside-polygon-006.xht d7519eee54407dff4909d0ab804580dcae8e96b9 ?
|
||||
html/transition-delay-001.htm 936ec60d74c61f54ba71930eafbd8db9c5e84e82 ?
|
||||
xhtml1/transition-delay-001.xht 936ec60d74c61f54ba71930eafbd8db9c5e84e82 ?
|
||||
html/transition-duration-001.htm 663439e329a5e15084fda9eb5be1ac7d2e0dc5f7 ?
|
||||
xhtml1/transition-duration-001.xht 663439e329a5e15084fda9eb5be1ac7d2e0dc5f7 ?
|
||||
html/vh-calc-support-pct.htm 094f5381d9f411a374844075893597b78fb15b46 ?
|
||||
xhtml1/vh-calc-support-pct.xht 094f5381d9f411a374844075893597b78fb15b46 ?
|
||||
html/vh-calc-support.htm 92ae3e98da13a95fdcd08517692d0ee79a39810b ?
|
||||
xhtml1/vh-calc-support.xht 92ae3e98da13a95fdcd08517692d0ee79a39810b ?
|
||||
html/vh-calc-support-pct.htm 23bb4d003b19c48d16bdd04eb1da62451c0fcc3e ?
|
||||
xhtml1/vh-calc-support-pct.xht 23bb4d003b19c48d16bdd04eb1da62451c0fcc3e ?
|
||||
html/vh-calc-support.htm bfe3e7029dbbeeeeee64d6e732a9b8aa13b286be ?
|
||||
xhtml1/vh-calc-support.xht bfe3e7029dbbeeeeee64d6e732a9b8aa13b286be ?
|
||||
html/vh-em-inherit.htm bd54e3e097d1f4b5799a696bfffeebf5561c072f ?
|
||||
xhtml1/vh-em-inherit.xht bd54e3e097d1f4b5799a696bfffeebf5561c072f ?
|
||||
html/vh-inherit.htm e006cf0e4f727a753c115bb062ed9aa3854375b0 ?
|
||||
|
|
|
@ -1,5 +1,19 @@
|
|||
id references title flags links revision credits assertion
|
||||
absolute_length_units elements should be the real world size given in mm, cm, inches... http://www.w3.org/TR/css3-values/#viewport-relative-lengths 1e0e4f150942320da5e8bab9f573add223fe72f7 `Marc Bourlon`<mailto:marc@bourlon.com> elements are not displayed with the real world size units they should be, when specified in millimeters, centimeters, inches, ...
|
||||
attr-color-invalid-cast reference/200-200-green Attribute references (colors) http://www.w3.org/TR/css3-values/#attr-notation 407532d9777573b35ed46612258978b12fdad220 `François REMY`<mailto:fremycompany.developer@yahoo.fr> Invalid color values in referenced attributes are replaced by the fallback value
|
||||
attr-color-invalid-fallback reference/200-200-green Attribute references (colors) http://www.w3.org/TR/css3-values/#attr-notation d235a2253570f1e0931b2c399282bcee80c60fe5 `François REMY`<mailto:fremycompany.developer@yahoo.fr> When the fallback value of an attr() function is invalid, the delcaration is ignored.
|
||||
attr-color-valid reference/200-200-green Attribute references (colors) http://www.w3.org/TR/css3-values/#attr-notation d66b104469808e8525a049ec46a8d6b90f4ab97d `François REMY`<mailto:fremycompany.developer@yahoo.fr> The value of the reference attribute is used correctly in the layout when it's a color.
|
||||
attr-invalid-type-001 reference/200-200-green Attribute references (types) http://www.w3.org/TR/css3-values/#attr-notation 6648df36d70c701b70a4270e090b1e9769be591d `François REMY`<mailto:fremycompany.developer@yahoo.fr> When the type of an att() function is known and unexpected, the declaration is ingored
|
||||
attr-invalid-type-002 reference/200-200-green Attribute references (types) http://www.w3.org/TR/css3-values/#attr-notation 08d0d3e0d1916b5318bfbb33d0d9679f9e7f8116 `François REMY`<mailto:fremycompany.developer@yahoo.fr> When the type of an att() function is known and unexpected, the declaration is ignored
|
||||
attr-invalid-type-003 reference/200-200-green Attribute references (types) http://www.w3.org/TR/css3-values/#attr-notation 08d0d3e0d1916b5318bfbb33d0d9679f9e7f8116 `François REMY`<mailto:fremycompany.developer@yahoo.fr> When the type of an att() function is known and unexpected, the declaration is ignored
|
||||
attr-length-invalid-cast reference/200-200-green Attribute references (length) http://www.w3.org/TR/css3-values/#attr-notation 27e0c4488ea1905ecc2decfb5a3784e0b4ce9271 `François REMY`<mailto:fremycompany.developer@yahoo.fr> When the value of referenced attribute isn't a valid length, the fallback value is unsed instead.
|
||||
attr-length-invalid-fallback reference/200-200-green Attribute references (length) http://www.w3.org/TR/css3-values/#attr-notation 2c6160116c968d46cda19c9745eeea3f53f2fca8 `François REMY`<mailto:fremycompany.developer@yahoo.fr> When the attr() fallback is an invalid length, the delcaration is correctly ignored.
|
||||
attr-length-valid reference/200-200-green Attribute references (length) http://www.w3.org/TR/css3-values/#attr-notation 375b35da15f09380b6106b3f10fe69eae8804eb3 `François REMY`<mailto:fremycompany.developer@yahoo.fr> The value of referenced attribute is used correctly as a length.
|
||||
attr-length-valid-zero reference/200-200-green Attribute references (length) http://www.w3.org/TR/css3-values/#attr-notation f2c1bdf2abb7438c21a7aec70d7d59adb607b7df `François REMY`<mailto:fremycompany.developer@yahoo.fr> The value of referenced attribute is used correctly as a length (even if it's 0).
|
||||
attr-length-valid-zero-nofallback reference/200-200-green Attribute references (length) http://www.w3.org/TR/css3-values/#attr-notation fe4957c7464b362b065dba15c2440d5942efe37b `François REMY`<mailto:fremycompany.developer@yahoo.fr> The value of referenced attribute is used correctly as a length (even if it's 0).
|
||||
attr-px-invalid-cast reference/200-200-green Attributes references (pixels) http://www.w3.org/TR/css3-values/#attr-notation 801574b1a020ef54bb489c8a791fd10e0fab0a69 `François REMY`<mailto:fremycompany.developer@yahoo.fr> When the value of the referenced attribute is not a pixel value, the fallback value is used instead.
|
||||
attr-px-invalid-fallback reference/200-200-green Attribute references (pixels) http://www.w3.org/TR/css3-values/#attr-notation ed5e6e890516bf17df250f5d6d4ba7fd373c3f2f `François REMY`<mailto:fremycompany.developer@yahoo.fr> When the fallback of a pixel attribute reference is invalid, the declaration is ignored.
|
||||
attr-px-valid reference/200-200-green Attribute references (pixels) http://www.w3.org/TR/css3-values/#attr-notation cfd19762bc5e2469a63dcf798ccaf7ab416b0542 `François REMY`<mailto:fremycompany.developer@yahoo.fr> Attribute references for pixel values are replaced correctly at computed time.
|
||||
calc-background-image-gradient-1 reference/calc-background-image-gradient-1-ref Test for calc() on background-image gradients http://www.w3.org/TR/css3-values/#calc-notation 4908626b6c3bd6da5d47ec5ee366e0c06d8cae50 `L. David Baron`<http://dbaron.org/>
|
||||
calc-background-linear-gradient-1 reference/calc-background-linear-gradient-1-ref Support calc() on gradient stop positions http://www.w3.org/TR/css3-values/#calc-notation 89f5dc390231b59bc044bde93bb4cc3133002df6 `Yu-Sian (Thomasy) Liu`<https://bugzilla.mozilla.org/show_bug.cgi?id=594935>
|
||||
calc-background-position-1 reference/calc-background-position-1-ref Test for calc() on background-position http://www.w3.org/TR/css3-values/#calc-notation d5a0d6858f4cc7d245898f066606204e559e4b50 `L. David Baron`<https://bugzilla.mozilla.org/show_bug.cgi?id=594934>
|
||||
|
@ -7,6 +21,10 @@ calc-background-size-1 reference/calc-background-size-1-ref Test for calc() on b
|
|||
calc-border-radius-1 reference/calc-border-radius-1-ref test for border-radius: calc() http://www.w3.org/TR/css3-values/#calc-notation 9d9eeb4f1aeff36e108f038dffcd9cbe19044b9f `L. David Baron`<http://dbaron.org/>
|
||||
calc-height-block-1 reference/calc-height-block-1-ref Test for height:calc() on blocks http://www.w3.org/TR/css3-values/#calc-notation 952526a2250e62df4cd71c656df40c8e1583d802 `L. David Baron`<http://dbaron.org/>
|
||||
calc-height-table-1 reference/calc-height-table-1-ref Test that height:calc() with no percentages has an effect on inner table elements http://www.w3.org/TR/css3-values/#calc-notation aaa87fc375b1f80271853d2c80fa30e6e7953c05 `L. David Baron`<http://dbaron.org/>
|
||||
calc-in-calc reference/all-green Calc() inside calc() http://www.w3.org/TR/css3-values/#calc-notation bdf08b589fb1b18d33858b1fadbf22dbdbcd8b10 `François REMY`<mailto:fremycompany.developer@yahoo.fr> The calc() function notation is allowed inside a calc() notation.
|
||||
calc-in-media-queries-001 reference/all-green Calc function inside media queries http://www.w3.org/TR/css3-values/#calc-notation,http://www.w3.org/TR/css3-mediaqueries/#width 76041848c2d73ff643ff2ae5b858e92ecc0661eb `François REMY`<mailto:fremycompany.developer@yahoo.fr> The calc() expression is supported in the min-width media query.
|
||||
calc-in-media-queries-002 reference/all-green Calc function inside media queries http://www.w3.org/TR/css3-values/#calc-notation,http://www.w3.org/TR/css3-mediaqueries/#width 4b4079fde947d7f5774601249a38067946206375 `François REMY`<mailto:fremycompany.developer@yahoo.fr> The calc() expression is supported in the min-width media query properly (=with range clamping).
|
||||
calc-invalid-range-clamping reference/200-200-green Range clamping into calc() expressions http://www.w3.org/TR/css3-values/#calc-notation b27b28c5a0fe3027e23fadc94ca18e15cecc1668 `François REMY`<mailto:fremycompany.developer@yahoo.fr> 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.
|
||||
calc-margin-block-1 reference/calc-margin-block-1-ref Test of margin-*: calc() http://www.w3.org/TR/css3-values/#calc-notation 1d7889b64fd00e87e2b2961c5e42e6af8577ae5a `L. David Baron`<http://dbaron.org/>
|
||||
calc-max-height-block-1 reference/calc-max-height-block-1-ref Test for max-height:calc() on blocks http://www.w3.org/TR/css3-values/#calc-notation f59e64c55e4610b5e23a0cf99f646f657d0ae58f `L. David Baron`<http://dbaron.org/>
|
||||
calc-max-width-block-1 reference/calc-width-block-1-ref max-width: calc() on blocks http://www.w3.org/TR/css3-values/#calc-notation 0c2e3de995e9b8644479cb9b6154c268268df2bf `L. David Baron`<http://dbaron.org/>
|
||||
|
@ -23,6 +41,7 @@ calc-offsets-relative-left-1 reference/calc-offsets-relative-left-1-ref Test for
|
|||
calc-offsets-relative-right-1 reference/calc-offsets-relative-left-1-ref Test for right:calc() on relatively positioned elements http://www.w3.org/TR/css3-values/#calc-notation e7e22c4c64b97f993430cfae81fa9a40b007df5b `L. David Baron`<http://dbaron.org/>
|
||||
calc-offsets-relative-top-1 reference/calc-offsets-relative-top-1-ref Test for top:calc() on relatively positioned elements http://www.w3.org/TR/css3-values/#calc-notation 138f42115aa281eabba1eb4ea3b327d917c05e83 `L. David Baron`<http://dbaron.org/>
|
||||
calc-padding-block-1 reference/calc-padding-block-1-ref Test of padding-*: calc() http://www.w3.org/TR/css3-values/#calc-notation 0a6fcb06af632bc921b8fdcf6e84dc9632747d0d `L. David Baron`<http://dbaron.org/>
|
||||
calc-parenthesis-stack reference/all-green Calc() inside calc() http://www.w3.org/TR/css3-values/#calc-notation ffdf1230c02a969b14103645c50a5940603c1dda `François REMY`<mailto:fremycompany.developer@yahoo.fr> The calc() function notation is allowed inside a calc() notation.
|
||||
calc-text-indent-1 reference/calc-text-indent-1-ref text-indent: calc() on blocks http://www.w3.org/TR/css3-values/#calc-notation 4791e504f1036b2c117a842014409132ffc0f8e0 `L. David Baron`<http://dbaron.org/>
|
||||
calc-text-indent-intrinsic-1 reference/calc-text-indent-intrinsic-1-ref intrinsic width of text-indent: calc() on blocks http://www.w3.org/TR/css3-values/#calc-notation 212d0b36c668eb0ce4b8fbffb7ddc91faac7ef10 `L. David Baron`<http://dbaron.org/>
|
||||
calc-transform-origin-1 reference/calc-transform-origin-1-ref Test for calc() on transform-origin http://www.w3.org/TR/css3-values/#calc-notation 37759c591badf6155fa5f3721d6feeabe9e4b606 `L. David Baron`<https://bugzilla.mozilla.org/show_bug.cgi?id=594934>
|
||||
|
@ -33,7 +52,13 @@ calc-width-block-intrinsic-1 reference/calc-width-block-intrinsic-1-ref intrinsi
|
|||
calc-width-table-auto-1 reference/calc-width-table-auto-1-ref width: calc() on table-layout: auto tables http://www.w3.org/TR/css3-values/#calc-notation b75533977bfccbdb094aefcc277e95f28710f507 `L. David Baron`<http://dbaron.org/>
|
||||
calc-width-table-fixed-1 reference/calc-width-table-fixed-1-ref width: calc() on table-layout: auto tables http://www.w3.org/TR/css3-values/#calc-notation b16a53e8a8072b68c6bd91790cc982cccbcf2bc6 `L. David Baron`<http://dbaron.org/>
|
||||
ch-unit-001 reference/ch-unit-001-ref support for the ch unit https://drafts.csswg.org/css-values-3/#font-relative-lengths 4c390e4f1e8b24beaa0520c61466cd43e87a62c8 `Florian Rivoal`<http://florian.rivoal.net/> The ch unit is equal to the used advance measure of the 0 (ZERO, U+0030) glyph found in the font used to render it.
|
||||
initial-background-color reference/all-green Initial property and background-color http://www.w3.org/TR/css3-values/#attr-notation 272a0b7d54a124e269f48dea39a62c62f8340943 `François REMY`<mailto:fremycompany.developer@yahoo.fr> The initial keyword is supported on background-color.
|
||||
min-width-001 ref min-width length value approximation http://www.w3.org/TR/css3-mediaqueries/#width,http://www.w3.org/TR/mediaqueries-4/#width,http://www.w3.org/TR/css3-values/#length-value edff68d05ca48525e5456d924b43578c8dfdbf57 `Chris Rebert`<http://chrisrebert.com> min-width length values that are too large to be supported must be clamped, rounded to infinity, or approximated, but not overflowed to a small or negative value.
|
||||
mq-calc-001 reference/mq-calc-001-ref support for calc in Media Queries http://www.w3.org/TR/css3-values/#calc-notation 7e98c39bcf90aaad01b9a98249c7577476980edc `Florian Rivoal`<http://florian.rivoal.net/> calc can be used in Media Queries
|
||||
mq-calc-002 reference/mq-calc-001-ref evaluation of em in calc in Media Queries http://www.w3.org/TR/css3-values/#calc-notation,http://www.w3.org/TR/css3-mediaqueries/#units 0cacb89c9a83b3c696156eb81b19fbe466dc0fa1 `Florian Rivoal`<http://florian.rivoal.net/> 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.
|
||||
mq-calc-003 reference/mq-calc-001-ref evaluation of ex in calc in Media Queries http://www.w3.org/TR/css3-values/#calc-notation,http://www.w3.org/TR/css3-mediaqueries/#units 3412e0e24953015d4e8f2f3d98b76cd63adf5eb6 `Florian Rivoal`<http://florian.rivoal.net/> 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.
|
||||
mq-calc-004 reference/mq-calc-001-ref evaluation of ch in calc in Media Queries http://www.w3.org/TR/css3-values/#calc-notation,http://www.w3.org/TR/css3-mediaqueries/#units 68791138cef29002ea9c8fc54d0dd7ec34375fd1 `Florian Rivoal`<http://florian.rivoal.net/> 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.
|
||||
mq-calc-005 reference/mq-calc-001-ref evaluation of rem in calc in Media Queries http://www.w3.org/TR/css3-values/#calc-notation,http://www.w3.org/TR/css3-mediaqueries/#units 305ee11ac9a53f8610670beb20e1bb8ce9392d75 `Florian Rivoal`<http://florian.rivoal.net/> 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.
|
||||
multicol-count-non-integer-001 reference/multicol-columns-invalid-001-ref non-integer 'column-count' value ahem,invalid http://www.w3.org/TR/css3-multicol/#the-number-and-width-of-columns,http://www.w3.org/TR/css3-values/#integers 6ebfd7a8bb7081898fed146d154ff0c1119f05e1 `Gérard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> This test checks that a specified real 'column-count' value is invalid and ignored.
|
||||
multicol-count-non-integer-002 reference/multicol-columns-invalid-001-ref non-integer 'column-count' value ahem,invalid http://www.w3.org/TR/css3-multicol/#the-number-and-width-of-columns,http://www.w3.org/TR/css3-values/#integers ed064290bd392497aad5107e30a9e336532a4d31 `Gérard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> This test checks that a specified real 'column-count' value is invalid and ignored.
|
||||
multicol-count-non-integer-003 reference/multicol-columns-invalid-001-ref non-integer 'column-count' value ahem,invalid http://www.w3.org/TR/css3-multicol/#the-number-and-width-of-columns,http://www.w3.org/TR/css3-values/#integers d6173aac65acc056fcc61b00944e06e7f30f70e9 `Gérard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> This test checks that a specified real 'column-count' value is invalid and ignored.
|
||||
|
@ -45,14 +70,21 @@ regions-resizing-007 reference/regions-resizing-001-ref CSS Regions: resizing re
|
|||
regions-resizing-009 reference/regions-resizing-001-ref CSS Regions: resizing autosized region when content flowed in it is sized with viewport units ahem,dom,http http://www.w3.org/TR/css3-regions/#the-flow-into-property,http://www.w3.org/TR/css3-regions/#flow-from,http://www.w3.org/TR/css3-regions/#regions-visual-formatting-details,http://www.w3.org/TR/css3-values/#viewport-relative-lengths 4a1d7ae83ef004c6c097fecd07b21c7c7c368f8e `Mihai Balan`<mailto:mibalan@adobe.com> Test checks that resizing the viewport of a page containing an autosized region when the content flowed in it is sized with viewport units correctly relayouts the region's contents.
|
||||
shape-outside-circle-002 Shape Outside Circle Valid Positions dom,script http://www.w3.org/TR/css-shapes-1/#funcdef-circle,http://www.w3.org/TR/css-shapes-1/#shape-outside-property,http://www.w3.org/TR/css3-values/#lengths 8a1c43c953fe3b82edd77025bbf55b77475c59f0 `Adobe`<http://html.adobe.com/>,`Bear Travis`<mailto:betravis@adobe.com>,`Rebecca Hauck`<mailto:rhauck@adobe.com> A circle's position argument may be any of the valid combinations: [ percentage|length left|center|right ] or [ percentage|length left|center|right ] [ percentage|length top|center|bottom ] or [ left|center|right ] or [ left|center|right top|center|bottom ] or [ top|center|bottom ].
|
||||
shape-outside-circle-004 Shape Outside Circle - Position Length Units dom,script http://www.w3.org/TR/css-shapes-1/#funcdef-circle,http://www.w3.org/TR/css-shapes-1/#shape-outside-property,http://www.w3.org/TR/css3-values/#lengths 44092ed692b65149dd5593c1aecce3f4d3352600 `Adobe`<http://html.adobe.com/>,`Rebecca Hauck`<mailto:rhauck@adobe.com> A circle's position arguments may in any valid <length> unit allowed by a <position> value.
|
||||
shape-outside-circle-010 Shape Outside Circle args - calc() values dom,script http://www.w3.org/TR/css-shapes-1/#funcdef-circle,http://www.w3.org/TR/css-shapes-1/#shape-outside-property,http://www.w3.org/TR/css3-values/#calc-notation 607e2d5c6f3cff8a2d826c391d39d86c68759214 `Adobe`<http://html.adobe.com/>,`Rebecca Hauck`<mailto:rhauck@adobe.com> A circle's arguments may be in calc() values.
|
||||
shape-outside-circle-011 Shape Outside Circle position args - calc() values dom,script http://www.w3.org/TR/css-shapes-1/#funcdef-circle,http://www.w3.org/TR/css-shapes-1/#shape-outside-property,http://www.w3.org/TR/css3-values/#calc-notation 6ec13da059ac1bf92db6fa4455e8f40c20af958e `Adobe`<http://html.adobe.com/>,`Rebecca Hauck`<mailto:rhauck@adobe.com> A circle's <position> arguments may be in calc() values.
|
||||
shape-outside-ellipse-002 Shape Outside Ellipse Valid Positions dom,script http://www.w3.org/TR/css-shapes-1/#funcdef-ellipse,http://www.w3.org/TR/css-shapes-1/#shape-outside-property,http://www.w3.org/TR/css3-values/#lengths e069870229afea5bc6dbf4b6768c847230aafc09 `Adobe`<http://html.adobe.com/>,`Bear Travis`<mailto:betravis@adobe.com>,`Rebecca Hauck`<mailto:rhauck@adobe.com> An ellipse's position argument may be any of the valid combinations: [ percentage|length left|center|right ] or [ percentage|length left|center|right ] [ percentage|length top|center|bottom ] or [ left|center|right ] or [ left|center|right top|center|bottom ] or [ top|center|bottom ].
|
||||
shape-outside-ellipse-004 Shape Outside Ellipse - Position Length Units dom,script http://www.w3.org/TR/css-shapes-1/#funcdef-ellipse,http://www.w3.org/TR/css-shapes-1/#shape-outside-property,http://www.w3.org/TR/css3-values/#lengths cf7a179b06597950e51c08580c0bcc5d7476e1c1 `Adobe`<http://html.adobe.com/>,`Rebecca Hauck`<mailto:rhauck@adobe.com> An ellipse's position arguments may in any valid <length> unit allowed by a <position> value.
|
||||
shape-outside-ellipse-010 Shape Outside Ellipse args - calc() values dom,script http://www.w3.org/TR/css-shapes-1/#funcdef-ellipse,http://www.w3.org/TR/css-shapes-1/#shape-outside-property,http://www.w3.org/TR/css3-values/#calc-notation 3fc7f06c7d68753e41e7ed78c9ebf3d695419a12 `Adobe`<http://html.adobe.com/>,`Rebecca Hauck`<mailto:rhauck@adobe.com> An ellipse's arguments may be in calc() values.
|
||||
shape-outside-ellipse-011 Shape Outside Ellipse position args - calc() values dom,script http://www.w3.org/TR/css-shapes-1/#funcdef-ellipse,http://www.w3.org/TR/css-shapes-1/#shape-outside-property,http://www.w3.org/TR/css3-values/#calc-notation 8efb4584d3c1c812aea1831ef4e272f719cd4e7d `Adobe`<http://html.adobe.com/>,`Rebecca Hauck`<mailto:rhauck@adobe.com> An ellipse's <position> arguments may be in calc() values.
|
||||
shape-outside-inset-003 Shape Outside Inset Valid Round Length Units dom,script http://www.w3.org/TR/css-shapes-1/#funcdef-inset,http://www.w3.org/TR/css-shapes-1/#shape-outside-property,http://www.w3.org/TR/css3-values/#lengths a28821639a481807aba32477b3ad98a7bec40b41 `Adobe`<http://html.adobe.com/>,`Rebecca Hauck`<mailto:rhauck@adobe.com> An inset's radial component's values can be in any length unit
|
||||
shape-outside-inset-008 Shape Outside Inset Args - calc() values dom,script http://www.w3.org/TR/css-shapes-1/#funcdef-inset,http://www.w3.org/TR/css-shapes-1/#shape-outside-property,http://www.w3.org/TR/css3-values/#calc-notation 99dbe179f30b42dea217ec39b2776c4418f7101b `Adobe`<http://html.adobe.com/>,`Rebecca Hauck`<mailto:rhauck@adobe.com> An inset's arguments may be in calc() values.
|
||||
shape-outside-inset-009 Shape Outside Inset round args - calc() values dom,script http://www.w3.org/TR/css-shapes-1/#funcdef-inset,http://www.w3.org/TR/css-shapes-1/#shape-outside-property,http://www.w3.org/TR/css3-values/#calc-notation 8106a6db182206593437508cfb2a5a1f8bff3c53 `Adobe`<http://html.adobe.com/>,`Rebecca Hauck`<mailto:rhauck@adobe.com> An inset's radial component arguments may be in calc() values.
|
||||
shape-outside-polygon-004 Shape Outside Polygon - Argument Length Units dom,script http://www.w3.org/TR/css-shapes-1/#funcdef-polygon,http://www.w3.org/TR/css-shapes-1/#shape-outside-property,http://www.w3.org/TR/css3-values/#lengths e4bb8c0597a4b08fe5d5e94f83f94e7adf0dfb90 `Adobe`<http://html.adobe.com/>,`Rebecca Hauck`<mailto:rhauck@adobe.com> A polygon's veritices may in percentage or any valid <length> units.
|
||||
shape-outside-polygon-006 Shape Outside Polygon args - calc() values dom,script http://www.w3.org/TR/css-shapes-1/#funcdef-polygon,http://www.w3.org/TR/css-shapes-1/#shape-outside-property,http://www.w3.org/TR/css3-values/#calc-notation d7519eee54407dff4909d0ab804580dcae8e96b9 `Adobe`<http://html.adobe.com/>,`Rebecca Hauck`<mailto:rhauck@adobe.com> A polygon's arguments may be in calc() values.
|
||||
transition-delay-001 Parsing transition-delay dom,script http://www.w3.org/TR/css3-transitions/#transition-delay-property,http://www.w3.org/TR/css3-values/#time 936ec60d74c61f54ba71930eafbd8db9c5e84e82 `Rodney Rehm`<http://rodneyrehm.de/en/> Test checks that transition-delay values are parsed properly
|
||||
transition-duration-001 Parsing transition-duration dom,script http://www.w3.org/TR/css3-transitions/#transition-duration-property,http://www.w3.org/TR/css3-values/#time 663439e329a5e15084fda9eb5be1ac7d2e0dc5f7 `Rodney Rehm`<http://rodneyrehm.de/en/> Test checks that transition-duration values are parsed properly
|
||||
vh-calc-support reference/all-green Viewport units are supported inside calc expressions. http://www.w3.org/TR/css3-values/#viewport-relative-lengths,http://www.w3.org/TR/css3-values/#calc 92ae3e98da13a95fdcd08517692d0ee79a39810b `François REMY`<mailto:fremycompany.developer@yahoo.fr> Check that viewport units add correctly to pixels in calc() expressions
|
||||
vh-calc-support-pct reference/all-green Viewport units are supported inside calc expressions. http://www.w3.org/TR/css3-values/#viewport-relative-lengths,http://www.w3.org/TR/css3-values/#calc 094f5381d9f411a374844075893597b78fb15b46 `François REMY`<mailto:fremycompany.developer@yahoo.fr> Check that viewport units add correctly to percentages in calc() expressions
|
||||
vh-calc-support reference/all-green Viewport units are supported inside calc expressions. http://www.w3.org/TR/css3-values/#viewport-relative-lengths,http://www.w3.org/TR/css3-values/#calc-notation bfe3e7029dbbeeeeee64d6e732a9b8aa13b286be `François REMY`<mailto:fremycompany.developer@yahoo.fr> Check that viewport units add correctly to pixels in calc() expressions
|
||||
vh-calc-support-pct reference/all-green Viewport units are supported inside calc expressions. http://www.w3.org/TR/css3-values/#viewport-relative-lengths,http://www.w3.org/TR/css3-values/#calc-notation 23bb4d003b19c48d16bdd04eb1da62451c0fcc3e `François REMY`<mailto:fremycompany.developer@yahoo.fr> Check that viewport units add correctly to percentages in calc() expressions
|
||||
vh-em-inherit reference/all-green 0vh and 0vw are correctly treated as 0px http://www.w3.org/TR/css3-values/#viewport-relative-lengths bd54e3e097d1f4b5799a696bfffeebf5561c072f `François REMY`<mailto:fremycompany.developer@yahoo.fr> 0vh and 0vw are correctly treated as 0px
|
||||
vh-inherit reference/all-green Viewport units are inherited properly http://www.w3.org/TR/css3-values/#viewport-relative-lengths e006cf0e4f727a753c115bb062ed9aa3854375b0 `François REMY`<mailto:fremycompany.developer@yahoo.fr> Viewport units are inherited properly
|
||||
vh-interpolate-pct reference/all-green Viewport units are interpolated correctly http://www.w3.org/TR/css3-values/#viewport-relative-lengths,http://www.w3.org/TR/css3-animations/#animations e263245c653c76da4ebf1afd5463deb31d27e365 `François REMY`<mailto:fremycompany.developer@yahoo.fr> The interpolated size mid-way between 0px and 200vh is 100vh (respectively for vw)
|
||||
|
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
35
tests/wpt/css-tests/css-values-3_dev/xhtml1/calc-in-calc.xht
Normal file
35
tests/wpt/css-tests/css-values-3_dev/xhtml1/calc-in-calc.xht
Normal 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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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 <position> 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 <position> 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 -->
|
||||
|
|
|
@ -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>
|
26
tests/wpt/css-tests/css-values-3_dev/xhtml1/mq-calc-001.xht
Normal file
26
tests/wpt/css-tests/css-values-3_dev/xhtml1/mq-calc-001.xht
Normal 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>
|
29
tests/wpt/css-tests/css-values-3_dev/xhtml1/mq-calc-002.xht
Normal file
29
tests/wpt/css-tests/css-values-3_dev/xhtml1/mq-calc-002.xht
Normal 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>
|
29
tests/wpt/css-tests/css-values-3_dev/xhtml1/mq-calc-003.xht
Normal file
29
tests/wpt/css-tests/css-values-3_dev/xhtml1/mq-calc-003.xht
Normal 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>
|
29
tests/wpt/css-tests/css-values-3_dev/xhtml1/mq-calc-004.xht
Normal file
29
tests/wpt/css-tests/css-values-3_dev/xhtml1/mq-calc-004.xht
Normal 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>
|
29
tests/wpt/css-tests/css-values-3_dev/xhtml1/mq-calc-005.xht
Normal file
29
tests/wpt/css-tests/css-values-3_dev/xhtml1/mq-calc-005.xht
Normal 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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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">
|
||||
|
|
|
@ -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
|
||||
|
|
|
@ -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]' && 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>
|
|
@ -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 <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]' && 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>
|
|
@ -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]' && 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]' && 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]' && 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>
|
|
@ -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 <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]' && 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]' && 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]' && 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>
|
|
@ -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]' && 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]' && 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>
|
|
@ -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]' && 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]' && 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>
|
|
@ -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]' && 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]' && 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>
|
|
@ -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 -
|
||||
|
|
|
@ -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" />
|
||||
|
||||
|
|
|
@ -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" />
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue