mirror of
https://github.com/servo/servo.git
synced 2025-08-05 21:50:18 +01:00
Update CSS tests to revision 0698c2aa9ead844b6d7d10eafb096cb1118e13ef
This commit is contained in:
Ms2ger
parent
9aa1b1e408
commit
35c74aecc2
11290 changed files with 92400 additions and 49214 deletions
|
|
@ -1,31 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,31 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,31 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,31 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,34 +1,34 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,34 +1,34 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,31 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,31 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,33 +1,33 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,33 +1,33 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,31 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,31 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,31 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,31 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,30 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -2,29 +2,29 @@
|
|||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units and Media Queries Test:
|
||||
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<EFBFBD>ois REMY">
|
||||
|
||||
<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>
|
||||
|
||||
|
|
|
|||
|
|
@ -2,29 +2,29 @@
|
|||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units and Media Queries Test:
|
||||
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<EFBFBD>ois REMY">
|
||||
|
||||
<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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,32 +1,32 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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.
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,30 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,30 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units + CSS Background and Borders Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -17,11 +17,11 @@
|
|||
column-gap: 1em;
|
||||
font: 1.25em/1 Ahem;
|
||||
width: 32em;
|
||||
|
||||
|
||||
/*
|
||||
N == 3;
|
||||
|
||||
32em
|
||||
32em
|
||||
- 2em : 2 column gaps
|
||||
==========
|
||||
30em : available width of the 3 inner multi-column elements
|
||||
|
|
|
|||
|
|
@ -1,24 +1,24 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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">
|
||||
|
||||
|
||||
<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>
|
||||
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@ var suite = root.generalParallelTest = {
|
|||
data.fixture = document.getElementById('fixture').cloneNode(true);
|
||||
data.fixture.id = 'test-' + (index++);
|
||||
(document.getElementById('offscreen') || document.body).appendChild(data.fixture);
|
||||
|
||||
|
||||
// data container for #fixture > .container > .transition
|
||||
data.transition = {
|
||||
node: data.fixture.querySelector('.transition'),
|
||||
|
|
@ -34,7 +34,7 @@ var suite = root.generalParallelTest = {
|
|||
return computedStyle(data.container.node, property);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
// data container for #fixture > .container > .transition[:before | :after]
|
||||
if (data.pseudo) {
|
||||
data.pseudo = {
|
||||
|
|
@ -92,13 +92,13 @@ var suite = root.generalParallelTest = {
|
|||
if (!options.styles) {
|
||||
options.styles = {};
|
||||
}
|
||||
|
||||
|
||||
Object.keys(styles).forEach(function(key) {
|
||||
var selector = '#' + data.fixture.id
|
||||
// fixture must become #fixture.fixture rather than a child selector
|
||||
+ (key.substring(0, 8) === '.fixture' ? '' : ' ')
|
||||
+ key;
|
||||
|
||||
|
||||
options.styles[selector] = styles[key];
|
||||
});
|
||||
},
|
||||
|
|
@ -109,7 +109,7 @@ var suite = root.generalParallelTest = {
|
|||
suite._getStyleFor(data, 'from');
|
||||
// apply target state
|
||||
suite._addClass(data, 'to', true);
|
||||
// grab current styles: "target state"
|
||||
// grab current styles: "target state"
|
||||
suite._getStyleFor(data, 'to');
|
||||
// remove target state
|
||||
suite._removeClass(data, 'to', true);
|
||||
|
|
@ -157,7 +157,7 @@ var suite = root.generalParallelTest = {
|
|||
var raf = window.requestAnimationFrame || function(callback){
|
||||
setTimeout(callback, 20);
|
||||
};
|
||||
|
||||
|
||||
// flag denoting if the runLoop should continue (true) or exit (false)
|
||||
options._collectValues = true;
|
||||
|
||||
|
|
@ -166,19 +166,19 @@ var suite = root.generalParallelTest = {
|
|||
// test's are done, stop annoying the CPU
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
// collect current style for test's elements
|
||||
options.tests.forEach(function(data) {
|
||||
if (!data.property) {
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
['transition', 'container', 'pseudo'].forEach(function(elem) {
|
||||
var pseudo = null;
|
||||
if (!data[elem] || (elem === 'pseudo' && !data.pseudo)) {
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
var current = data[elem].computedStyle(data.property);
|
||||
var values = data[elem].values;
|
||||
var length = values.length;
|
||||
|
|
@ -187,11 +187,11 @@ var suite = root.generalParallelTest = {
|
|||
}
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// rinse and repeat
|
||||
raf(runLoop);
|
||||
}
|
||||
|
||||
|
||||
runLoop();
|
||||
},
|
||||
// stop requestAnimationFrame runLoop collecting computed values
|
||||
|
|
@ -222,7 +222,7 @@ var suite = root.generalParallelTest = {
|
|||
assert_not_equals(values[1], data[elem].from, "may not be initial value while transitioning on ." + elem);
|
||||
assert_not_equals(values[1], data[elem].to, "may not be target value while transitioning on ." + elem);
|
||||
}
|
||||
|
||||
|
||||
// TODO: first value must be initial, last value must be target
|
||||
};
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
//
|
||||
//
|
||||
// Simple Helper Functions For Testing CSS
|
||||
//
|
||||
//
|
||||
|
||||
(function(root) {
|
||||
'use strict';
|
||||
|
|
@ -17,7 +17,7 @@ root.setStyle = function(selector, styles) {
|
|||
target.type = "text/css";
|
||||
document.getElementsByTagName('head')[0].appendChild(target);
|
||||
}
|
||||
|
||||
|
||||
var data = [];
|
||||
// single selector/styles
|
||||
if (typeof selector === 'string' && styles !== undefined) {
|
||||
|
|
@ -44,7 +44,7 @@ function serializeStyles(styles) {
|
|||
data.push(prefixedProperty + ":" + styles[property] + ";");
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
return data.join('\n');
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -114,7 +114,7 @@ var values = {
|
|||
data: ['url(data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=)', 'url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==)'],
|
||||
// A hunch, as from the spec:
|
||||
// http://www.w3.org/TR/css3-transitions/#animatable-types
|
||||
// gradient: interpolated via the positions and colors of each stop. They must have the same type (radial or linear) and same number of stops in order to be animated. Note: [CSS3-IMAGES] may extend this definition.
|
||||
// gradient: interpolated via the positions and colors of each stop. They must have the same type (radial or linear) and same number of stops in order to be animated. Note: [CSS3-IMAGES] may extend this definition.
|
||||
gradient: [prefix + 'linear-gradient(top, hsl(0, 80%, 70%), #bada55)', prefix + 'linear-gradient(top, #bada55, hsl(0, 80%, 70%))']
|
||||
};
|
||||
},
|
||||
|
|
@ -171,39 +171,39 @@ var values = {
|
|||
var properties = {
|
||||
'background-color': ['color'],
|
||||
'background-position': ['length', 'percentage'],
|
||||
|
||||
|
||||
'border-top-width': ['length'],
|
||||
'border-right-width': ['length'],
|
||||
'border-bottom-width': ['length'],
|
||||
'border-left-width': ['length'],
|
||||
|
||||
|
||||
'border-top-color': ['color'],
|
||||
'border-right-color': ['color'],
|
||||
'border-bottom-color': ['color'],
|
||||
'border-left-color': ['color'],
|
||||
|
||||
|
||||
'padding-bottom': ['length'],
|
||||
'padding-left': ['length'],
|
||||
'padding-right': ['length'],
|
||||
'padding-top': ['length'],
|
||||
|
||||
|
||||
'margin-bottom': ['length'],
|
||||
'margin-left': ['length'],
|
||||
'margin-right': ['length'],
|
||||
'margin-top': ['length'],
|
||||
|
||||
|
||||
'height': ['length', 'percentage'],
|
||||
'width': ['length', 'percentage'],
|
||||
'min-height': ['length', 'percentage'],
|
||||
'min-width': ['length', 'percentage'],
|
||||
'max-height': ['length', 'percentage'],
|
||||
'max-width': ['length', 'percentage'],
|
||||
|
||||
|
||||
'top': ['length', 'percentage'],
|
||||
'right': ['length', 'percentage'],
|
||||
'bottom': ['length', 'percentage'],
|
||||
'left': ['length', 'percentage'],
|
||||
|
||||
|
||||
'color': ['color'],
|
||||
'font-size': ['length', 'percentage'],
|
||||
'font-weight': ['font-weight'],
|
||||
|
|
@ -214,16 +214,16 @@ var properties = {
|
|||
'word-spacing': ['length', 'percentage'],
|
||||
'text-indent': ['length', 'percentage'],
|
||||
'text-shadow': ['shadow'],
|
||||
|
||||
|
||||
'outline-color': ['color'],
|
||||
// outline-offset <integer> used to be an error in the spec
|
||||
'outline-offset': ['length'],
|
||||
'outline-width': ['length'],
|
||||
|
||||
|
||||
'clip': ['rectangle'],
|
||||
// Note: doesn't seem implemented anywhere
|
||||
'crop': ['rectangle'],
|
||||
|
||||
|
||||
'vertical-align': ['length', 'percentage'],
|
||||
'opacity': ['number[0,1]'],
|
||||
'visibility': ['visibility'],
|
||||
|
|
@ -279,7 +279,7 @@ var unspecified_properties = {
|
|||
'background-image': ['image'],
|
||||
'background-size': ['background-size'],
|
||||
// https://drafts.csswg.org/css3-background/#the-box-shadow
|
||||
// Animatable: yes, except between inner and outer shadows (Transition to/from an absent shadow is a transition to/from ‘0 0 transparent’ or ‘0 0 transparent inset’, as appropriate.)
|
||||
// Animatable: yes, except between inner and outer shadows (Transition to/from an absent shadow is a transition to/from ‘0 0 transparent’ or ‘0 0 transparent inset’, as appropriate.)
|
||||
'box-shadow': ['box-shadow'],
|
||||
'font-size-adjust': ['number'],
|
||||
'font-stretch': ['font-stretch'],
|
||||
|
|
@ -342,7 +342,7 @@ var parent_styles = {
|
|||
// unspecified properties
|
||||
'position': {'position': 'relative', 'width': '100px', 'height': '100px'},
|
||||
// inheritance tests
|
||||
'top': {'width': '100px', 'height': '100px', 'position': 'relative'},
|
||||
'top': {'width': '100px', 'height': '100px', 'position': 'relative'},
|
||||
'right': {'width': '100px', 'height': '100px', 'position': 'relative'},
|
||||
'bottom': {'width': '100px', 'height': '100px', 'position': 'relative'},
|
||||
'left': {'width': '100px', 'height': '100px', 'position': 'relative'}
|
||||
|
|
@ -375,7 +375,7 @@ function assemble(props) {
|
|||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
return tests;
|
||||
}
|
||||
|
||||
|
|
@ -393,23 +393,23 @@ root.getUnspecifiedPropertyTests = function() {
|
|||
|
||||
root.getFontSizeRelativePropertyTests = function() {
|
||||
var accepted = {};
|
||||
|
||||
|
||||
for (var key in properties) {
|
||||
if (!Object.prototype.hasOwnProperty.call(properties, key) || key === "font-size") {
|
||||
continue;
|
||||
}
|
||||
|
||||
|
||||
if (properties[key].indexOf('length') > -1) {
|
||||
accepted[key] = ['length-em'];
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
return assemble(accepted);
|
||||
};
|
||||
|
||||
root.getAutoPropertyTests = function() {
|
||||
var accepted = {};
|
||||
|
||||
|
||||
for (var i = 0, key; key = properties_auto[i]; i++) {
|
||||
accepted[key] = ['auto'];
|
||||
}
|
||||
|
|
@ -420,17 +420,17 @@ root.getAutoPropertyTests = function() {
|
|||
root.filterPropertyTests = function(tests, names) {
|
||||
var allowed = {};
|
||||
var accepted = [];
|
||||
|
||||
|
||||
if (typeof names === "string") {
|
||||
names = [names];
|
||||
}
|
||||
|
||||
|
||||
if (!(names instanceof RegExp)) {
|
||||
names.forEach(function(name) {
|
||||
allowed[name] = true;
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
tests.forEach(function(test) {
|
||||
if (names instanceof RegExp) {
|
||||
if (!test.name.match(names)) {
|
||||
|
|
@ -439,11 +439,11 @@ root.filterPropertyTests = function(tests, names) {
|
|||
} else if (!allowed[test.name]) {
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
accepted.push(test);
|
||||
});
|
||||
|
||||
|
||||
return accepted;
|
||||
};
|
||||
|
||||
})(window);
|
||||
})(window);
|
||||
|
|
|
|||
|
|
@ -13,13 +13,13 @@
|
|||
{name: "name of test 2", custom: "data"},
|
||||
// ...
|
||||
],
|
||||
|
||||
|
||||
// number of tests (tests, not test-cases!) to run concurrently
|
||||
testsPerSlice: 100,
|
||||
|
||||
// time in milliseconds a test-run takes
|
||||
duration: 1000,
|
||||
|
||||
|
||||
// test-cases to run for for the test - there must be at least one
|
||||
// each case creates its separate async_test() instance
|
||||
cases: {
|
||||
|
|
@ -33,17 +33,17 @@
|
|||
},
|
||||
// ...
|
||||
}
|
||||
|
||||
|
||||
// all callbacks are optional:
|
||||
|
||||
|
||||
// invoked for individual test before it starts so you can setup the environment
|
||||
// like DOM, CSS, adding event listeners and such
|
||||
setup: function(data, options){},
|
||||
|
||||
|
||||
// invoked after a test ended, so you can clean up the environment
|
||||
// like DOM, CSS, removing event listeners and such
|
||||
teardown: function(data, options){},
|
||||
|
||||
|
||||
// invoked before a batch of tests ("slice") are run concurrently
|
||||
// tests is an array of test data objects
|
||||
sliceStart: function(options, tests)
|
||||
|
|
@ -60,22 +60,22 @@ root.runParallelAsyncHarness = function(options) {
|
|||
if (!options.cases) {
|
||||
throw new Error("Options don't contain test cases!");
|
||||
}
|
||||
|
||||
|
||||
var noop = function(){};
|
||||
|
||||
|
||||
// add a 100ms buffer to the test timeout, just in case
|
||||
var duration = Math.ceil(options.duration + 100);
|
||||
|
||||
|
||||
// names of individual tests
|
||||
var cases = Object.keys(options.cases);
|
||||
|
||||
|
||||
// run tests in a batch of slices
|
||||
// primarily not to overload weak devices (tablets, phones, …)
|
||||
// primarily not to overload weak devices (tablets, phones, …)
|
||||
// with too many tests running simultaneously
|
||||
var iteration = -1;
|
||||
var testPerSlice = options.testsPerSlice || 100;
|
||||
var slices = Math.ceil(options.tests.length / testPerSlice);
|
||||
|
||||
|
||||
// initialize all async test cases
|
||||
// Note: satisfying testharness.js needs to know all async tests before load-event
|
||||
options.tests.forEach(function(data, index) {
|
||||
|
|
@ -84,7 +84,7 @@ root.runParallelAsyncHarness = function(options) {
|
|||
data.cases[name] = async_test(data.name + " / " + name, {timeout: options.timeout || 60000});
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
function runLoop() {
|
||||
iteration++;
|
||||
if (iteration >= slices) {
|
||||
|
|
@ -92,7 +92,7 @@ root.runParallelAsyncHarness = function(options) {
|
|||
(options.done || noop)(options);
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
// grab a slice of testss and initialize them
|
||||
var offset = iteration * testPerSlice;
|
||||
var tests = options.tests.slice(offset, offset + testPerSlice);
|
||||
|
|
@ -100,10 +100,10 @@ root.runParallelAsyncHarness = function(options) {
|
|||
(options.setup || noop)(data, options);
|
||||
|
||||
});
|
||||
|
||||
|
||||
// kick off the current slice of tests
|
||||
(options.sliceStart || noop)(options, tests);
|
||||
|
||||
|
||||
// perform individual "start" test-case
|
||||
tests.forEach(function(data) {
|
||||
cases.forEach(function(name) {
|
||||
|
|
@ -112,7 +112,7 @@ root.runParallelAsyncHarness = function(options) {
|
|||
});
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// conclude test (possibly abort)
|
||||
setTimeout(function() {
|
||||
tests.forEach(function(data) {
|
||||
|
|
@ -129,17 +129,17 @@ root.runParallelAsyncHarness = function(options) {
|
|||
data.cases[name].done();
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// finish the test for current slice of tests
|
||||
(options.sliceDone || noop)(options, tests);
|
||||
|
||||
|
||||
// next test please, give the browser 50ms to do catch its breath
|
||||
setTimeout(runLoop, 50);
|
||||
}, duration);
|
||||
}
|
||||
|
||||
|
||||
// allow DOMContentLoaded before actually doing something
|
||||
setTimeout(runLoop, 100);
|
||||
};
|
||||
|
||||
})(window);
|
||||
})(window);
|
||||
|
|
|
|||
|
|
@ -5,14 +5,14 @@ function resizeViewportTo(viewportSelector, width, height) {
|
|||
|
||||
iframe.width = width;
|
||||
iframe.height = height;
|
||||
|
||||
|
||||
iframe.contentWindow.document.body.offsetTop;
|
||||
}
|
||||
|
||||
function injectStylesInIFrame(styleSelector, frameSelector) {
|
||||
var style = document.querySelector(styleSelector),
|
||||
frame = document.querySelector(frameSelector);
|
||||
|
||||
|
||||
frame.contentWindow.addNewStyles(style.textContent);
|
||||
}
|
||||
|
||||
|
|
@ -26,4 +26,4 @@ if (window.parent != window) {
|
|||
styleTag.appendChild(textNode);
|
||||
document.head.appendChild(styleTag);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
//
|
||||
//
|
||||
// Vendor-Prefix Helper Functions For Testing CSS
|
||||
//
|
||||
//
|
||||
|
||||
(function(root) {
|
||||
'use strict';
|
||||
|
|
@ -21,7 +21,7 @@ root.addVendorPrefix = function (name) {
|
|||
// property unknown to browser
|
||||
return name;
|
||||
}
|
||||
|
||||
|
||||
return prefix + name;
|
||||
};
|
||||
|
||||
|
|
@ -32,7 +32,7 @@ root.addValueVendorPrefix = function (property, value) {
|
|||
// property unknown to browser
|
||||
return name;
|
||||
}
|
||||
|
||||
|
||||
return prefix + value;
|
||||
};
|
||||
|
||||
|
|
@ -41,7 +41,7 @@ root.getVendorPrefix = function(name) {
|
|||
if (prefixCache[name] !== undefined) {
|
||||
return prefixCache[name];
|
||||
}
|
||||
|
||||
|
||||
var elem = document.createElement("div");
|
||||
name = camelCase(name);
|
||||
|
||||
|
|
@ -78,9 +78,9 @@ root.getValueVendorPrefix = function(property, value) {
|
|||
return styles[i];
|
||||
}
|
||||
}
|
||||
document.body.removeChild(elem);
|
||||
document.body.removeChild(elem);
|
||||
return false;
|
||||
};
|
||||
|
||||
|
||||
})(window);
|
||||
})(window);
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@
|
|||
<script type="text/javascript">
|
||||
var circle_position_calc_tests = [];
|
||||
ParsingUtils.calcTestValues.forEach(function(value) {
|
||||
testCase = ['circle(at '+ value[0] +')',
|
||||
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%)',
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@
|
|||
var ellipse_calc_tests = [];
|
||||
var defaultPosition = ' at 50% 50%';
|
||||
ParsingUtils.calcTestValues.forEach(function(value) {
|
||||
testCase = ['ellipse('+ value[0] +')',
|
||||
testCase = ['ellipse('+ value[0] +')',
|
||||
'ellipse('+ value[1] + defaultPosition +')'];
|
||||
if(Object.prototype.toString.call( value[2] ) === '[object Array]' && value[2].length == 2) {
|
||||
testCase.push([
|
||||
|
|
@ -32,7 +32,7 @@
|
|||
ellipse_calc_tests.push(testCase);
|
||||
});
|
||||
ParsingUtils.calcTestValues.forEach(function(value) {
|
||||
testCase = ['ellipse(farthest-side '+ value[0] +')',
|
||||
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([
|
||||
|
|
@ -45,7 +45,7 @@
|
|||
ellipse_calc_tests.push(testCase);
|
||||
});
|
||||
ParsingUtils.calcTestValues.forEach(function(value) {
|
||||
testCase = ['ellipse('+ value[0] +' '+ value[0] +')',
|
||||
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([
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@
|
|||
<script type="text/javascript">
|
||||
var ellipse_position_calc_tests = [];
|
||||
ParsingUtils.calcTestValues.forEach(function(value) {
|
||||
testCase = ['ellipse(at '+ value[0] +' 50%)',
|
||||
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([
|
||||
|
|
@ -44,7 +44,7 @@
|
|||
ellipse_position_calc_tests.push(testCase);
|
||||
});
|
||||
ParsingUtils.calcTestValues.forEach(function(value) {
|
||||
testCase = ['ellipse(closest-side farthest-side at '+ value[0] +' '+ value[0] +')',
|
||||
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([
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@ var suite = root.generalParallelTest = {
|
|||
data.fixture = document.getElementById('fixture').cloneNode(true);
|
||||
data.fixture.id = 'test-' + (index++);
|
||||
(document.getElementById('offscreen') || document.body).appendChild(data.fixture);
|
||||
|
||||
|
||||
// data container for #fixture > .container > .transition
|
||||
data.transition = {
|
||||
node: data.fixture.querySelector('.transition'),
|
||||
|
|
@ -34,7 +34,7 @@ var suite = root.generalParallelTest = {
|
|||
return computedStyle(data.container.node, property);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
// data container for #fixture > .container > .transition[:before | :after]
|
||||
if (data.pseudo) {
|
||||
data.pseudo = {
|
||||
|
|
@ -92,13 +92,13 @@ var suite = root.generalParallelTest = {
|
|||
if (!options.styles) {
|
||||
options.styles = {};
|
||||
}
|
||||
|
||||
|
||||
Object.keys(styles).forEach(function(key) {
|
||||
var selector = '#' + data.fixture.id
|
||||
// fixture must become #fixture.fixture rather than a child selector
|
||||
+ (key.substring(0, 8) === '.fixture' ? '' : ' ')
|
||||
+ key;
|
||||
|
||||
|
||||
options.styles[selector] = styles[key];
|
||||
});
|
||||
},
|
||||
|
|
@ -109,7 +109,7 @@ var suite = root.generalParallelTest = {
|
|||
suite._getStyleFor(data, 'from');
|
||||
// apply target state
|
||||
suite._addClass(data, 'to', true);
|
||||
// grab current styles: "target state"
|
||||
// grab current styles: "target state"
|
||||
suite._getStyleFor(data, 'to');
|
||||
// remove target state
|
||||
suite._removeClass(data, 'to', true);
|
||||
|
|
@ -157,7 +157,7 @@ var suite = root.generalParallelTest = {
|
|||
var raf = window.requestAnimationFrame || function(callback){
|
||||
setTimeout(callback, 20);
|
||||
};
|
||||
|
||||
|
||||
// flag denoting if the runLoop should continue (true) or exit (false)
|
||||
options._collectValues = true;
|
||||
|
||||
|
|
@ -166,19 +166,19 @@ var suite = root.generalParallelTest = {
|
|||
// test's are done, stop annoying the CPU
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
// collect current style for test's elements
|
||||
options.tests.forEach(function(data) {
|
||||
if (!data.property) {
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
['transition', 'container', 'pseudo'].forEach(function(elem) {
|
||||
var pseudo = null;
|
||||
if (!data[elem] || (elem === 'pseudo' && !data.pseudo)) {
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
var current = data[elem].computedStyle(data.property);
|
||||
var values = data[elem].values;
|
||||
var length = values.length;
|
||||
|
|
@ -187,11 +187,11 @@ var suite = root.generalParallelTest = {
|
|||
}
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// rinse and repeat
|
||||
raf(runLoop);
|
||||
}
|
||||
|
||||
|
||||
runLoop();
|
||||
},
|
||||
// stop requestAnimationFrame runLoop collecting computed values
|
||||
|
|
@ -222,7 +222,7 @@ var suite = root.generalParallelTest = {
|
|||
assert_not_equals(values[1], data[elem].from, "may not be initial value while transitioning on ." + elem);
|
||||
assert_not_equals(values[1], data[elem].to, "may not be target value while transitioning on ." + elem);
|
||||
}
|
||||
|
||||
|
||||
// TODO: first value must be initial, last value must be target
|
||||
};
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
//
|
||||
//
|
||||
// Simple Helper Functions For Testing CSS
|
||||
//
|
||||
//
|
||||
|
||||
(function(root) {
|
||||
'use strict';
|
||||
|
|
@ -17,7 +17,7 @@ root.setStyle = function(selector, styles) {
|
|||
target.type = "text/css";
|
||||
document.getElementsByTagName('head')[0].appendChild(target);
|
||||
}
|
||||
|
||||
|
||||
var data = [];
|
||||
// single selector/styles
|
||||
if (typeof selector === 'string' && styles !== undefined) {
|
||||
|
|
@ -44,7 +44,7 @@ function serializeStyles(styles) {
|
|||
data.push(prefixedProperty + ":" + styles[property] + ";");
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
return data.join('\n');
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -114,7 +114,7 @@ var values = {
|
|||
data: ['url(data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=)', 'url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==)'],
|
||||
// A hunch, as from the spec:
|
||||
// http://www.w3.org/TR/css3-transitions/#animatable-types
|
||||
// gradient: interpolated via the positions and colors of each stop. They must have the same type (radial or linear) and same number of stops in order to be animated. Note: [CSS3-IMAGES] may extend this definition.
|
||||
// gradient: interpolated via the positions and colors of each stop. They must have the same type (radial or linear) and same number of stops in order to be animated. Note: [CSS3-IMAGES] may extend this definition.
|
||||
gradient: [prefix + 'linear-gradient(top, hsl(0, 80%, 70%), #bada55)', prefix + 'linear-gradient(top, #bada55, hsl(0, 80%, 70%))']
|
||||
};
|
||||
},
|
||||
|
|
@ -171,39 +171,39 @@ var values = {
|
|||
var properties = {
|
||||
'background-color': ['color'],
|
||||
'background-position': ['length', 'percentage'],
|
||||
|
||||
|
||||
'border-top-width': ['length'],
|
||||
'border-right-width': ['length'],
|
||||
'border-bottom-width': ['length'],
|
||||
'border-left-width': ['length'],
|
||||
|
||||
|
||||
'border-top-color': ['color'],
|
||||
'border-right-color': ['color'],
|
||||
'border-bottom-color': ['color'],
|
||||
'border-left-color': ['color'],
|
||||
|
||||
|
||||
'padding-bottom': ['length'],
|
||||
'padding-left': ['length'],
|
||||
'padding-right': ['length'],
|
||||
'padding-top': ['length'],
|
||||
|
||||
|
||||
'margin-bottom': ['length'],
|
||||
'margin-left': ['length'],
|
||||
'margin-right': ['length'],
|
||||
'margin-top': ['length'],
|
||||
|
||||
|
||||
'height': ['length', 'percentage'],
|
||||
'width': ['length', 'percentage'],
|
||||
'min-height': ['length', 'percentage'],
|
||||
'min-width': ['length', 'percentage'],
|
||||
'max-height': ['length', 'percentage'],
|
||||
'max-width': ['length', 'percentage'],
|
||||
|
||||
|
||||
'top': ['length', 'percentage'],
|
||||
'right': ['length', 'percentage'],
|
||||
'bottom': ['length', 'percentage'],
|
||||
'left': ['length', 'percentage'],
|
||||
|
||||
|
||||
'color': ['color'],
|
||||
'font-size': ['length', 'percentage'],
|
||||
'font-weight': ['font-weight'],
|
||||
|
|
@ -214,16 +214,16 @@ var properties = {
|
|||
'word-spacing': ['length', 'percentage'],
|
||||
'text-indent': ['length', 'percentage'],
|
||||
'text-shadow': ['shadow'],
|
||||
|
||||
|
||||
'outline-color': ['color'],
|
||||
// outline-offset <integer> used to be an error in the spec
|
||||
'outline-offset': ['length'],
|
||||
'outline-width': ['length'],
|
||||
|
||||
|
||||
'clip': ['rectangle'],
|
||||
// Note: doesn't seem implemented anywhere
|
||||
'crop': ['rectangle'],
|
||||
|
||||
|
||||
'vertical-align': ['length', 'percentage'],
|
||||
'opacity': ['number[0,1]'],
|
||||
'visibility': ['visibility'],
|
||||
|
|
@ -279,7 +279,7 @@ var unspecified_properties = {
|
|||
'background-image': ['image'],
|
||||
'background-size': ['background-size'],
|
||||
// https://drafts.csswg.org/css3-background/#the-box-shadow
|
||||
// Animatable: yes, except between inner and outer shadows (Transition to/from an absent shadow is a transition to/from ‘0 0 transparent’ or ‘0 0 transparent inset’, as appropriate.)
|
||||
// Animatable: yes, except between inner and outer shadows (Transition to/from an absent shadow is a transition to/from ‘0 0 transparent’ or ‘0 0 transparent inset’, as appropriate.)
|
||||
'box-shadow': ['box-shadow'],
|
||||
'font-size-adjust': ['number'],
|
||||
'font-stretch': ['font-stretch'],
|
||||
|
|
@ -342,7 +342,7 @@ var parent_styles = {
|
|||
// unspecified properties
|
||||
'position': {'position': 'relative', 'width': '100px', 'height': '100px'},
|
||||
// inheritance tests
|
||||
'top': {'width': '100px', 'height': '100px', 'position': 'relative'},
|
||||
'top': {'width': '100px', 'height': '100px', 'position': 'relative'},
|
||||
'right': {'width': '100px', 'height': '100px', 'position': 'relative'},
|
||||
'bottom': {'width': '100px', 'height': '100px', 'position': 'relative'},
|
||||
'left': {'width': '100px', 'height': '100px', 'position': 'relative'}
|
||||
|
|
@ -375,7 +375,7 @@ function assemble(props) {
|
|||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
return tests;
|
||||
}
|
||||
|
||||
|
|
@ -393,23 +393,23 @@ root.getUnspecifiedPropertyTests = function() {
|
|||
|
||||
root.getFontSizeRelativePropertyTests = function() {
|
||||
var accepted = {};
|
||||
|
||||
|
||||
for (var key in properties) {
|
||||
if (!Object.prototype.hasOwnProperty.call(properties, key) || key === "font-size") {
|
||||
continue;
|
||||
}
|
||||
|
||||
|
||||
if (properties[key].indexOf('length') > -1) {
|
||||
accepted[key] = ['length-em'];
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
return assemble(accepted);
|
||||
};
|
||||
|
||||
root.getAutoPropertyTests = function() {
|
||||
var accepted = {};
|
||||
|
||||
|
||||
for (var i = 0, key; key = properties_auto[i]; i++) {
|
||||
accepted[key] = ['auto'];
|
||||
}
|
||||
|
|
@ -420,17 +420,17 @@ root.getAutoPropertyTests = function() {
|
|||
root.filterPropertyTests = function(tests, names) {
|
||||
var allowed = {};
|
||||
var accepted = [];
|
||||
|
||||
|
||||
if (typeof names === "string") {
|
||||
names = [names];
|
||||
}
|
||||
|
||||
|
||||
if (!(names instanceof RegExp)) {
|
||||
names.forEach(function(name) {
|
||||
allowed[name] = true;
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
tests.forEach(function(test) {
|
||||
if (names instanceof RegExp) {
|
||||
if (!test.name.match(names)) {
|
||||
|
|
@ -439,11 +439,11 @@ root.filterPropertyTests = function(tests, names) {
|
|||
} else if (!allowed[test.name]) {
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
accepted.push(test);
|
||||
});
|
||||
|
||||
|
||||
return accepted;
|
||||
};
|
||||
|
||||
})(window);
|
||||
})(window);
|
||||
|
|
|
|||
|
|
@ -13,13 +13,13 @@
|
|||
{name: "name of test 2", custom: "data"},
|
||||
// ...
|
||||
],
|
||||
|
||||
|
||||
// number of tests (tests, not test-cases!) to run concurrently
|
||||
testsPerSlice: 100,
|
||||
|
||||
// time in milliseconds a test-run takes
|
||||
duration: 1000,
|
||||
|
||||
|
||||
// test-cases to run for for the test - there must be at least one
|
||||
// each case creates its separate async_test() instance
|
||||
cases: {
|
||||
|
|
@ -33,17 +33,17 @@
|
|||
},
|
||||
// ...
|
||||
}
|
||||
|
||||
|
||||
// all callbacks are optional:
|
||||
|
||||
|
||||
// invoked for individual test before it starts so you can setup the environment
|
||||
// like DOM, CSS, adding event listeners and such
|
||||
setup: function(data, options){},
|
||||
|
||||
|
||||
// invoked after a test ended, so you can clean up the environment
|
||||
// like DOM, CSS, removing event listeners and such
|
||||
teardown: function(data, options){},
|
||||
|
||||
|
||||
// invoked before a batch of tests ("slice") are run concurrently
|
||||
// tests is an array of test data objects
|
||||
sliceStart: function(options, tests)
|
||||
|
|
@ -60,22 +60,22 @@ root.runParallelAsyncHarness = function(options) {
|
|||
if (!options.cases) {
|
||||
throw new Error("Options don't contain test cases!");
|
||||
}
|
||||
|
||||
|
||||
var noop = function(){};
|
||||
|
||||
|
||||
// add a 100ms buffer to the test timeout, just in case
|
||||
var duration = Math.ceil(options.duration + 100);
|
||||
|
||||
|
||||
// names of individual tests
|
||||
var cases = Object.keys(options.cases);
|
||||
|
||||
|
||||
// run tests in a batch of slices
|
||||
// primarily not to overload weak devices (tablets, phones, …)
|
||||
// primarily not to overload weak devices (tablets, phones, …)
|
||||
// with too many tests running simultaneously
|
||||
var iteration = -1;
|
||||
var testPerSlice = options.testsPerSlice || 100;
|
||||
var slices = Math.ceil(options.tests.length / testPerSlice);
|
||||
|
||||
|
||||
// initialize all async test cases
|
||||
// Note: satisfying testharness.js needs to know all async tests before load-event
|
||||
options.tests.forEach(function(data, index) {
|
||||
|
|
@ -84,7 +84,7 @@ root.runParallelAsyncHarness = function(options) {
|
|||
data.cases[name] = async_test(data.name + " / " + name, {timeout: options.timeout || 60000});
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
function runLoop() {
|
||||
iteration++;
|
||||
if (iteration >= slices) {
|
||||
|
|
@ -92,7 +92,7 @@ root.runParallelAsyncHarness = function(options) {
|
|||
(options.done || noop)(options);
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
// grab a slice of testss and initialize them
|
||||
var offset = iteration * testPerSlice;
|
||||
var tests = options.tests.slice(offset, offset + testPerSlice);
|
||||
|
|
@ -100,10 +100,10 @@ root.runParallelAsyncHarness = function(options) {
|
|||
(options.setup || noop)(data, options);
|
||||
|
||||
});
|
||||
|
||||
|
||||
// kick off the current slice of tests
|
||||
(options.sliceStart || noop)(options, tests);
|
||||
|
||||
|
||||
// perform individual "start" test-case
|
||||
tests.forEach(function(data) {
|
||||
cases.forEach(function(name) {
|
||||
|
|
@ -112,7 +112,7 @@ root.runParallelAsyncHarness = function(options) {
|
|||
});
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// conclude test (possibly abort)
|
||||
setTimeout(function() {
|
||||
tests.forEach(function(data) {
|
||||
|
|
@ -129,17 +129,17 @@ root.runParallelAsyncHarness = function(options) {
|
|||
data.cases[name].done();
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// finish the test for current slice of tests
|
||||
(options.sliceDone || noop)(options, tests);
|
||||
|
||||
|
||||
// next test please, give the browser 50ms to do catch its breath
|
||||
setTimeout(runLoop, 50);
|
||||
}, duration);
|
||||
}
|
||||
|
||||
|
||||
// allow DOMContentLoaded before actually doing something
|
||||
setTimeout(runLoop, 100);
|
||||
};
|
||||
|
||||
})(window);
|
||||
})(window);
|
||||
|
|
|
|||
|
|
@ -5,14 +5,14 @@ function resizeViewportTo(viewportSelector, width, height) {
|
|||
|
||||
iframe.width = width;
|
||||
iframe.height = height;
|
||||
|
||||
|
||||
iframe.contentWindow.document.body.offsetTop;
|
||||
}
|
||||
|
||||
function injectStylesInIFrame(styleSelector, frameSelector) {
|
||||
var style = document.querySelector(styleSelector),
|
||||
frame = document.querySelector(frameSelector);
|
||||
|
||||
|
||||
frame.contentWindow.addNewStyles(style.textContent);
|
||||
}
|
||||
|
||||
|
|
@ -26,4 +26,4 @@ if (window.parent != window) {
|
|||
styleTag.appendChild(textNode);
|
||||
document.head.appendChild(styleTag);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
//
|
||||
//
|
||||
// Vendor-Prefix Helper Functions For Testing CSS
|
||||
//
|
||||
//
|
||||
|
||||
(function(root) {
|
||||
'use strict';
|
||||
|
|
@ -21,7 +21,7 @@ root.addVendorPrefix = function (name) {
|
|||
// property unknown to browser
|
||||
return name;
|
||||
}
|
||||
|
||||
|
||||
return prefix + name;
|
||||
};
|
||||
|
||||
|
|
@ -32,7 +32,7 @@ root.addValueVendorPrefix = function (property, value) {
|
|||
// property unknown to browser
|
||||
return name;
|
||||
}
|
||||
|
||||
|
||||
return prefix + value;
|
||||
};
|
||||
|
||||
|
|
@ -41,7 +41,7 @@ root.getVendorPrefix = function(name) {
|
|||
if (prefixCache[name] !== undefined) {
|
||||
return prefixCache[name];
|
||||
}
|
||||
|
||||
|
||||
var elem = document.createElement("div");
|
||||
name = camelCase(name);
|
||||
|
||||
|
|
@ -78,9 +78,9 @@ root.getValueVendorPrefix = function(property, value) {
|
|||
return styles[i];
|
||||
}
|
||||
}
|
||||
document.body.removeChild(elem);
|
||||
document.body.removeChild(elem);
|
||||
return false;
|
||||
};
|
||||
|
||||
|
||||
})(window);
|
||||
})(window);
|
||||
|
|
|
|||
|
|
@ -7,13 +7,13 @@
|
|||
<link href="http://www.w3.org/TR/css3-values/#time" rel="help" title="CSS Values and Units Module Level 3 - 6.2. Times: the ‘<time>’ type and ‘s’, ‘ms’ units">
|
||||
<link href="http://rodneyrehm.de/en/" rel="author" title="Rodney Rehm">
|
||||
<meta content="dom" name="flags">
|
||||
|
||||
|
||||
<script src="/resources/testharness.js" type="text/javascript"></script>
|
||||
<script src="/resources/testharnessreport.js" type="text/javascript"></script>
|
||||
|
||||
|
||||
<script src="./support/vendorPrefix.js" type="text/javascript"></script>
|
||||
<script src="./support/helper.js" type="text/javascript"></script>
|
||||
|
||||
|
||||
<script id="metadata_cache">/*
|
||||
{
|
||||
"parse '10.2s'": {},
|
||||
|
|
@ -50,7 +50,7 @@
|
|||
|
||||
<script>
|
||||
var transition = document.getElementById('transition');
|
||||
// <time> [, <time>]*
|
||||
// <time> [, <time>]*
|
||||
var values = {
|
||||
// seconds
|
||||
'10.2s': '10.2s',
|
||||
|
|
@ -79,13 +79,13 @@
|
|||
// invalid
|
||||
'foobar': '0s'
|
||||
};
|
||||
|
||||
|
||||
// these tests are supposed to fail and
|
||||
// possibly make the engine issue a parser warning
|
||||
var invalidTests = {
|
||||
'foobar': true
|
||||
};
|
||||
|
||||
|
||||
for (var key in values) {
|
||||
if (Object.prototype.hasOwnProperty.call(values, key)) {
|
||||
test(function() {
|
||||
|
|
@ -103,4 +103,5 @@
|
|||
}
|
||||
</script>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -7,13 +7,13 @@
|
|||
<link href="http://www.w3.org/TR/css3-values/#time" rel="help" title="CSS Values and Units Module Level 3 - 6.2. Times: the ‘<time>’ type and ‘s’, ‘ms’ units">
|
||||
<link href="http://rodneyrehm.de/en/" rel="author" title="Rodney Rehm">
|
||||
<meta content="dom" name="flags">
|
||||
|
||||
|
||||
<script src="/resources/testharness.js" type="text/javascript"></script>
|
||||
<script src="/resources/testharnessreport.js" type="text/javascript"></script>
|
||||
|
||||
|
||||
<script src="./support/vendorPrefix.js" type="text/javascript"></script>
|
||||
<script src="./support/helper.js" type="text/javascript"></script>
|
||||
|
||||
|
||||
<script id="metadata_cache">/*
|
||||
{
|
||||
"parse '10.2s'": {},
|
||||
|
|
@ -50,7 +50,7 @@
|
|||
|
||||
<script>
|
||||
var transition = document.getElementById('transition');
|
||||
// <time> [, <time>]*
|
||||
// <time> [, <time>]*
|
||||
var values = {
|
||||
// seconds
|
||||
'10.2s': '10.2s',
|
||||
|
|
@ -78,7 +78,7 @@
|
|||
// invalid
|
||||
'foobar': '0s'
|
||||
};
|
||||
|
||||
|
||||
// these tests are supposed to fail and
|
||||
// possibly make the engine issue a parser warning
|
||||
var invalidTests = {
|
||||
|
|
@ -86,7 +86,7 @@
|
|||
'-500ms': true,
|
||||
'foobar': true
|
||||
};
|
||||
|
||||
|
||||
for (var key in values) {
|
||||
if (Object.prototype.hasOwnProperty.call(values, key)) {
|
||||
test(function() {
|
||||
|
|
@ -104,4 +104,5 @@
|
|||
}
|
||||
</script>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -1,8 +1,8 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
CSS Values and Units Test:
|
||||
Viewport units are supported inside calc expressions.
|
||||
</title>
|
||||
<meta content="
|
||||
|
|
@ -10,25 +10,25 @@
|
|||
" name="assert">
|
||||
|
||||
|
||||
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY">
|
||||
<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-notation" rel="help">
|
||||
|
||||
<link href="reference/all-green.htm" rel="match">
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
|
||||
|
||||
html, body { margin: 0px; padding: 0px; }
|
||||
|
||||
|
||||
html { background: red; }
|
||||
#target { position: absolute; background: green; width: calc(100vw + 50%); height: calc(100vh + 50%); top: -50%; left: -50%; }
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
<div id="target"></div>
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
CSS Values and Units Test:
|
||||
Viewport units are supported inside calc expressions.
|
||||
</title>
|
||||
<meta content="
|
||||
|
|
@ -10,25 +10,25 @@
|
|||
" name="assert">
|
||||
|
||||
|
||||
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY">
|
||||
<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-notation" rel="help">
|
||||
|
||||
<link href="reference/all-green.htm" rel="match">
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
|
||||
|
||||
html, body { margin: 0px; padding: 0px; }
|
||||
|
||||
|
||||
html { background: red; }
|
||||
#target { position: absolute; background: green; width: calc(100vw + 50px); height: calc(100vh + 50px); top: -50px; left: -50px; }
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
<div id="target"></div>
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,29 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
CSS Values and Units Test:
|
||||
0vh and 0vw are correctly treated as 0px
|
||||
</title>
|
||||
<meta content="
|
||||
0vh and 0vw are correctly treated as 0px
|
||||
" name="assert">
|
||||
|
||||
|
||||
<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="reference/all-green.htm" rel="match">
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
|
||||
|
||||
html, body { margin: 0px; padding: 0px; }
|
||||
|
||||
|
||||
html { background: red; font-size: 100vw; }
|
||||
#target { background: green; width: 1rem; height: 1em; font-size: 100vh; }
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,30 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
CSS Values and Units Test:
|
||||
Viewport units are inherited properly
|
||||
</title>
|
||||
<meta content="
|
||||
Viewport units are inherited properly
|
||||
" name="assert">
|
||||
|
||||
|
||||
<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="reference/all-green.htm" rel="match">
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
|
||||
|
||||
html, body { margin: 0px; padding: 0px; }
|
||||
|
||||
|
||||
html { background: red; }
|
||||
#outer { position: relative; background: green; width: 50vw; height: 100vh; }
|
||||
#inner { position: absolute; background: green; left: 100%; width: inherit; height: inherit; }
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
|
|
|||
|
|
@ -2,35 +2,35 @@
|
|||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
CSS Values and Units Test:
|
||||
Viewport units are interpolated correctly
|
||||
</title>
|
||||
<meta content="
|
||||
The interpolated size mid-way between 0px and 200vh is 100vh (respectively for vw)
|
||||
" name="assert">
|
||||
|
||||
|
||||
<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-animations/#animations" rel="help">
|
||||
|
||||
<link href="reference/all-green.htm" rel="match">
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
|
||||
|
||||
@keyframes anim {
|
||||
from { width: 0%; height: 0%; }
|
||||
to { width: 200vw; height: 200vh; }
|
||||
}
|
||||
|
||||
|
||||
html, body { margin: 0px; padding: 0px; }
|
||||
|
||||
|
||||
html { background: red; overflow: hidden; }
|
||||
#outer { position: relative; background: green; }
|
||||
#outer { animation: anim 2000000s; animation-delay: -1000000s; }
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
|
|
|||
|
|
@ -2,35 +2,35 @@
|
|||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
CSS Values and Units Test:
|
||||
Viewport units are interpolated correctly
|
||||
</title>
|
||||
<meta content="
|
||||
The interpolated size mid-way between 0px and 200vh is 100vh (respectively for vw)
|
||||
" name="assert">
|
||||
|
||||
|
||||
<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-animations/#animations" rel="help">
|
||||
|
||||
<link href="reference/all-green.htm" rel="match">
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
|
||||
|
||||
@keyframes anim {
|
||||
from { width: 0px; height: 0px; }
|
||||
to { width: 200vw; height: 200vh; }
|
||||
}
|
||||
|
||||
|
||||
html, body { margin: 0px; padding: 0px; }
|
||||
|
||||
|
||||
html { background: red; overflow: hidden; }
|
||||
#outer { position: relative; background: green; }
|
||||
#outer { animation: anim 2000000s; animation-delay: -1000000s; }
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
|
|
|||
|
|
@ -2,35 +2,35 @@
|
|||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
CSS Values and Units Test:
|
||||
Viewport units are interpolated correctly
|
||||
</title>
|
||||
<meta content="
|
||||
The interpolated size mid-way between 75vh and 125vh is 100vh (respectively for vw)
|
||||
" name="assert">
|
||||
|
||||
|
||||
<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-animations/#animations" rel="help">
|
||||
|
||||
<link href="reference/all-green.htm" rel="match">
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
|
||||
|
||||
@keyframes anim {
|
||||
from { width: 75vw; height: 75vh; }
|
||||
to { width: 125vw; height: 125vh; }
|
||||
}
|
||||
|
||||
|
||||
html, body { margin: 0px; padding: 0px; }
|
||||
|
||||
|
||||
html { background: red; overflow: hidden; }
|
||||
#outer { position: relative; background: green; }
|
||||
#outer { animation: anim 2000000s; animation-delay: -1000000s; }
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,32 +1,32 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
CSS Values and Units Test:
|
||||
Viewports units are supported in @viewport rules
|
||||
</title>
|
||||
<meta content="
|
||||
Viewports units are supported in @viewport rules
|
||||
" name="assert">
|
||||
|
||||
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY">
|
||||
|
||||
<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="https://drafts.csswg.org/css-device-adapt-1/" rel="help">
|
||||
|
||||
<link href="reference/all-green.htm" rel="match">
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
|
||||
|
||||
html, body { margin: 0px; padding: 0px; overflow: hidden; }
|
||||
|
||||
|
||||
@viewport { width: 1vw; }
|
||||
|
||||
|
||||
html { background: red; }
|
||||
#target { background: green; width: 100vw; height: 100vh; }
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,29 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
CSS Values and Units Test:
|
||||
Viewports units are supported in margin properties
|
||||
</title>
|
||||
<meta content="
|
||||
Viewports units are supported in margin properties
|
||||
" name="assert">
|
||||
|
||||
|
||||
<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="reference/all-green.htm" rel="match">
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
|
||||
|
||||
html, body { margin: 0px; padding: 0px; }
|
||||
|
||||
|
||||
html { background: green; }
|
||||
#target { background: red; width: 100%; height: 100%; margin-left: -100vw; margin-top: -100vh; }
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,30 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
CSS Values and Units Test:
|
||||
Viewports units are supported in transform properties
|
||||
</title>
|
||||
<meta content="
|
||||
Viewports units are supported in transform properties
|
||||
" name="assert">
|
||||
|
||||
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY">
|
||||
|
||||
<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-2d-transforms/#css-values" rel="help">
|
||||
|
||||
<link href="reference/all-green.htm" rel="match">
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
|
||||
|
||||
html, body { margin: 0px; padding: 0px; overflow: hidden; }
|
||||
|
||||
|
||||
html { background: green; }
|
||||
iframe { width: 400px; height: 400px; margin: 0px; padding: 0px; border: 0px none transparent; }
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,30 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
CSS Values and Units Test:
|
||||
Viewports units are supported in transform properties
|
||||
</title>
|
||||
<meta content="
|
||||
Viewports units are supported in transform properties (translate)
|
||||
" name="assert">
|
||||
|
||||
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY">
|
||||
|
||||
<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-2d-transforms/#css-values" rel="help">
|
||||
|
||||
<link href="reference/all-green.htm" rel="match">
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
|
||||
|
||||
html, body { margin: 0px; padding: 0px; overflow: hidden; }
|
||||
|
||||
|
||||
html { background: green; }
|
||||
iframe { width: 400px; height: 400px; margin: 0px; padding: 0px; border: 0px none transparent; }
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,27 +1,27 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
CSS Values and Units Test:
|
||||
Viewports units are supported in sizing properties
|
||||
</title>
|
||||
<meta content="
|
||||
Viewports units are supported in sizing properties
|
||||
" name="assert">
|
||||
|
||||
|
||||
<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="reference/all-green.htm" rel="match">
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
|
||||
|
||||
html, body { margin: 0px; padding: 0px; }
|
||||
|
||||
|
||||
#target { background: green; width: 100vw; height: 100vh; }
|
||||
</style>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,29 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
CSS Values and Units Test:
|
||||
0vh and 0vw are correctly treated as 0px
|
||||
</title>
|
||||
<meta content="
|
||||
0vh and 0vw are correctly treated as 0px
|
||||
" name="assert">
|
||||
|
||||
|
||||
<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="reference/all-green.htm" rel="match">
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
|
||||
|
||||
html, body { margin: 0px; padding: 0px; }
|
||||
|
||||
|
||||
html { background: green; }
|
||||
#target { background: red; width: 0vw; height: 0vh; }
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@
|
|||
<div id="referenceBoxGrownHorizontallyByJS"></div>
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
|
||||
// In case this file was opened by mistake, redirects to proper test
|
||||
if (window.top.location.href === document.location.href) {
|
||||
|
||||
|
|
|
|||
|
|
@ -37,10 +37,10 @@
|
|||
var actualHeight = rect.height;
|
||||
var expectedWidth = frameWidth * scale / 2;
|
||||
var expectedHeight = frameHeight * scale / 2;
|
||||
|
||||
|
||||
assert_approx_equals(actualWidth, expectedWidth, 0.1, '50vw at ' + scale + ' scale');
|
||||
assert_approx_equals(actualHeight, expectedHeight, 0.1, '50vh at ' + scale + ' scale');
|
||||
}
|
||||
}
|
||||
}, 'viewport relative units in scaled viewport');
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,23 +1,23 @@
|
|||
<!DOCTYPE html>
|
||||
<html><head>
|
||||
|
||||
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
CSS Values and Units Test:
|
||||
Checks viewport units against CSS 2.1 properties and the CSSOM
|
||||
</title>
|
||||
<meta content="Testing what happens when one applies and rereads viewport unit lengths to CSS 2.1 properties that accept length values" name="assert">
|
||||
|
||||
|
||||
<link href="mailto:schaepp@gmx.de" rel="author" title="Christian Schaefer">
|
||||
|
||||
<!-- You must have at least one spec link, but may have as many as are covered in the test. -->
|
||||
<!-- Be sure to make the main testing area first in the order -->
|
||||
<link href="http://www.w3.org/TR/css3-values/#viewport-relative-lengths" rel="help">
|
||||
|
||||
<!-- testharness inclusion for later submission -->
|
||||
<!-- testharness inclusion for later submission -->
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
|
||||
<!-- testharness fallback for local testing -->
|
||||
|
||||
<!-- testharness fallback for local testing -->
|
||||
<script>
|
||||
window.test || document.write('\
|
||||
<script src="http://www.w3c-test.org/resources/testharness.js"><\/script>\
|
||||
|
|
@ -26,7 +26,7 @@
|
|||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
|
||||
#div {
|
||||
position: relative;
|
||||
width: 50vw;
|
||||
|
|
@ -35,17 +35,17 @@
|
|||
border: 0 green solid;
|
||||
font-size: 4vw;
|
||||
}
|
||||
|
||||
|
||||
#table td {
|
||||
border: 1px solid green;
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
|
||||
|
||||
<p>
|
||||
Checks viewport units. Also re-check with zoom in/out.
|
||||
</p>
|
||||
|
|
@ -53,7 +53,7 @@
|
|||
<div id="div">
|
||||
Test the Web Forward!
|
||||
</div>
|
||||
|
||||
|
||||
<table id="table">
|
||||
<tbody>
|
||||
<tr>
|
||||
|
|
@ -64,46 +64,46 @@
|
|||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
|
||||
<script>
|
||||
|
||||
|
||||
/* Boilerplate code */
|
||||
|
||||
|
||||
var camelize = function (str) {
|
||||
return str.replace(/\-(\w)/g, function(str, letter){
|
||||
return letter.toUpperCase();
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
var retrieveComputedStyle = function(element,property){
|
||||
var result =
|
||||
var result =
|
||||
document
|
||||
.defaultView
|
||||
.getComputedStyle(element,null)
|
||||
.getPropertyValue(property);
|
||||
|
||||
|
||||
// If there are multiple values, cut down to the first
|
||||
result = result.split(' ')[0];
|
||||
|
||||
|
||||
if(window.console) console.log('Retrieving ' + property + ' property. Result: ' + result);
|
||||
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
|
||||
var testit = function(element,vunit,property,expectedResult){
|
||||
|
||||
element.style[camelize(property)] = '0px';
|
||||
element.style[camelize(property)] = lengthAmount + vunit;
|
||||
|
||||
|
||||
if(window.console) console.log(element.nodeName.toLowerCase() + '.style.' + camelize(property) + ' = ' + lengthAmount + vunit);
|
||||
|
||||
|
||||
var result = retrieveComputedStyle(element,property);
|
||||
|
||||
// Test against WebKit's getComputedStyle bug, where it does not return absolute values
|
||||
// As required here: http://www.w3.org/TR/1998/REC-CSS2-19980512/cascade.html#computed-value
|
||||
// If it returns a pixel value, but this value is 0px then it is considered a fail, too.
|
||||
var px_result = result.search(/^[-\d\.]+px$/) !== -1 && result !== '0px' ? 'non-zero px-based value' : result;
|
||||
|
||||
|
||||
// If browser returns pixel value, we compare against our expected pixel value
|
||||
if(px_result === 'non-zero px-based value'){
|
||||
test(function(){
|
||||
|
|
@ -121,14 +121,14 @@
|
|||
test(function(){
|
||||
assert_equals(px_result,'non-zero px-based value');
|
||||
},vunit + ' length applied to ' + property + ': getComputedStyle returns a non-zero px-based value');
|
||||
|
||||
|
||||
element.style[camelize(property)] = '';
|
||||
}
|
||||
|
||||
var lengthAmount = 10;
|
||||
var layoutViewportWidth = document.documentElement.clientWidth;
|
||||
var layoutViewportHeight = document.documentElement.clientHeight;
|
||||
|
||||
|
||||
var viewportUnits = [
|
||||
{
|
||||
ident: 'vw',
|
||||
|
|
@ -147,7 +147,7 @@
|
|||
expectedResult: layoutViewportWidth > layoutViewportHeight ? Math.round(layoutViewportWidth * (lengthAmount / 100)) : Math.round(layoutViewportHeight * (lengthAmount / 100))
|
||||
}
|
||||
]
|
||||
|
||||
|
||||
// List of length accepting properties and which element they map to
|
||||
// http://www.w3.org/TR/CSS21/propidx.html
|
||||
var lengthAcceptingProperties = [
|
||||
|
|
@ -239,12 +239,12 @@
|
|||
|
||||
for(unitEntry in viewportUnits){
|
||||
for(propertyEntry in lengthAcceptingProperties){
|
||||
|
||||
|
||||
var vunit = viewportUnits[unitEntry].ident;
|
||||
var expectedResult = viewportUnits[unitEntry].expectedResult;
|
||||
var property = lengthAcceptingProperties[propertyEntry].name;
|
||||
var element = window[lengthAcceptingProperties[propertyEntry].element];
|
||||
|
||||
|
||||
testit(element,vunit,property,expectedResult);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,34 +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/attr-color-invalid-cast.htm c739194dc392a0edc9016c7d02e4ffa7aed3f112 ?
|
||||
xhtml1/attr-color-invalid-cast.xht c739194dc392a0edc9016c7d02e4ffa7aed3f112 ?
|
||||
html/attr-color-invalid-fallback.htm a53a082983309396181c3a56ef189b80c3b01dcd ?
|
||||
xhtml1/attr-color-invalid-fallback.xht a53a082983309396181c3a56ef189b80c3b01dcd ?
|
||||
html/attr-color-valid.htm fbdf8b7aeaf427d7501ab939af10082f68526233 ?
|
||||
xhtml1/attr-color-valid.xht fbdf8b7aeaf427d7501ab939af10082f68526233 ?
|
||||
html/attr-invalid-type-001.htm d761968ba12a9ab48dec58d5f6d8d87d852342a8 ?
|
||||
xhtml1/attr-invalid-type-001.xht d761968ba12a9ab48dec58d5f6d8d87d852342a8 ?
|
||||
html/attr-invalid-type-002.htm 723b7acc9e8bb8f50ffdeb07915a0dece313b204 ?
|
||||
xhtml1/attr-invalid-type-002.xht 723b7acc9e8bb8f50ffdeb07915a0dece313b204 ?
|
||||
html/attr-invalid-type-003.htm 723b7acc9e8bb8f50ffdeb07915a0dece313b204 ?
|
||||
xhtml1/attr-invalid-type-003.xht 723b7acc9e8bb8f50ffdeb07915a0dece313b204 ?
|
||||
html/attr-length-invalid-cast.htm 6544f087cfa18722ab5319b6e9e0b80259f000e3 ?
|
||||
xhtml1/attr-length-invalid-cast.xht 6544f087cfa18722ab5319b6e9e0b80259f000e3 ?
|
||||
html/attr-length-invalid-fallback.htm d20a0ec2a269b9ba17e5d7fee2cc179d22f3e062 ?
|
||||
xhtml1/attr-length-invalid-fallback.xht d20a0ec2a269b9ba17e5d7fee2cc179d22f3e062 ?
|
||||
html/attr-length-valid-zero-nofallback.htm ae46098aceb1ecb1437e6517d321f72f2b466d5c ?
|
||||
xhtml1/attr-length-valid-zero-nofallback.xht ae46098aceb1ecb1437e6517d321f72f2b466d5c ?
|
||||
html/attr-length-valid-zero.htm 8897754f065036093418367cca151e0c26749493 ?
|
||||
xhtml1/attr-length-valid-zero.xht 8897754f065036093418367cca151e0c26749493 ?
|
||||
html/attr-length-valid.htm e41ed5397756295b20a2d92b4276262c9c012dd8 ?
|
||||
xhtml1/attr-length-valid.xht e41ed5397756295b20a2d92b4276262c9c012dd8 ?
|
||||
html/attr-px-invalid-cast.htm 6e44c7a20379652ef4517d9d087b4ca9a2d92fa4 ?
|
||||
xhtml1/attr-px-invalid-cast.xht 6e44c7a20379652ef4517d9d087b4ca9a2d92fa4 ?
|
||||
html/attr-px-invalid-fallback.htm 29158a88075fb2883bc22a9d24fd7d002ad87ed7 ?
|
||||
xhtml1/attr-px-invalid-fallback.xht 29158a88075fb2883bc22a9d24fd7d002ad87ed7 ?
|
||||
html/attr-px-valid.htm 097d48de55d74ad6ae61e768cda0c2b2426eda92 ?
|
||||
xhtml1/attr-px-valid.xht 097d48de55d74ad6ae61e768cda0c2b2426eda92 ?
|
||||
html/calc-background-image-gradient-1.htm 4908626b6c3bd6da5d47ec5ee366e0c06d8cae50 ?
|
||||
xhtml1/calc-background-image-gradient-1.xht 4908626b6c3bd6da5d47ec5ee366e0c06d8cae50 ?
|
||||
html/calc-background-linear-gradient-1.htm 89f5dc390231b59bc044bde93bb4cc3133002df6 ?
|
||||
|
|
@ -47,14 +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 4dbdaf4a19ce6c32853e5384f14bb0a9ed77360b ?
|
||||
xhtml1/calc-in-media-queries-001.xht 4dbdaf4a19ce6c32853e5384f14bb0a9ed77360b ?
|
||||
html/calc-in-media-queries-002.htm 9a9949bf31ece680a8d54659d18517483a919d2d ?
|
||||
xhtml1/calc-in-media-queries-002.xht 9a9949bf31ece680a8d54659d18517483a919d2d ?
|
||||
html/calc-invalid-range-clamping.htm b27b28c5a0fe3027e23fadc94ca18e15cecc1668 ?
|
||||
xhtml1/calc-invalid-range-clamping.xht b27b28c5a0fe3027e23fadc94ca18e15cecc1668 ?
|
||||
html/calc-in-calc.htm e4e4ec2f46be9a9a54bb3c86d2b256e03644dc25 ?
|
||||
xhtml1/calc-in-calc.xht e4e4ec2f46be9a9a54bb3c86d2b256e03644dc25 ?
|
||||
html/calc-in-media-queries-001.htm 19716233220fa1ac70f6299dde69dbe73ae3f08c ?
|
||||
xhtml1/calc-in-media-queries-001.xht 19716233220fa1ac70f6299dde69dbe73ae3f08c ?
|
||||
html/calc-in-media-queries-002.htm ba99058dbb02f00c6ce8a9a1a99b906fe0d65ab4 ?
|
||||
xhtml1/calc-in-media-queries-002.xht ba99058dbb02f00c6ce8a9a1a99b906fe0d65ab4 ?
|
||||
html/calc-invalid-range-clamping.htm f1b5230f0a67130662234cec3e045d79090a048c ?
|
||||
xhtml1/calc-invalid-range-clamping.xht f1b5230f0a67130662234cec3e045d79090a048c ?
|
||||
html/calc-margin-block-1.htm 1d7889b64fd00e87e2b2961c5e42e6af8577ae5a ?
|
||||
xhtml1/calc-margin-block-1.xht 1d7889b64fd00e87e2b2961c5e42e6af8577ae5a ?
|
||||
html/calc-max-height-block-1.htm f59e64c55e4610b5e23a0cf99f646f657d0ae58f ?
|
||||
|
|
@ -87,8 +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-parenthesis-stack.htm 6c42d59f2f748b71a555906b34d94dec8461b586 ?
|
||||
xhtml1/calc-parenthesis-stack.xht 6c42d59f2f748b71a555906b34d94dec8461b586 ?
|
||||
html/calc-text-indent-1.htm 4791e504f1036b2c117a842014409132ffc0f8e0 ?
|
||||
xhtml1/calc-text-indent-1.xht 4791e504f1036b2c117a842014409132ffc0f8e0 ?
|
||||
html/calc-text-indent-intrinsic-1.htm 212d0b36c668eb0ce4b8fbffb7ddc91faac7ef10 ?
|
||||
|
|
@ -109,8 +109,8 @@ 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/initial-background-color.htm 6cd2e78183197a657c356dd0245a8f689796f978 ?
|
||||
xhtml1/initial-background-color.xht 6cd2e78183197a657c356dd0245a8f689796f978 ?
|
||||
html/min-width-001.htm edff68d05ca48525e5456d924b43578c8dfdbf57 ?
|
||||
xhtml1/min-width-001.xht edff68d05ca48525e5456d924b43578c8dfdbf57 ?
|
||||
html/mq-calc-001.htm 7e98c39bcf90aaad01b9a98249c7577476980edc ?
|
||||
|
|
@ -129,8 +129,8 @@ html/multicol-count-non-integer-002.htm ed064290bd392497aad5107e30a9e336532a4d31
|
|||
xhtml1/multicol-count-non-integer-002.xht ed064290bd392497aad5107e30a9e336532a4d31 ?
|
||||
html/multicol-count-non-integer-003.htm d6173aac65acc056fcc61b00944e06e7f30f70e9 ?
|
||||
xhtml1/multicol-count-non-integer-003.xht d6173aac65acc056fcc61b00944e06e7f30f70e9 ?
|
||||
html/multicol-inherit-002.htm 2d1165aded078402115fc317a47ae6856bed77a6 ?
|
||||
xhtml1/multicol-inherit-002.xht 2d1165aded078402115fc317a47ae6856bed77a6 ?
|
||||
html/multicol-inherit-002.htm 79571c3715ea12ef5813ed474e32d785dc7b33d5 ?
|
||||
xhtml1/multicol-inherit-002.xht 79571c3715ea12ef5813ed474e32d785dc7b33d5 ?
|
||||
html/multicol-rule-color-inherit-001.htm ccebd3df8a5aa4b32dad211082f45f677c8a61c5 ?
|
||||
xhtml1/multicol-rule-color-inherit-001.xht ccebd3df8a5aa4b32dad211082f45f677c8a61c5 ?
|
||||
html/multicol-rule-color-inherit-002.htm 5df59c878149324b852064274b30ee0782181442 ?
|
||||
|
|
@ -147,16 +147,16 @@ 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-circle-011.htm 8cc2d5a116e562bc4600e5cf7997391247259921 ?
|
||||
xhtml1/shape-outside-circle-011.xht 8cc2d5a116e562bc4600e5cf7997391247259921 ?
|
||||
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-ellipse-010.htm 8c49b198bd80451d133a58cd38c2b239a00559d6 ?
|
||||
xhtml1/shape-outside-ellipse-010.xht 8c49b198bd80451d133a58cd38c2b239a00559d6 ?
|
||||
html/shape-outside-ellipse-011.htm 48410d76452c7db1675fa2e3fd3eeebe072948ba ?
|
||||
xhtml1/shape-outside-ellipse-011.xht 48410d76452c7db1675fa2e3fd3eeebe072948ba ?
|
||||
html/shape-outside-inset-003.htm a28821639a481807aba32477b3ad98a7bec40b41 ?
|
||||
xhtml1/shape-outside-inset-003.xht a28821639a481807aba32477b3ad98a7bec40b41 ?
|
||||
html/shape-outside-inset-008.htm 99dbe179f30b42dea217ec39b2776c4418f7101b ?
|
||||
|
|
@ -167,41 +167,41 @@ 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 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 ?
|
||||
xhtml1/vh-inherit.xht e006cf0e4f727a753c115bb062ed9aa3854375b0 ?
|
||||
html/vh-interpolate-pct.htm fd47cb04c7042f6379b2664b7742a5a01ea9d1a0 ?
|
||||
xhtml1/vh-interpolate-pct.xht fd47cb04c7042f6379b2664b7742a5a01ea9d1a0 ?
|
||||
html/vh-interpolate-px.htm 41a610e2dd418e47f56d88171dd0c52a57e06b5e ?
|
||||
xhtml1/vh-interpolate-px.xht 41a610e2dd418e47f56d88171dd0c52a57e06b5e ?
|
||||
html/vh-interpolate-vh.htm 42ccc23cc2f90272644bd0188261dacba081ccb2 ?
|
||||
xhtml1/vh-interpolate-vh.xht 42ccc23cc2f90272644bd0188261dacba081ccb2 ?
|
||||
html/vh-support-atviewport.htm 7cc8bb8f1cde2aecece15e72882e45b67bfc4bdd ?
|
||||
xhtml1/vh-support-atviewport.xht 7cc8bb8f1cde2aecece15e72882e45b67bfc4bdd ?
|
||||
html/vh-support-margin.htm f951f1c99e3a6be4134265b4da05aabbd71eb103 ?
|
||||
xhtml1/vh-support-margin.xht f951f1c99e3a6be4134265b4da05aabbd71eb103 ?
|
||||
html/vh-support-transform-origin.htm 8dee0773fb5519b06d225ea643bb562db431f97c ?
|
||||
xhtml1/vh-support-transform-origin.xht 8dee0773fb5519b06d225ea643bb562db431f97c ?
|
||||
html/vh-support-transform-translate.htm 8ce0374dbb32ab1c6b2a3590856748be6b92fb91 ?
|
||||
xhtml1/vh-support-transform-translate.xht 8ce0374dbb32ab1c6b2a3590856748be6b92fb91 ?
|
||||
html/vh-support.htm 13609543ab6880c4f4fa00168fe8c6d48abf0270 ?
|
||||
xhtml1/vh-support.xht 13609543ab6880c4f4fa00168fe8c6d48abf0270 ?
|
||||
html/vh-zero-support.htm 8cb13e6d29fba8a619119a85d745dd3e87156c22 ?
|
||||
xhtml1/vh-zero-support.xht 8cb13e6d29fba8a619119a85d745dd3e87156c22 ?
|
||||
html/transition-delay-001.htm 8cbc19fba44529b813cccb3718c89823f0ce9e6b ?
|
||||
xhtml1/transition-delay-001.xht 8cbc19fba44529b813cccb3718c89823f0ce9e6b ?
|
||||
html/transition-duration-001.htm 0c969d8d8f97eee173b54378f197142369f0a12c ?
|
||||
xhtml1/transition-duration-001.xht 0c969d8d8f97eee173b54378f197142369f0a12c ?
|
||||
html/vh-calc-support-pct.htm 44dab675c1250fbe6733f93b073658e50c553906 ?
|
||||
xhtml1/vh-calc-support-pct.xht 44dab675c1250fbe6733f93b073658e50c553906 ?
|
||||
html/vh-calc-support.htm 715eab3e5839cba3da9cd733d2a3f8ebba89d193 ?
|
||||
xhtml1/vh-calc-support.xht 715eab3e5839cba3da9cd733d2a3f8ebba89d193 ?
|
||||
html/vh-em-inherit.htm b9fbd87b6cedf89db957e1668a0b7baf0a637f6b ?
|
||||
xhtml1/vh-em-inherit.xht b9fbd87b6cedf89db957e1668a0b7baf0a637f6b ?
|
||||
html/vh-inherit.htm 143b598f9e8f5aa2a349f9ad524249d0b61f1c4f ?
|
||||
xhtml1/vh-inherit.xht 143b598f9e8f5aa2a349f9ad524249d0b61f1c4f ?
|
||||
html/vh-interpolate-pct.htm ceef2964c18d7fd3cab6f5923fa60a633ec97442 ?
|
||||
xhtml1/vh-interpolate-pct.xht ceef2964c18d7fd3cab6f5923fa60a633ec97442 ?
|
||||
html/vh-interpolate-px.htm ade4e7b3374856c99aa9515a936630f49c5c44fb ?
|
||||
xhtml1/vh-interpolate-px.xht ade4e7b3374856c99aa9515a936630f49c5c44fb ?
|
||||
html/vh-interpolate-vh.htm 9a46dd5fa51b77278d6d50f7c7f862592aea3413 ?
|
||||
xhtml1/vh-interpolate-vh.xht 9a46dd5fa51b77278d6d50f7c7f862592aea3413 ?
|
||||
html/vh-support-atviewport.htm 246c990528ff3491a35329ffa4b7a9274160510c ?
|
||||
xhtml1/vh-support-atviewport.xht 246c990528ff3491a35329ffa4b7a9274160510c ?
|
||||
html/vh-support-margin.htm 823e9f5c74674f088c75bb3e0c80b858e7c4fb00 ?
|
||||
xhtml1/vh-support-margin.xht 823e9f5c74674f088c75bb3e0c80b858e7c4fb00 ?
|
||||
html/vh-support-transform-origin.htm 18233d6b7df8680145b4619278291e7f3452f02a ?
|
||||
xhtml1/vh-support-transform-origin.xht 18233d6b7df8680145b4619278291e7f3452f02a ?
|
||||
html/vh-support-transform-translate.htm 6005c29efe52ea0eedb402ba93150a893c06940d ?
|
||||
xhtml1/vh-support-transform-translate.xht 6005c29efe52ea0eedb402ba93150a893c06940d ?
|
||||
html/vh-support.htm 2be374c5e5ec334fe4c6c3417901f70c910e1384 ?
|
||||
xhtml1/vh-support.xht 2be374c5e5ec334fe4c6c3417901f70c910e1384 ?
|
||||
html/vh-zero-support.htm 406973d43e0cda26fba220dc4241b0ef88ea9cb7 ?
|
||||
xhtml1/vh-zero-support.xht 406973d43e0cda26fba220dc4241b0ef88ea9cb7 ?
|
||||
html/vh_not_refreshing_on_chrome.htm a27560454ad4d3e11996f4a3a9ed7d66f4b639b8 ?
|
||||
xhtml1/vh_not_refreshing_on_chrome.xht a27560454ad4d3e11996f4a3a9ed7d66f4b639b8 ?
|
||||
html/vh_not_refreshing_on_chrome_iframe.htm 8d080a2350a0e8e006e0141407e6a2c804027986 ?
|
||||
xhtml1/vh_not_refreshing_on_chrome_iframe.xht 8d080a2350a0e8e006e0141407e6a2c804027986 ?
|
||||
html/viewport-relative-lengths-scaled-viewport.htm 34183e6c538e9e431ef5cd0cb5d6834a911f3b8f ?
|
||||
xhtml1/viewport-relative-lengths-scaled-viewport.xht 34183e6c538e9e431ef5cd0cb5d6834a911f3b8f ?
|
||||
html/viewport-units-css2-001.htm 0765a1e0ba205be0f26ff35a8683c6e91f2c43a7 ?
|
||||
xhtml1/viewport-units-css2-001.xht 0765a1e0ba205be0f26ff35a8683c6e91f2c43a7 ?
|
||||
html/vh_not_refreshing_on_chrome_iframe.htm 1d8864a842fd30399d2ec65a030154145bda58f4 ?
|
||||
xhtml1/vh_not_refreshing_on_chrome_iframe.xht 1d8864a842fd30399d2ec65a030154145bda58f4 ?
|
||||
html/viewport-relative-lengths-scaled-viewport.htm 4c98439900308a90b741b6c543e905609c7eb02b ?
|
||||
xhtml1/viewport-relative-lengths-scaled-viewport.xht 4c98439900308a90b741b6c543e905609c7eb02b ?
|
||||
html/viewport-units-css2-001.htm 027cff9474dd9074b03f2432739139341ec0c2d3 ?
|
||||
xhtml1/viewport-units-css2-001.xht 027cff9474dd9074b03f2432739139341ec0c2d3 ?
|
||||
|
|
|
|||
|
|
@ -130,8 +130,6 @@
|
|||
<li>Christian Schaefer</li>
|
||||
<li>Emil A Eklund</li>
|
||||
<li>Florian Rivoal</li>
|
||||
<li>Fran�ois REMY</li>
|
||||
<li>François REMY</li>
|
||||
<li>François REMY</li>
|
||||
<li>Gérard Talbot</li>
|
||||
<li>L. David Baron</li>
|
||||
|
|
|
|||
|
|
@ -130,8 +130,6 @@
|
|||
<li>Christian Schaefer</li>
|
||||
<li>Emil A Eklund</li>
|
||||
<li>Florian Rivoal</li>
|
||||
<li>Fran�ois REMY</li>
|
||||
<li>François REMY</li>
|
||||
<li>François REMY</li>
|
||||
<li>Gérard Talbot</li>
|
||||
<li>L. David Baron</li>
|
||||
|
|
|
|||
|
|
@ -1,19 +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.
|
||||
attr-color-invalid-cast reference/200-200-green Attribute references (colors) http://www.w3.org/TR/css3-values/#attr-notation c739194dc392a0edc9016c7d02e4ffa7aed3f112 `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 a53a082983309396181c3a56ef189b80c3b01dcd `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 fbdf8b7aeaf427d7501ab939af10082f68526233 `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 d761968ba12a9ab48dec58d5f6d8d87d852342a8 `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 723b7acc9e8bb8f50ffdeb07915a0dece313b204 `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 723b7acc9e8bb8f50ffdeb07915a0dece313b204 `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 6544f087cfa18722ab5319b6e9e0b80259f000e3 `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 d20a0ec2a269b9ba17e5d7fee2cc179d22f3e062 `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 e41ed5397756295b20a2d92b4276262c9c012dd8 `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 8897754f065036093418367cca151e0c26749493 `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 ae46098aceb1ecb1437e6517d321f72f2b466d5c `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 6e44c7a20379652ef4517d9d087b4ca9a2d92fa4 `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 29158a88075fb2883bc22a9d24fd7d002ad87ed7 `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 097d48de55d74ad6ae61e768cda0c2b2426eda92 `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>
|
||||
|
|
@ -21,10 +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 4dbdaf4a19ce6c32853e5384f14bb0a9ed77360b `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 9a9949bf31ece680a8d54659d18517483a919d2d `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-in-calc reference/all-green Calc() inside calc() http://www.w3.org/TR/css3-values/#calc-notation e4e4ec2f46be9a9a54bb3c86d2b256e03644dc25 `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 19716233220fa1ac70f6299dde69dbe73ae3f08c `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 ba99058dbb02f00c6ce8a9a1a99b906fe0d65ab4 `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 f1b5230f0a67130662234cec3e045d79090a048c `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/>
|
||||
|
|
@ -41,7 +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-parenthesis-stack reference/all-green Calc() inside calc() http://www.w3.org/TR/css3-values/#calc-notation 6c42d59f2f748b71a555906b34d94dec8461b586 `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>
|
||||
|
|
@ -52,7 +52,7 @@ 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.
|
||||
initial-background-color reference/all-green Initial property and background-color http://www.w3.org/TR/css3-values/#attr-notation 6cd2e78183197a657c356dd0245a8f689796f978 `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.
|
||||
|
|
@ -62,7 +62,7 @@ mq-calc-005 reference/mq-calc-001-ref evaluation of rem in calc in Media Queries
|
|||
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.
|
||||
multicol-inherit-002 reference/multicol-inherit-002-ref 'column-count' and inherit ahem http://www.w3.org/TR/css3-multicol/#cc,http://www.w3.org/TR/css3-values/#common-keywords 2d1165aded078402115fc317a47ae6856bed77a6 `Opera Software ASA`<http://www.opera.com/> This test checks that 'column-count' can be inherited by setting it with the CSS-wide keyword 'inherit'.
|
||||
multicol-inherit-002 reference/multicol-inherit-002-ref 'column-count' and inherit ahem http://www.w3.org/TR/css3-multicol/#cc,http://www.w3.org/TR/css3-values/#common-keywords 79571c3715ea12ef5813ed474e32d785dc7b33d5 `Opera Software ASA`<http://www.opera.com/> This test checks that 'column-count' can be inherited by setting it with the CSS-wide keyword 'inherit'.
|
||||
multicol-rule-color-inherit-001 reference/multicol-rule-color-inherit-001-ref column-rule-color: inherit ahem http://www.w3.org/TR/css3-multicol/#crc,http://www.w3.org/TR/css3-values/#common-keywords ccebd3df8a5aa4b32dad211082f45f677c8a61c5 `Opera Software ASA`<http://www.opera.com/> This test checks that, by default, column-rule-color is the current color applying to the element unless reserved keyword 'inherit' is used in which case column-rule-color will be inherited from the parent's column-rule-color value.
|
||||
multicol-rule-color-inherit-002 reference/multicol-rule-color-inherit-001-ref column-rule-color: inherit (complex) ahem http://www.w3.org/TR/css3-multicol/#crc,http://www.w3.org/TR/css3-values/#common-keywords 5df59c878149324b852064274b30ee0782181442 `Gérard Talbot`<http://www.gtalbot.org/BrowserBugsSection/css21testsuite/> This test checks that, by default, column-rule-color is the current color applying to the element.
|
||||
regions-resizing-003 reference/regions-resizing-001-ref CSS Regions: resizing region that is sized using 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-values/#viewport-relative-lengths e27649199c4544ad34ad206d2ea195c184cebeb2 `Mihai Balan`<mailto:mibalan@adobe.com> Test checks that resizing the viewport of a page containing a region sized using viewport units correctly relayouts the region's contents.
|
||||
|
|
@ -71,32 +71,32 @@ regions-resizing-009 reference/regions-resizing-001-ref CSS Regions: resizing au
|
|||
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-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 8cc2d5a116e562bc4600e5cf7997391247259921 `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-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 8c49b198bd80451d133a58cd38c2b239a00559d6 `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 48410d76452c7db1675fa2e3fd3eeebe072948ba `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-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 fd47cb04c7042f6379b2664b7742a5a01ea9d1a0 `François REMY`<mailto:fremycompany.developer@yahoo.fr> The interpolated size mid-way between 0px and 200vh is 100vh (respectively for vw)
|
||||
vh-interpolate-px 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 41a610e2dd418e47f56d88171dd0c52a57e06b5e `François REMY`<mailto:fremycompany.developer@yahoo.fr> The interpolated size mid-way between 0px and 200vh is 100vh (respectively for vw)
|
||||
vh-interpolate-vh 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 42ccc23cc2f90272644bd0188261dacba081ccb2 `François REMY`<mailto:fremycompany.developer@yahoo.fr> The interpolated size mid-way between 75vh and 125vh is 100vh (respectively for vw)
|
||||
vh-support reference/all-green Viewports units are supported in sizing properties http://www.w3.org/TR/css3-values/#viewport-relative-lengths 13609543ab6880c4f4fa00168fe8c6d48abf0270 `François REMY`<mailto:fremycompany.developer@yahoo.fr> Viewports units are supported in sizing properties
|
||||
vh-support-atviewport reference/all-green Viewports units are supported in @viewport rules http://www.w3.org/TR/css3-values/#viewport-relative-lengths,https://drafts.csswg.org/css-device-adapt-1/ 7cc8bb8f1cde2aecece15e72882e45b67bfc4bdd `François REMY`<mailto:fremycompany.developer@yahoo.fr> Viewports units are supported in @viewport rules
|
||||
vh-support-margin reference/all-green Viewports units are supported in margin properties http://www.w3.org/TR/css3-values/#viewport-relative-lengths f951f1c99e3a6be4134265b4da05aabbd71eb103 `François REMY`<mailto:fremycompany.developer@yahoo.fr> Viewports units are supported in margin properties
|
||||
vh-support-transform-origin reference/all-green Viewports units are supported in transform properties http://www.w3.org/TR/css3-values/#viewport-relative-lengths,http://www.w3.org/TR/css3-2d-transforms/#css-values 8dee0773fb5519b06d225ea643bb562db431f97c `François REMY`<mailto:fremycompany.developer@yahoo.fr> Viewports units are supported in transform properties
|
||||
vh-support-transform-translate reference/all-green Viewports units are supported in transform properties http://www.w3.org/TR/css3-values/#viewport-relative-lengths,http://www.w3.org/TR/css3-2d-transforms/#css-values 8ce0374dbb32ab1c6b2a3590856748be6b92fb91 `François REMY`<mailto:fremycompany.developer@yahoo.fr> Viewports units are supported in transform properties (translate)
|
||||
vh-zero-support reference/all-green 0vh and 0vw are correctly treated as 0px http://www.w3.org/TR/css3-values/#viewport-relative-lengths 8cb13e6d29fba8a619119a85d745dd3e87156c22 `François REMY`<mailto:fremycompany.developer@yahoo.fr> 0vh and 0vw are correctly treated as 0px
|
||||
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 8cbc19fba44529b813cccb3718c89823f0ce9e6b `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 0c969d8d8f97eee173b54378f197142369f0a12c `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-notation 715eab3e5839cba3da9cd733d2a3f8ebba89d193 `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 44dab675c1250fbe6733f93b073658e50c553906 `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 b9fbd87b6cedf89db957e1668a0b7baf0a637f6b `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 143b598f9e8f5aa2a349f9ad524249d0b61f1c4f `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 ceef2964c18d7fd3cab6f5923fa60a633ec97442 `François REMY`<mailto:fremycompany.developer@yahoo.fr> The interpolated size mid-way between 0px and 200vh is 100vh (respectively for vw)
|
||||
vh-interpolate-px 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 ade4e7b3374856c99aa9515a936630f49c5c44fb `François REMY`<mailto:fremycompany.developer@yahoo.fr> The interpolated size mid-way between 0px and 200vh is 100vh (respectively for vw)
|
||||
vh-interpolate-vh 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 9a46dd5fa51b77278d6d50f7c7f862592aea3413 `François REMY`<mailto:fremycompany.developer@yahoo.fr> The interpolated size mid-way between 75vh and 125vh is 100vh (respectively for vw)
|
||||
vh-support reference/all-green Viewports units are supported in sizing properties http://www.w3.org/TR/css3-values/#viewport-relative-lengths 2be374c5e5ec334fe4c6c3417901f70c910e1384 `François REMY`<mailto:fremycompany.developer@yahoo.fr> Viewports units are supported in sizing properties
|
||||
vh-support-atviewport reference/all-green Viewports units are supported in @viewport rules http://www.w3.org/TR/css3-values/#viewport-relative-lengths,https://drafts.csswg.org/css-device-adapt-1/ 246c990528ff3491a35329ffa4b7a9274160510c `François REMY`<mailto:fremycompany.developer@yahoo.fr> Viewports units are supported in @viewport rules
|
||||
vh-support-margin reference/all-green Viewports units are supported in margin properties http://www.w3.org/TR/css3-values/#viewport-relative-lengths 823e9f5c74674f088c75bb3e0c80b858e7c4fb00 `François REMY`<mailto:fremycompany.developer@yahoo.fr> Viewports units are supported in margin properties
|
||||
vh-support-transform-origin reference/all-green Viewports units are supported in transform properties http://www.w3.org/TR/css3-values/#viewport-relative-lengths,http://www.w3.org/TR/css3-2d-transforms/#css-values 18233d6b7df8680145b4619278291e7f3452f02a `François REMY`<mailto:fremycompany.developer@yahoo.fr> Viewports units are supported in transform properties
|
||||
vh-support-transform-translate reference/all-green Viewports units are supported in transform properties http://www.w3.org/TR/css3-values/#viewport-relative-lengths,http://www.w3.org/TR/css3-2d-transforms/#css-values 6005c29efe52ea0eedb402ba93150a893c06940d `François REMY`<mailto:fremycompany.developer@yahoo.fr> Viewports units are supported in transform properties (translate)
|
||||
vh-zero-support reference/all-green 0vh and 0vw are correctly treated as 0px http://www.w3.org/TR/css3-values/#viewport-relative-lengths 406973d43e0cda26fba220dc4241b0ef88ea9cb7 `François REMY`<mailto:fremycompany.developer@yahoo.fr> 0vh and 0vw are correctly treated as 0px
|
||||
vh_not_refreshing_on_chrome reference/vh_not_refreshing_on_chrome-ref vh-based dimension doesn't change when the element's other dimension doesn't change. http://www.w3.org/TR/css3-values/#viewport-relative-lengths a27560454ad4d3e11996f4a3a9ed7d66f4b639b8 `Marc Bourlon`<mailto:marc@bourlon.com> vh-based dimension doesn't change when the element's other dimension doesn't change.
|
||||
vh_not_refreshing_on_chrome_iframe reference/vh_not_refreshing_on_chrome-ref vh-based dimension doesn't change when the element other dimension doesn't change. http://www.w3.org/TR/css3-values/#viewport-relative-lengths 8d080a2350a0e8e006e0141407e6a2c804027986 `Marc Bourlon`<mailto:marc@bourlon.com> vh-based dimension doesn't change when the element other dimension doesn't change. Bug for Chrome 19.0.1084.56 / Mac OS X 10.6.8
|
||||
viewport-relative-lengths-scaled-viewport Viewport units in scaled viewport script http://www.w3.org/TR/css3-values/#viewport-relative-lengths 34183e6c538e9e431ef5cd0cb5d6834a911f3b8f `Emil A Eklund`<mailto:eae@chromium.org> viewport relative units scale with viewport.
|
||||
viewport-units-css2-001 Checks viewport units against CSS 2.1 properties and the CSSOM script http://www.w3.org/TR/css3-values/#viewport-relative-lengths 0765a1e0ba205be0f26ff35a8683c6e91f2c43a7 `Christian Schaefer`<mailto:schaepp@gmx.de> Testing what happens when one applies and rereads viewport unit lengths to CSS 2.1 properties that accept length values
|
||||
vh_not_refreshing_on_chrome_iframe reference/vh_not_refreshing_on_chrome-ref vh-based dimension doesn't change when the element other dimension doesn't change. http://www.w3.org/TR/css3-values/#viewport-relative-lengths 1d8864a842fd30399d2ec65a030154145bda58f4 `Marc Bourlon`<mailto:marc@bourlon.com> vh-based dimension doesn't change when the element other dimension doesn't change. Bug for Chrome 19.0.1084.56 / Mac OS X 10.6.8
|
||||
viewport-relative-lengths-scaled-viewport Viewport units in scaled viewport script http://www.w3.org/TR/css3-values/#viewport-relative-lengths 4c98439900308a90b741b6c543e905609c7eb02b `Emil A Eklund`<mailto:eae@chromium.org> viewport relative units scale with viewport.
|
||||
viewport-units-css2-001 Checks viewport units against CSS 2.1 properties and the CSSOM script http://www.w3.org/TR/css3-values/#viewport-relative-lengths 027cff9474dd9074b03f2432739139341ec0c2d3 `Christian Schaefer`<mailto:schaepp@gmx.de> Testing what happens when one applies and rereads viewport unit lengths to CSS 2.1 properties that accept length values
|
||||
|
|
|
|||
|
|
@ -1,31 +1,31 @@
|
|||
<!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>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,31 +1,31 @@
|
|||
<!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>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,31 +1,31 @@
|
|||
<!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>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,31 +1,31 @@
|
|||
<!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>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,34 +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>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,34 +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>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,31 +1,31 @@
|
|||
<!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>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,31 +1,31 @@
|
|||
<!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>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,33 +1,33 @@
|
|||
<!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>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,33 +1,33 @@
|
|||
<!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>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,31 +1,31 @@
|
|||
<!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>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,31 +1,31 @@
|
|||
<!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>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,31 +1,31 @@
|
|||
<!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>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,31 +1,31 @@
|
|||
<!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>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,30 +1,30 @@
|
|||
<!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>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -2,29 +2,29 @@
|
|||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units and Media Queries Test:
|
||||
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<EFBFBD>ois REMY" />
|
||||
|
||||
<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>
|
||||
|
||||
|
|
|
|||
|
|
@ -2,29 +2,29 @@
|
|||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units and Media Queries Test:
|
||||
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<EFBFBD>ois REMY" />
|
||||
|
||||
<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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,32 +1,32 @@
|
|||
<!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>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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.
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,30 +1,30 @@
|
|||
<!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>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,30 +1,30 @@
|
|||
<!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>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units + CSS Background and Borders Test:
|
||||
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>
|
||||
|
||||
|
|
|
|||
|
|
@ -17,11 +17,11 @@
|
|||
column-gap: 1em;
|
||||
font: 1.25em/1 Ahem;
|
||||
width: 32em;
|
||||
|
||||
|
||||
/*
|
||||
N == 3;
|
||||
|
||||
32em
|
||||
32em
|
||||
- 2em : 2 column gaps
|
||||
==========
|
||||
30em : available width of the 3 inner multi-column elements
|
||||
|
|
|
|||
|
|
@ -1,24 +1,24 @@
|
|||
<!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>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
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" />
|
||||
|
||||
|
||||
<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>
|
||||
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@ var suite = root.generalParallelTest = {
|
|||
data.fixture = document.getElementById('fixture').cloneNode(true);
|
||||
data.fixture.id = 'test-' + (index++);
|
||||
(document.getElementById('offscreen') || document.body).appendChild(data.fixture);
|
||||
|
||||
|
||||
// data container for #fixture > .container > .transition
|
||||
data.transition = {
|
||||
node: data.fixture.querySelector('.transition'),
|
||||
|
|
@ -34,7 +34,7 @@ var suite = root.generalParallelTest = {
|
|||
return computedStyle(data.container.node, property);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
// data container for #fixture > .container > .transition[:before | :after]
|
||||
if (data.pseudo) {
|
||||
data.pseudo = {
|
||||
|
|
@ -92,13 +92,13 @@ var suite = root.generalParallelTest = {
|
|||
if (!options.styles) {
|
||||
options.styles = {};
|
||||
}
|
||||
|
||||
|
||||
Object.keys(styles).forEach(function(key) {
|
||||
var selector = '#' + data.fixture.id
|
||||
// fixture must become #fixture.fixture rather than a child selector
|
||||
+ (key.substring(0, 8) === '.fixture' ? '' : ' ')
|
||||
+ key;
|
||||
|
||||
|
||||
options.styles[selector] = styles[key];
|
||||
});
|
||||
},
|
||||
|
|
@ -109,7 +109,7 @@ var suite = root.generalParallelTest = {
|
|||
suite._getStyleFor(data, 'from');
|
||||
// apply target state
|
||||
suite._addClass(data, 'to', true);
|
||||
// grab current styles: "target state"
|
||||
// grab current styles: "target state"
|
||||
suite._getStyleFor(data, 'to');
|
||||
// remove target state
|
||||
suite._removeClass(data, 'to', true);
|
||||
|
|
@ -157,7 +157,7 @@ var suite = root.generalParallelTest = {
|
|||
var raf = window.requestAnimationFrame || function(callback){
|
||||
setTimeout(callback, 20);
|
||||
};
|
||||
|
||||
|
||||
// flag denoting if the runLoop should continue (true) or exit (false)
|
||||
options._collectValues = true;
|
||||
|
||||
|
|
@ -166,19 +166,19 @@ var suite = root.generalParallelTest = {
|
|||
// test's are done, stop annoying the CPU
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
// collect current style for test's elements
|
||||
options.tests.forEach(function(data) {
|
||||
if (!data.property) {
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
['transition', 'container', 'pseudo'].forEach(function(elem) {
|
||||
var pseudo = null;
|
||||
if (!data[elem] || (elem === 'pseudo' && !data.pseudo)) {
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
var current = data[elem].computedStyle(data.property);
|
||||
var values = data[elem].values;
|
||||
var length = values.length;
|
||||
|
|
@ -187,11 +187,11 @@ var suite = root.generalParallelTest = {
|
|||
}
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// rinse and repeat
|
||||
raf(runLoop);
|
||||
}
|
||||
|
||||
|
||||
runLoop();
|
||||
},
|
||||
// stop requestAnimationFrame runLoop collecting computed values
|
||||
|
|
@ -222,7 +222,7 @@ var suite = root.generalParallelTest = {
|
|||
assert_not_equals(values[1], data[elem].from, "may not be initial value while transitioning on ." + elem);
|
||||
assert_not_equals(values[1], data[elem].to, "may not be target value while transitioning on ." + elem);
|
||||
}
|
||||
|
||||
|
||||
// TODO: first value must be initial, last value must be target
|
||||
};
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
//
|
||||
//
|
||||
// Simple Helper Functions For Testing CSS
|
||||
//
|
||||
//
|
||||
|
||||
(function(root) {
|
||||
'use strict';
|
||||
|
|
@ -17,7 +17,7 @@ root.setStyle = function(selector, styles) {
|
|||
target.type = "text/css";
|
||||
document.getElementsByTagName('head')[0].appendChild(target);
|
||||
}
|
||||
|
||||
|
||||
var data = [];
|
||||
// single selector/styles
|
||||
if (typeof selector === 'string' && styles !== undefined) {
|
||||
|
|
@ -44,7 +44,7 @@ function serializeStyles(styles) {
|
|||
data.push(prefixedProperty + ":" + styles[property] + ";");
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
return data.join('\n');
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -114,7 +114,7 @@ var values = {
|
|||
data: ['url(data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=)', 'url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==)'],
|
||||
// A hunch, as from the spec:
|
||||
// http://www.w3.org/TR/css3-transitions/#animatable-types
|
||||
// gradient: interpolated via the positions and colors of each stop. They must have the same type (radial or linear) and same number of stops in order to be animated. Note: [CSS3-IMAGES] may extend this definition.
|
||||
// gradient: interpolated via the positions and colors of each stop. They must have the same type (radial or linear) and same number of stops in order to be animated. Note: [CSS3-IMAGES] may extend this definition.
|
||||
gradient: [prefix + 'linear-gradient(top, hsl(0, 80%, 70%), #bada55)', prefix + 'linear-gradient(top, #bada55, hsl(0, 80%, 70%))']
|
||||
};
|
||||
},
|
||||
|
|
@ -171,39 +171,39 @@ var values = {
|
|||
var properties = {
|
||||
'background-color': ['color'],
|
||||
'background-position': ['length', 'percentage'],
|
||||
|
||||
|
||||
'border-top-width': ['length'],
|
||||
'border-right-width': ['length'],
|
||||
'border-bottom-width': ['length'],
|
||||
'border-left-width': ['length'],
|
||||
|
||||
|
||||
'border-top-color': ['color'],
|
||||
'border-right-color': ['color'],
|
||||
'border-bottom-color': ['color'],
|
||||
'border-left-color': ['color'],
|
||||
|
||||
|
||||
'padding-bottom': ['length'],
|
||||
'padding-left': ['length'],
|
||||
'padding-right': ['length'],
|
||||
'padding-top': ['length'],
|
||||
|
||||
|
||||
'margin-bottom': ['length'],
|
||||
'margin-left': ['length'],
|
||||
'margin-right': ['length'],
|
||||
'margin-top': ['length'],
|
||||
|
||||
|
||||
'height': ['length', 'percentage'],
|
||||
'width': ['length', 'percentage'],
|
||||
'min-height': ['length', 'percentage'],
|
||||
'min-width': ['length', 'percentage'],
|
||||
'max-height': ['length', 'percentage'],
|
||||
'max-width': ['length', 'percentage'],
|
||||
|
||||
|
||||
'top': ['length', 'percentage'],
|
||||
'right': ['length', 'percentage'],
|
||||
'bottom': ['length', 'percentage'],
|
||||
'left': ['length', 'percentage'],
|
||||
|
||||
|
||||
'color': ['color'],
|
||||
'font-size': ['length', 'percentage'],
|
||||
'font-weight': ['font-weight'],
|
||||
|
|
@ -214,16 +214,16 @@ var properties = {
|
|||
'word-spacing': ['length', 'percentage'],
|
||||
'text-indent': ['length', 'percentage'],
|
||||
'text-shadow': ['shadow'],
|
||||
|
||||
|
||||
'outline-color': ['color'],
|
||||
// outline-offset <integer> used to be an error in the spec
|
||||
'outline-offset': ['length'],
|
||||
'outline-width': ['length'],
|
||||
|
||||
|
||||
'clip': ['rectangle'],
|
||||
// Note: doesn't seem implemented anywhere
|
||||
'crop': ['rectangle'],
|
||||
|
||||
|
||||
'vertical-align': ['length', 'percentage'],
|
||||
'opacity': ['number[0,1]'],
|
||||
'visibility': ['visibility'],
|
||||
|
|
@ -279,7 +279,7 @@ var unspecified_properties = {
|
|||
'background-image': ['image'],
|
||||
'background-size': ['background-size'],
|
||||
// https://drafts.csswg.org/css3-background/#the-box-shadow
|
||||
// Animatable: yes, except between inner and outer shadows (Transition to/from an absent shadow is a transition to/from ‘0 0 transparent’ or ‘0 0 transparent inset’, as appropriate.)
|
||||
// Animatable: yes, except between inner and outer shadows (Transition to/from an absent shadow is a transition to/from ‘0 0 transparent’ or ‘0 0 transparent inset’, as appropriate.)
|
||||
'box-shadow': ['box-shadow'],
|
||||
'font-size-adjust': ['number'],
|
||||
'font-stretch': ['font-stretch'],
|
||||
|
|
@ -342,7 +342,7 @@ var parent_styles = {
|
|||
// unspecified properties
|
||||
'position': {'position': 'relative', 'width': '100px', 'height': '100px'},
|
||||
// inheritance tests
|
||||
'top': {'width': '100px', 'height': '100px', 'position': 'relative'},
|
||||
'top': {'width': '100px', 'height': '100px', 'position': 'relative'},
|
||||
'right': {'width': '100px', 'height': '100px', 'position': 'relative'},
|
||||
'bottom': {'width': '100px', 'height': '100px', 'position': 'relative'},
|
||||
'left': {'width': '100px', 'height': '100px', 'position': 'relative'}
|
||||
|
|
@ -375,7 +375,7 @@ function assemble(props) {
|
|||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
return tests;
|
||||
}
|
||||
|
||||
|
|
@ -393,23 +393,23 @@ root.getUnspecifiedPropertyTests = function() {
|
|||
|
||||
root.getFontSizeRelativePropertyTests = function() {
|
||||
var accepted = {};
|
||||
|
||||
|
||||
for (var key in properties) {
|
||||
if (!Object.prototype.hasOwnProperty.call(properties, key) || key === "font-size") {
|
||||
continue;
|
||||
}
|
||||
|
||||
|
||||
if (properties[key].indexOf('length') > -1) {
|
||||
accepted[key] = ['length-em'];
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
return assemble(accepted);
|
||||
};
|
||||
|
||||
root.getAutoPropertyTests = function() {
|
||||
var accepted = {};
|
||||
|
||||
|
||||
for (var i = 0, key; key = properties_auto[i]; i++) {
|
||||
accepted[key] = ['auto'];
|
||||
}
|
||||
|
|
@ -420,17 +420,17 @@ root.getAutoPropertyTests = function() {
|
|||
root.filterPropertyTests = function(tests, names) {
|
||||
var allowed = {};
|
||||
var accepted = [];
|
||||
|
||||
|
||||
if (typeof names === "string") {
|
||||
names = [names];
|
||||
}
|
||||
|
||||
|
||||
if (!(names instanceof RegExp)) {
|
||||
names.forEach(function(name) {
|
||||
allowed[name] = true;
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
tests.forEach(function(test) {
|
||||
if (names instanceof RegExp) {
|
||||
if (!test.name.match(names)) {
|
||||
|
|
@ -439,11 +439,11 @@ root.filterPropertyTests = function(tests, names) {
|
|||
} else if (!allowed[test.name]) {
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
accepted.push(test);
|
||||
});
|
||||
|
||||
|
||||
return accepted;
|
||||
};
|
||||
|
||||
})(window);
|
||||
})(window);
|
||||
|
|
|
|||
|
|
@ -13,13 +13,13 @@
|
|||
{name: "name of test 2", custom: "data"},
|
||||
// ...
|
||||
],
|
||||
|
||||
|
||||
// number of tests (tests, not test-cases!) to run concurrently
|
||||
testsPerSlice: 100,
|
||||
|
||||
// time in milliseconds a test-run takes
|
||||
duration: 1000,
|
||||
|
||||
|
||||
// test-cases to run for for the test - there must be at least one
|
||||
// each case creates its separate async_test() instance
|
||||
cases: {
|
||||
|
|
@ -33,17 +33,17 @@
|
|||
},
|
||||
// ...
|
||||
}
|
||||
|
||||
|
||||
// all callbacks are optional:
|
||||
|
||||
|
||||
// invoked for individual test before it starts so you can setup the environment
|
||||
// like DOM, CSS, adding event listeners and such
|
||||
setup: function(data, options){},
|
||||
|
||||
|
||||
// invoked after a test ended, so you can clean up the environment
|
||||
// like DOM, CSS, removing event listeners and such
|
||||
teardown: function(data, options){},
|
||||
|
||||
|
||||
// invoked before a batch of tests ("slice") are run concurrently
|
||||
// tests is an array of test data objects
|
||||
sliceStart: function(options, tests)
|
||||
|
|
@ -60,22 +60,22 @@ root.runParallelAsyncHarness = function(options) {
|
|||
if (!options.cases) {
|
||||
throw new Error("Options don't contain test cases!");
|
||||
}
|
||||
|
||||
|
||||
var noop = function(){};
|
||||
|
||||
|
||||
// add a 100ms buffer to the test timeout, just in case
|
||||
var duration = Math.ceil(options.duration + 100);
|
||||
|
||||
|
||||
// names of individual tests
|
||||
var cases = Object.keys(options.cases);
|
||||
|
||||
|
||||
// run tests in a batch of slices
|
||||
// primarily not to overload weak devices (tablets, phones, …)
|
||||
// primarily not to overload weak devices (tablets, phones, …)
|
||||
// with too many tests running simultaneously
|
||||
var iteration = -1;
|
||||
var testPerSlice = options.testsPerSlice || 100;
|
||||
var slices = Math.ceil(options.tests.length / testPerSlice);
|
||||
|
||||
|
||||
// initialize all async test cases
|
||||
// Note: satisfying testharness.js needs to know all async tests before load-event
|
||||
options.tests.forEach(function(data, index) {
|
||||
|
|
@ -84,7 +84,7 @@ root.runParallelAsyncHarness = function(options) {
|
|||
data.cases[name] = async_test(data.name + " / " + name, {timeout: options.timeout || 60000});
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
function runLoop() {
|
||||
iteration++;
|
||||
if (iteration >= slices) {
|
||||
|
|
@ -92,7 +92,7 @@ root.runParallelAsyncHarness = function(options) {
|
|||
(options.done || noop)(options);
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
// grab a slice of testss and initialize them
|
||||
var offset = iteration * testPerSlice;
|
||||
var tests = options.tests.slice(offset, offset + testPerSlice);
|
||||
|
|
@ -100,10 +100,10 @@ root.runParallelAsyncHarness = function(options) {
|
|||
(options.setup || noop)(data, options);
|
||||
|
||||
});
|
||||
|
||||
|
||||
// kick off the current slice of tests
|
||||
(options.sliceStart || noop)(options, tests);
|
||||
|
||||
|
||||
// perform individual "start" test-case
|
||||
tests.forEach(function(data) {
|
||||
cases.forEach(function(name) {
|
||||
|
|
@ -112,7 +112,7 @@ root.runParallelAsyncHarness = function(options) {
|
|||
});
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// conclude test (possibly abort)
|
||||
setTimeout(function() {
|
||||
tests.forEach(function(data) {
|
||||
|
|
@ -129,17 +129,17 @@ root.runParallelAsyncHarness = function(options) {
|
|||
data.cases[name].done();
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// finish the test for current slice of tests
|
||||
(options.sliceDone || noop)(options, tests);
|
||||
|
||||
|
||||
// next test please, give the browser 50ms to do catch its breath
|
||||
setTimeout(runLoop, 50);
|
||||
}, duration);
|
||||
}
|
||||
|
||||
|
||||
// allow DOMContentLoaded before actually doing something
|
||||
setTimeout(runLoop, 100);
|
||||
};
|
||||
|
||||
})(window);
|
||||
})(window);
|
||||
|
|
|
|||
|
|
@ -5,14 +5,14 @@ function resizeViewportTo(viewportSelector, width, height) {
|
|||
|
||||
iframe.width = width;
|
||||
iframe.height = height;
|
||||
|
||||
|
||||
iframe.contentWindow.document.body.offsetTop;
|
||||
}
|
||||
|
||||
function injectStylesInIFrame(styleSelector, frameSelector) {
|
||||
var style = document.querySelector(styleSelector),
|
||||
frame = document.querySelector(frameSelector);
|
||||
|
||||
|
||||
frame.contentWindow.addNewStyles(style.textContent);
|
||||
}
|
||||
|
||||
|
|
@ -26,4 +26,4 @@ if (window.parent != window) {
|
|||
styleTag.appendChild(textNode);
|
||||
document.head.appendChild(styleTag);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
//
|
||||
//
|
||||
// Vendor-Prefix Helper Functions For Testing CSS
|
||||
//
|
||||
//
|
||||
|
||||
(function(root) {
|
||||
'use strict';
|
||||
|
|
@ -21,7 +21,7 @@ root.addVendorPrefix = function (name) {
|
|||
// property unknown to browser
|
||||
return name;
|
||||
}
|
||||
|
||||
|
||||
return prefix + name;
|
||||
};
|
||||
|
||||
|
|
@ -32,7 +32,7 @@ root.addValueVendorPrefix = function (property, value) {
|
|||
// property unknown to browser
|
||||
return name;
|
||||
}
|
||||
|
||||
|
||||
return prefix + value;
|
||||
};
|
||||
|
||||
|
|
@ -41,7 +41,7 @@ root.getVendorPrefix = function(name) {
|
|||
if (prefixCache[name] !== undefined) {
|
||||
return prefixCache[name];
|
||||
}
|
||||
|
||||
|
||||
var elem = document.createElement("div");
|
||||
name = camelCase(name);
|
||||
|
||||
|
|
@ -78,9 +78,9 @@ root.getValueVendorPrefix = function(property, value) {
|
|||
return styles[i];
|
||||
}
|
||||
}
|
||||
document.body.removeChild(elem);
|
||||
document.body.removeChild(elem);
|
||||
return false;
|
||||
};
|
||||
|
||||
|
||||
})(window);
|
||||
})(window);
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@
|
|||
<script type="text/javascript">
|
||||
var circle_position_calc_tests = [];
|
||||
ParsingUtils.calcTestValues.forEach(function(value) {
|
||||
testCase = ['circle(at '+ value[0] +')',
|
||||
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%)',
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@
|
|||
var ellipse_calc_tests = [];
|
||||
var defaultPosition = ' at 50% 50%';
|
||||
ParsingUtils.calcTestValues.forEach(function(value) {
|
||||
testCase = ['ellipse('+ value[0] +')',
|
||||
testCase = ['ellipse('+ value[0] +')',
|
||||
'ellipse('+ value[1] + defaultPosition +')'];
|
||||
if(Object.prototype.toString.call( value[2] ) === '[object Array]' && value[2].length == 2) {
|
||||
testCase.push([
|
||||
|
|
@ -32,7 +32,7 @@
|
|||
ellipse_calc_tests.push(testCase);
|
||||
});
|
||||
ParsingUtils.calcTestValues.forEach(function(value) {
|
||||
testCase = ['ellipse(farthest-side '+ value[0] +')',
|
||||
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([
|
||||
|
|
@ -45,7 +45,7 @@
|
|||
ellipse_calc_tests.push(testCase);
|
||||
});
|
||||
ParsingUtils.calcTestValues.forEach(function(value) {
|
||||
testCase = ['ellipse('+ value[0] +' '+ value[0] +')',
|
||||
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([
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@
|
|||
<script type="text/javascript">
|
||||
var ellipse_position_calc_tests = [];
|
||||
ParsingUtils.calcTestValues.forEach(function(value) {
|
||||
testCase = ['ellipse(at '+ value[0] +' 50%)',
|
||||
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([
|
||||
|
|
@ -44,7 +44,7 @@
|
|||
ellipse_position_calc_tests.push(testCase);
|
||||
});
|
||||
ParsingUtils.calcTestValues.forEach(function(value) {
|
||||
testCase = ['ellipse(closest-side farthest-side at '+ value[0] +' '+ value[0] +')',
|
||||
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([
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@ var suite = root.generalParallelTest = {
|
|||
data.fixture = document.getElementById('fixture').cloneNode(true);
|
||||
data.fixture.id = 'test-' + (index++);
|
||||
(document.getElementById('offscreen') || document.body).appendChild(data.fixture);
|
||||
|
||||
|
||||
// data container for #fixture > .container > .transition
|
||||
data.transition = {
|
||||
node: data.fixture.querySelector('.transition'),
|
||||
|
|
@ -34,7 +34,7 @@ var suite = root.generalParallelTest = {
|
|||
return computedStyle(data.container.node, property);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
// data container for #fixture > .container > .transition[:before | :after]
|
||||
if (data.pseudo) {
|
||||
data.pseudo = {
|
||||
|
|
@ -92,13 +92,13 @@ var suite = root.generalParallelTest = {
|
|||
if (!options.styles) {
|
||||
options.styles = {};
|
||||
}
|
||||
|
||||
|
||||
Object.keys(styles).forEach(function(key) {
|
||||
var selector = '#' + data.fixture.id
|
||||
// fixture must become #fixture.fixture rather than a child selector
|
||||
+ (key.substring(0, 8) === '.fixture' ? '' : ' ')
|
||||
+ key;
|
||||
|
||||
|
||||
options.styles[selector] = styles[key];
|
||||
});
|
||||
},
|
||||
|
|
@ -109,7 +109,7 @@ var suite = root.generalParallelTest = {
|
|||
suite._getStyleFor(data, 'from');
|
||||
// apply target state
|
||||
suite._addClass(data, 'to', true);
|
||||
// grab current styles: "target state"
|
||||
// grab current styles: "target state"
|
||||
suite._getStyleFor(data, 'to');
|
||||
// remove target state
|
||||
suite._removeClass(data, 'to', true);
|
||||
|
|
@ -157,7 +157,7 @@ var suite = root.generalParallelTest = {
|
|||
var raf = window.requestAnimationFrame || function(callback){
|
||||
setTimeout(callback, 20);
|
||||
};
|
||||
|
||||
|
||||
// flag denoting if the runLoop should continue (true) or exit (false)
|
||||
options._collectValues = true;
|
||||
|
||||
|
|
@ -166,19 +166,19 @@ var suite = root.generalParallelTest = {
|
|||
// test's are done, stop annoying the CPU
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
// collect current style for test's elements
|
||||
options.tests.forEach(function(data) {
|
||||
if (!data.property) {
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
['transition', 'container', 'pseudo'].forEach(function(elem) {
|
||||
var pseudo = null;
|
||||
if (!data[elem] || (elem === 'pseudo' && !data.pseudo)) {
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
var current = data[elem].computedStyle(data.property);
|
||||
var values = data[elem].values;
|
||||
var length = values.length;
|
||||
|
|
@ -187,11 +187,11 @@ var suite = root.generalParallelTest = {
|
|||
}
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// rinse and repeat
|
||||
raf(runLoop);
|
||||
}
|
||||
|
||||
|
||||
runLoop();
|
||||
},
|
||||
// stop requestAnimationFrame runLoop collecting computed values
|
||||
|
|
@ -222,7 +222,7 @@ var suite = root.generalParallelTest = {
|
|||
assert_not_equals(values[1], data[elem].from, "may not be initial value while transitioning on ." + elem);
|
||||
assert_not_equals(values[1], data[elem].to, "may not be target value while transitioning on ." + elem);
|
||||
}
|
||||
|
||||
|
||||
// TODO: first value must be initial, last value must be target
|
||||
};
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
//
|
||||
//
|
||||
// Simple Helper Functions For Testing CSS
|
||||
//
|
||||
//
|
||||
|
||||
(function(root) {
|
||||
'use strict';
|
||||
|
|
@ -17,7 +17,7 @@ root.setStyle = function(selector, styles) {
|
|||
target.type = "text/css";
|
||||
document.getElementsByTagName('head')[0].appendChild(target);
|
||||
}
|
||||
|
||||
|
||||
var data = [];
|
||||
// single selector/styles
|
||||
if (typeof selector === 'string' && styles !== undefined) {
|
||||
|
|
@ -44,7 +44,7 @@ function serializeStyles(styles) {
|
|||
data.push(prefixedProperty + ":" + styles[property] + ";");
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
return data.join('\n');
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -114,7 +114,7 @@ var values = {
|
|||
data: ['url(data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=)', 'url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==)'],
|
||||
// A hunch, as from the spec:
|
||||
// http://www.w3.org/TR/css3-transitions/#animatable-types
|
||||
// gradient: interpolated via the positions and colors of each stop. They must have the same type (radial or linear) and same number of stops in order to be animated. Note: [CSS3-IMAGES] may extend this definition.
|
||||
// gradient: interpolated via the positions and colors of each stop. They must have the same type (radial or linear) and same number of stops in order to be animated. Note: [CSS3-IMAGES] may extend this definition.
|
||||
gradient: [prefix + 'linear-gradient(top, hsl(0, 80%, 70%), #bada55)', prefix + 'linear-gradient(top, #bada55, hsl(0, 80%, 70%))']
|
||||
};
|
||||
},
|
||||
|
|
@ -171,39 +171,39 @@ var values = {
|
|||
var properties = {
|
||||
'background-color': ['color'],
|
||||
'background-position': ['length', 'percentage'],
|
||||
|
||||
|
||||
'border-top-width': ['length'],
|
||||
'border-right-width': ['length'],
|
||||
'border-bottom-width': ['length'],
|
||||
'border-left-width': ['length'],
|
||||
|
||||
|
||||
'border-top-color': ['color'],
|
||||
'border-right-color': ['color'],
|
||||
'border-bottom-color': ['color'],
|
||||
'border-left-color': ['color'],
|
||||
|
||||
|
||||
'padding-bottom': ['length'],
|
||||
'padding-left': ['length'],
|
||||
'padding-right': ['length'],
|
||||
'padding-top': ['length'],
|
||||
|
||||
|
||||
'margin-bottom': ['length'],
|
||||
'margin-left': ['length'],
|
||||
'margin-right': ['length'],
|
||||
'margin-top': ['length'],
|
||||
|
||||
|
||||
'height': ['length', 'percentage'],
|
||||
'width': ['length', 'percentage'],
|
||||
'min-height': ['length', 'percentage'],
|
||||
'min-width': ['length', 'percentage'],
|
||||
'max-height': ['length', 'percentage'],
|
||||
'max-width': ['length', 'percentage'],
|
||||
|
||||
|
||||
'top': ['length', 'percentage'],
|
||||
'right': ['length', 'percentage'],
|
||||
'bottom': ['length', 'percentage'],
|
||||
'left': ['length', 'percentage'],
|
||||
|
||||
|
||||
'color': ['color'],
|
||||
'font-size': ['length', 'percentage'],
|
||||
'font-weight': ['font-weight'],
|
||||
|
|
@ -214,16 +214,16 @@ var properties = {
|
|||
'word-spacing': ['length', 'percentage'],
|
||||
'text-indent': ['length', 'percentage'],
|
||||
'text-shadow': ['shadow'],
|
||||
|
||||
|
||||
'outline-color': ['color'],
|
||||
// outline-offset <integer> used to be an error in the spec
|
||||
'outline-offset': ['length'],
|
||||
'outline-width': ['length'],
|
||||
|
||||
|
||||
'clip': ['rectangle'],
|
||||
// Note: doesn't seem implemented anywhere
|
||||
'crop': ['rectangle'],
|
||||
|
||||
|
||||
'vertical-align': ['length', 'percentage'],
|
||||
'opacity': ['number[0,1]'],
|
||||
'visibility': ['visibility'],
|
||||
|
|
@ -279,7 +279,7 @@ var unspecified_properties = {
|
|||
'background-image': ['image'],
|
||||
'background-size': ['background-size'],
|
||||
// https://drafts.csswg.org/css3-background/#the-box-shadow
|
||||
// Animatable: yes, except between inner and outer shadows (Transition to/from an absent shadow is a transition to/from ‘0 0 transparent’ or ‘0 0 transparent inset’, as appropriate.)
|
||||
// Animatable: yes, except between inner and outer shadows (Transition to/from an absent shadow is a transition to/from ‘0 0 transparent’ or ‘0 0 transparent inset’, as appropriate.)
|
||||
'box-shadow': ['box-shadow'],
|
||||
'font-size-adjust': ['number'],
|
||||
'font-stretch': ['font-stretch'],
|
||||
|
|
@ -342,7 +342,7 @@ var parent_styles = {
|
|||
// unspecified properties
|
||||
'position': {'position': 'relative', 'width': '100px', 'height': '100px'},
|
||||
// inheritance tests
|
||||
'top': {'width': '100px', 'height': '100px', 'position': 'relative'},
|
||||
'top': {'width': '100px', 'height': '100px', 'position': 'relative'},
|
||||
'right': {'width': '100px', 'height': '100px', 'position': 'relative'},
|
||||
'bottom': {'width': '100px', 'height': '100px', 'position': 'relative'},
|
||||
'left': {'width': '100px', 'height': '100px', 'position': 'relative'}
|
||||
|
|
@ -375,7 +375,7 @@ function assemble(props) {
|
|||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
return tests;
|
||||
}
|
||||
|
||||
|
|
@ -393,23 +393,23 @@ root.getUnspecifiedPropertyTests = function() {
|
|||
|
||||
root.getFontSizeRelativePropertyTests = function() {
|
||||
var accepted = {};
|
||||
|
||||
|
||||
for (var key in properties) {
|
||||
if (!Object.prototype.hasOwnProperty.call(properties, key) || key === "font-size") {
|
||||
continue;
|
||||
}
|
||||
|
||||
|
||||
if (properties[key].indexOf('length') > -1) {
|
||||
accepted[key] = ['length-em'];
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
return assemble(accepted);
|
||||
};
|
||||
|
||||
root.getAutoPropertyTests = function() {
|
||||
var accepted = {};
|
||||
|
||||
|
||||
for (var i = 0, key; key = properties_auto[i]; i++) {
|
||||
accepted[key] = ['auto'];
|
||||
}
|
||||
|
|
@ -420,17 +420,17 @@ root.getAutoPropertyTests = function() {
|
|||
root.filterPropertyTests = function(tests, names) {
|
||||
var allowed = {};
|
||||
var accepted = [];
|
||||
|
||||
|
||||
if (typeof names === "string") {
|
||||
names = [names];
|
||||
}
|
||||
|
||||
|
||||
if (!(names instanceof RegExp)) {
|
||||
names.forEach(function(name) {
|
||||
allowed[name] = true;
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
tests.forEach(function(test) {
|
||||
if (names instanceof RegExp) {
|
||||
if (!test.name.match(names)) {
|
||||
|
|
@ -439,11 +439,11 @@ root.filterPropertyTests = function(tests, names) {
|
|||
} else if (!allowed[test.name]) {
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
accepted.push(test);
|
||||
});
|
||||
|
||||
|
||||
return accepted;
|
||||
};
|
||||
|
||||
})(window);
|
||||
})(window);
|
||||
|
|
|
|||
|
|
@ -13,13 +13,13 @@
|
|||
{name: "name of test 2", custom: "data"},
|
||||
// ...
|
||||
],
|
||||
|
||||
|
||||
// number of tests (tests, not test-cases!) to run concurrently
|
||||
testsPerSlice: 100,
|
||||
|
||||
// time in milliseconds a test-run takes
|
||||
duration: 1000,
|
||||
|
||||
|
||||
// test-cases to run for for the test - there must be at least one
|
||||
// each case creates its separate async_test() instance
|
||||
cases: {
|
||||
|
|
@ -33,17 +33,17 @@
|
|||
},
|
||||
// ...
|
||||
}
|
||||
|
||||
|
||||
// all callbacks are optional:
|
||||
|
||||
|
||||
// invoked for individual test before it starts so you can setup the environment
|
||||
// like DOM, CSS, adding event listeners and such
|
||||
setup: function(data, options){},
|
||||
|
||||
|
||||
// invoked after a test ended, so you can clean up the environment
|
||||
// like DOM, CSS, removing event listeners and such
|
||||
teardown: function(data, options){},
|
||||
|
||||
|
||||
// invoked before a batch of tests ("slice") are run concurrently
|
||||
// tests is an array of test data objects
|
||||
sliceStart: function(options, tests)
|
||||
|
|
@ -60,22 +60,22 @@ root.runParallelAsyncHarness = function(options) {
|
|||
if (!options.cases) {
|
||||
throw new Error("Options don't contain test cases!");
|
||||
}
|
||||
|
||||
|
||||
var noop = function(){};
|
||||
|
||||
|
||||
// add a 100ms buffer to the test timeout, just in case
|
||||
var duration = Math.ceil(options.duration + 100);
|
||||
|
||||
|
||||
// names of individual tests
|
||||
var cases = Object.keys(options.cases);
|
||||
|
||||
|
||||
// run tests in a batch of slices
|
||||
// primarily not to overload weak devices (tablets, phones, …)
|
||||
// primarily not to overload weak devices (tablets, phones, …)
|
||||
// with too many tests running simultaneously
|
||||
var iteration = -1;
|
||||
var testPerSlice = options.testsPerSlice || 100;
|
||||
var slices = Math.ceil(options.tests.length / testPerSlice);
|
||||
|
||||
|
||||
// initialize all async test cases
|
||||
// Note: satisfying testharness.js needs to know all async tests before load-event
|
||||
options.tests.forEach(function(data, index) {
|
||||
|
|
@ -84,7 +84,7 @@ root.runParallelAsyncHarness = function(options) {
|
|||
data.cases[name] = async_test(data.name + " / " + name, {timeout: options.timeout || 60000});
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
function runLoop() {
|
||||
iteration++;
|
||||
if (iteration >= slices) {
|
||||
|
|
@ -92,7 +92,7 @@ root.runParallelAsyncHarness = function(options) {
|
|||
(options.done || noop)(options);
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
// grab a slice of testss and initialize them
|
||||
var offset = iteration * testPerSlice;
|
||||
var tests = options.tests.slice(offset, offset + testPerSlice);
|
||||
|
|
@ -100,10 +100,10 @@ root.runParallelAsyncHarness = function(options) {
|
|||
(options.setup || noop)(data, options);
|
||||
|
||||
});
|
||||
|
||||
|
||||
// kick off the current slice of tests
|
||||
(options.sliceStart || noop)(options, tests);
|
||||
|
||||
|
||||
// perform individual "start" test-case
|
||||
tests.forEach(function(data) {
|
||||
cases.forEach(function(name) {
|
||||
|
|
@ -112,7 +112,7 @@ root.runParallelAsyncHarness = function(options) {
|
|||
});
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// conclude test (possibly abort)
|
||||
setTimeout(function() {
|
||||
tests.forEach(function(data) {
|
||||
|
|
@ -129,17 +129,17 @@ root.runParallelAsyncHarness = function(options) {
|
|||
data.cases[name].done();
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// finish the test for current slice of tests
|
||||
(options.sliceDone || noop)(options, tests);
|
||||
|
||||
|
||||
// next test please, give the browser 50ms to do catch its breath
|
||||
setTimeout(runLoop, 50);
|
||||
}, duration);
|
||||
}
|
||||
|
||||
|
||||
// allow DOMContentLoaded before actually doing something
|
||||
setTimeout(runLoop, 100);
|
||||
};
|
||||
|
||||
})(window);
|
||||
})(window);
|
||||
|
|
|
|||
|
|
@ -5,14 +5,14 @@ function resizeViewportTo(viewportSelector, width, height) {
|
|||
|
||||
iframe.width = width;
|
||||
iframe.height = height;
|
||||
|
||||
|
||||
iframe.contentWindow.document.body.offsetTop;
|
||||
}
|
||||
|
||||
function injectStylesInIFrame(styleSelector, frameSelector) {
|
||||
var style = document.querySelector(styleSelector),
|
||||
frame = document.querySelector(frameSelector);
|
||||
|
||||
|
||||
frame.contentWindow.addNewStyles(style.textContent);
|
||||
}
|
||||
|
||||
|
|
@ -26,4 +26,4 @@ if (window.parent != window) {
|
|||
styleTag.appendChild(textNode);
|
||||
document.head.appendChild(styleTag);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
//
|
||||
//
|
||||
// Vendor-Prefix Helper Functions For Testing CSS
|
||||
//
|
||||
//
|
||||
|
||||
(function(root) {
|
||||
'use strict';
|
||||
|
|
@ -21,7 +21,7 @@ root.addVendorPrefix = function (name) {
|
|||
// property unknown to browser
|
||||
return name;
|
||||
}
|
||||
|
||||
|
||||
return prefix + name;
|
||||
};
|
||||
|
||||
|
|
@ -32,7 +32,7 @@ root.addValueVendorPrefix = function (property, value) {
|
|||
// property unknown to browser
|
||||
return name;
|
||||
}
|
||||
|
||||
|
||||
return prefix + value;
|
||||
};
|
||||
|
||||
|
|
@ -41,7 +41,7 @@ root.getVendorPrefix = function(name) {
|
|||
if (prefixCache[name] !== undefined) {
|
||||
return prefixCache[name];
|
||||
}
|
||||
|
||||
|
||||
var elem = document.createElement("div");
|
||||
name = camelCase(name);
|
||||
|
||||
|
|
@ -78,9 +78,9 @@ root.getValueVendorPrefix = function(property, value) {
|
|||
return styles[i];
|
||||
}
|
||||
}
|
||||
document.body.removeChild(elem);
|
||||
document.body.removeChild(elem);
|
||||
return false;
|
||||
};
|
||||
|
||||
|
||||
})(window);
|
||||
})(window);
|
||||
|
|
|
|||
|
|
@ -7,13 +7,13 @@
|
|||
<link href="http://www.w3.org/TR/css3-values/#time" rel="help" title="CSS Values and Units Module Level 3 - 6.2. Times: the ‘<time>’ type and ‘s’, ‘ms’ units" />
|
||||
<link href="http://rodneyrehm.de/en/" rel="author" title="Rodney Rehm" />
|
||||
<meta content="dom" name="flags" />
|
||||
|
||||
|
||||
<script src="/resources/testharness.js" type="text/javascript"></script>
|
||||
<script src="/resources/testharnessreport.js" type="text/javascript"></script>
|
||||
|
||||
|
||||
<script src="./support/vendorPrefix.js" type="text/javascript"></script>
|
||||
<script src="./support/helper.js" type="text/javascript"></script>
|
||||
|
||||
|
||||
<script id="metadata_cache">/*
|
||||
{
|
||||
"parse '10.2s'": {},
|
||||
|
|
@ -50,7 +50,7 @@
|
|||
|
||||
<script>
|
||||
var transition = document.getElementById('transition');
|
||||
// <time> [, <time>]*
|
||||
// <time> [, <time>]*
|
||||
var values = {
|
||||
// seconds
|
||||
'10.2s': '10.2s',
|
||||
|
|
@ -79,13 +79,13 @@
|
|||
// invalid
|
||||
'foobar': '0s'
|
||||
};
|
||||
|
||||
|
||||
// these tests are supposed to fail and
|
||||
// possibly make the engine issue a parser warning
|
||||
var invalidTests = {
|
||||
'foobar': true
|
||||
};
|
||||
|
||||
|
||||
for (var key in values) {
|
||||
if (Object.prototype.hasOwnProperty.call(values, key)) {
|
||||
test(function() {
|
||||
|
|
@ -103,4 +103,5 @@
|
|||
}
|
||||
</script>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -7,13 +7,13 @@
|
|||
<link href="http://www.w3.org/TR/css3-values/#time" rel="help" title="CSS Values and Units Module Level 3 - 6.2. Times: the ‘<time>’ type and ‘s’, ‘ms’ units" />
|
||||
<link href="http://rodneyrehm.de/en/" rel="author" title="Rodney Rehm" />
|
||||
<meta content="dom" name="flags" />
|
||||
|
||||
|
||||
<script src="/resources/testharness.js" type="text/javascript"></script>
|
||||
<script src="/resources/testharnessreport.js" type="text/javascript"></script>
|
||||
|
||||
|
||||
<script src="./support/vendorPrefix.js" type="text/javascript"></script>
|
||||
<script src="./support/helper.js" type="text/javascript"></script>
|
||||
|
||||
|
||||
<script id="metadata_cache">/*
|
||||
{
|
||||
"parse '10.2s'": {},
|
||||
|
|
@ -50,7 +50,7 @@
|
|||
|
||||
<script>
|
||||
var transition = document.getElementById('transition');
|
||||
// <time> [, <time>]*
|
||||
// <time> [, <time>]*
|
||||
var values = {
|
||||
// seconds
|
||||
'10.2s': '10.2s',
|
||||
|
|
@ -78,7 +78,7 @@
|
|||
// invalid
|
||||
'foobar': '0s'
|
||||
};
|
||||
|
||||
|
||||
// these tests are supposed to fail and
|
||||
// possibly make the engine issue a parser warning
|
||||
var invalidTests = {
|
||||
|
|
@ -86,7 +86,7 @@
|
|||
'-500ms': true,
|
||||
'foobar': true
|
||||
};
|
||||
|
||||
|
||||
for (var key in values) {
|
||||
if (Object.prototype.hasOwnProperty.call(values, key)) {
|
||||
test(function() {
|
||||
|
|
@ -104,4 +104,5 @@
|
|||
}
|
||||
</script>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -1,8 +1,8 @@
|
|||
<!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>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
CSS Values and Units Test:
|
||||
Viewport units are supported inside calc expressions.
|
||||
</title>
|
||||
<meta content="
|
||||
|
|
@ -10,25 +10,25 @@
|
|||
" name="assert" />
|
||||
|
||||
|
||||
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
|
||||
<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-notation" rel="help" />
|
||||
|
||||
<link href="reference/all-green.xht" rel="match" />
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
|
||||
|
||||
html, body { margin: 0px; padding: 0px; }
|
||||
|
||||
|
||||
html { background: red; }
|
||||
#target { position: absolute; background: green; width: calc(100vw + 50%); height: calc(100vh + 50%); top: -50%; left: -50%; }
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
<div id="target"></div>
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
<!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>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<title>
|
||||
CSS Values and Units Test:
|
||||
CSS Values and Units Test:
|
||||
Viewport units are supported inside calc expressions.
|
||||
</title>
|
||||
<meta content="
|
||||
|
|
@ -10,25 +10,25 @@
|
|||
" name="assert" />
|
||||
|
||||
|
||||
<link href="mailto:fremycompany.developer@yahoo.fr" rel="author" title="François REMY" />
|
||||
<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-notation" rel="help" />
|
||||
|
||||
<link href="reference/all-green.xht" rel="match" />
|
||||
|
||||
|
||||
<style type="text/css">
|
||||
|
||||
|
||||
html, body { margin: 0px; padding: 0px; }
|
||||
|
||||
|
||||
html { background: red; }
|
||||
#target { position: absolute; background: green; width: calc(100vw + 50px); height: calc(100vh + 50px); top: -50px; left: -50px; }
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
<div id="target"></div>
|
||||
|
||||
|
||||
|
|
|
|||
Some files were not shown because too many files have changed in this diff Show more
Loading…
Add table
Add a link
Reference in a new issue