Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-06-24 00:54:32 +01:00
Code Issues Projects Releases Packages Wiki Activity

Update CSS tests to revision 0698c2aa9ead844b6d7d10eafb096cb1118e13ef

Browse source
This commit is contained in:
Ms2ger 2015-12-09 01:48:05 -05:00
parent 9aa1b1e408
commit 35c74aecc2
11290 changed files with 92400 additions and 49214 deletions
Download patch file Download diff file Expand all files Collapse all files

18
tests/wpt/css-tests/css-values-3_dev/html/attr-color-invalid-cast.htm
View file

@ -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>

18
tests/wpt/css-tests/css-values-3_dev/html/attr-color-invalid-fallback.htm
View file

@ -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>

18
tests/wpt/css-tests/css-values-3_dev/html/attr-color-valid.htm
View file

@ -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>

18
tests/wpt/css-tests/css-values-3_dev/html/attr-invalid-type-001.htm
View file

@ -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>

18
tests/wpt/css-tests/css-values-3_dev/html/attr-invalid-type-002.htm
View file

@ -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>

18
tests/wpt/css-tests/css-values-3_dev/html/attr-invalid-type-003.htm
View file

@ -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>

18
tests/wpt/css-tests/css-values-3_dev/html/attr-length-invalid-cast.htm
View file

@ -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>

18
tests/wpt/css-tests/css-values-3_dev/html/attr-length-invalid-fallback.htm
View file

@ -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>

18
tests/wpt/css-tests/css-values-3_dev/html/attr-length-valid-zero-nofallback.htm
View file

@ -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>

18
tests/wpt/css-tests/css-values-3_dev/html/attr-length-valid-zero.htm
View file

@ -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>

18
tests/wpt/css-tests/css-values-3_dev/html/attr-length-valid.htm
View file

@ -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>

18
tests/wpt/css-tests/css-values-3_dev/html/attr-px-invalid-cast.htm
View file

@ -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>

18
tests/wpt/css-tests/css-values-3_dev/html/attr-px-invalid-fallback.htm
View file

@ -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>

18
tests/wpt/css-tests/css-values-3_dev/html/attr-px-valid.htm
View file

@ -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>

16
tests/wpt/css-tests/css-values-3_dev/html/calc-in-calc.htm
View file

@ -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>

14
tests/wpt/css-tests/css-values-3_dev/html/calc-in-media-queries-001.htm
View file

@ -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>

14
tests/wpt/css-tests/css-values-3_dev/html/calc-in-media-queries-002.htm
View file

@ -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>

18
tests/wpt/css-tests/css-values-3_dev/html/calc-invalid-range-clamping.htm
View file

@ -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>

16
tests/wpt/css-tests/css-values-3_dev/html/calc-parenthesis-stack.htm
View file

@ -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>

16
tests/wpt/css-tests/css-values-3_dev/html/initial-background-color.htm
View file

@ -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>

4
tests/wpt/css-tests/css-values-3_dev/html/multicol-inherit-002.htm
View file

@ -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

20
tests/wpt/css-tests/css-values-3_dev/html/reference/200-200-green.htm
View file

@ -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>

24
tests/wpt/css-tests/css-values-3_dev/html/reference/support/generalParallelTest.js
View file

@ -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
};
}

8
tests/wpt/css-tests/css-values-3_dev/html/reference/support/helper.js
View file

@ -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');
}

48
tests/wpt/css-tests/css-values-3_dev/html/reference/support/properties.js
View file

@ -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);

42
tests/wpt/css-tests/css-values-3_dev/html/reference/support/runParallelAsyncHarness.js
View file

@ -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);

6
tests/wpt/css-tests/css-values-3_dev/html/reference/support/util.js
View file

@ -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);
}
}
}

14
tests/wpt/css-tests/css-values-3_dev/html/reference/support/vendorPrefix.js
View file

@ -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);

2
tests/wpt/css-tests/css-values-3_dev/html/shape-outside-circle-011.htm
View file

@ -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%)',

6
tests/wpt/css-tests/css-values-3_dev/html/shape-outside-ellipse-010.htm
View file

@ -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([

4
tests/wpt/css-tests/css-values-3_dev/html/shape-outside-ellipse-011.htm
View file

@ -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([

24
tests/wpt/css-tests/css-values-3_dev/html/support/generalParallelTest.js
View file

@ -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
};
}

8
tests/wpt/css-tests/css-values-3_dev/html/support/helper.js
View file

@ -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');
}

48
tests/wpt/css-tests/css-values-3_dev/html/support/properties.js
View file

@ -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);

42
tests/wpt/css-tests/css-values-3_dev/html/support/runParallelAsyncHarness.js
View file

@ -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);

6
tests/wpt/css-tests/css-values-3_dev/html/support/util.js
View file

@ -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);
}
}
}

14
tests/wpt/css-tests/css-values-3_dev/html/support/vendorPrefix.js
View file

@ -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);

13
tests/wpt/css-tests/css-values-3_dev/html/transition-delay-001.htm
View file

@ -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>

13
tests/wpt/css-tests/css-values-3_dev/html/transition-duration-001.htm
View file

@ -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>

18
tests/wpt/css-tests/css-values-3_dev/html/vh-calc-support-pct.htm
View file

@ -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>

18
tests/wpt/css-tests/css-values-3_dev/html/vh-calc-support.htm
View file

@ -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>

16
tests/wpt/css-tests/css-values-3_dev/html/vh-em-inherit.htm
View file

@ -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>

16
tests/wpt/css-tests/css-values-3_dev/html/vh-inherit.htm
View file

@ -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>

16
tests/wpt/css-tests/css-values-3_dev/html/vh-interpolate-pct.htm
View file

@ -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>

16
tests/wpt/css-tests/css-values-3_dev/html/vh-interpolate-px.htm
View file

@ -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>

16
tests/wpt/css-tests/css-values-3_dev/html/vh-interpolate-vh.htm
View file

@ -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>

20
tests/wpt/css-tests/css-values-3_dev/html/vh-support-atviewport.htm
View file

@ -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>

16
tests/wpt/css-tests/css-values-3_dev/html/vh-support-margin.htm
View file

@ -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>

18
tests/wpt/css-tests/css-values-3_dev/html/vh-support-transform-origin.htm
View file

@ -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>

18
tests/wpt/css-tests/css-values-3_dev/html/vh-support-transform-translate.htm
View file

@ -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>

14
tests/wpt/css-tests/css-values-3_dev/html/vh-support.htm
View file

@ -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>

16
tests/wpt/css-tests/css-values-3_dev/html/vh-zero-support.htm
View file

@ -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>

2
tests/wpt/css-tests/css-values-3_dev/html/vh_not_refreshing_on_chrome_iframe.htm
View file

@ -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) {

4
tests/wpt/css-tests/css-values-3_dev/html/viewport-relative-lengths-scaled-viewport.htm
View file

@ -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>

58
tests/wpt/css-tests/css-values-3_dev/html/viewport-units-css2-001.htm
View file

@ -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);
}
}