зеркало из https://github.com/mozilla/gecko-dev.git
Add tests for computed values.
This commit is contained in:
dbaron@dbaron.org
Родитель
882b3eb4c9
Коммит
d900b59311
|
|
@ -72,12 +72,17 @@ _TEST_FILES = test_bug302186.html \
|
|||
test_bug372770.html \
|
||||
test_bug373293.html \
|
||||
test_inherit_storage.html \
|
||||
test_inherit_computation.html \
|
||||
test_initial_storage.html \
|
||||
test_initial_computation.html \
|
||||
test_property_database.html \
|
||||
test_property_syntax_errors.html \
|
||||
test_value_storage.html \
|
||||
test_value_computation.html \
|
||||
css_properties.js \
|
||||
property_database.js \
|
||||
unstyled.xml \
|
||||
unstyled.css \
|
||||
$(NULL)
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -240,7 +240,7 @@ var gCSSProperties = {
|
|||
inherited: false,
|
||||
type: CSS_TYPE_LONGHAND,
|
||||
initial_values: [ "auto" ],
|
||||
other_values: [ "50%", "15px" ],
|
||||
other_values: [ "15px", "50%" ],
|
||||
invalid_values: [ "20" ]
|
||||
},
|
||||
"-moz-float-edge": {
|
||||
|
|
@ -261,7 +261,7 @@ var gCSSProperties = {
|
|||
},
|
||||
"-moz-image-region": {
|
||||
domProp: "MozImageRegion",
|
||||
inherited: false,
|
||||
inherited: true,
|
||||
type: CSS_TYPE_LONGHAND,
|
||||
initial_values: [ "auto" ],
|
||||
other_values: [ "rect(3px 20px 15px 4px)", "rect(17px, 21px, 33px, 2px)" ],
|
||||
|
|
@ -480,7 +480,7 @@ var gCSSProperties = {
|
|||
domProp: "borderBottomWidth",
|
||||
inherited: false,
|
||||
type: CSS_TYPE_LONGHAND,
|
||||
/* XXX a value differing from initial requires border-style to be set */
|
||||
prerequisites: { "border-bottom-style": "solid" },
|
||||
initial_values: [ "medium", "3px" ],
|
||||
other_values: [ "thin", "thick", "1px", "2em" ],
|
||||
invalid_values: [ "5%" ]
|
||||
|
|
@ -532,7 +532,7 @@ var gCSSProperties = {
|
|||
domProp: "borderLeftWidth",
|
||||
inherited: false,
|
||||
type: CSS_TYPE_LONGHAND,
|
||||
/* XXX a value differing from initial requires border-style to be set */
|
||||
prerequisites: { "border-left-style": "solid" },
|
||||
initial_values: [ "medium", "3px" ],
|
||||
other_values: [ "thin", "thick", "1px", "2em" ],
|
||||
invalid_values: [ "5%" ]
|
||||
|
|
@ -567,7 +567,7 @@ var gCSSProperties = {
|
|||
domProp: "borderRightWidth",
|
||||
inherited: false,
|
||||
type: CSS_TYPE_LONGHAND,
|
||||
/* XXX a value differing from initial requires border-style to be set */
|
||||
prerequisites: { "border-right-style": "solid" },
|
||||
initial_values: [ "medium", "3px" ],
|
||||
other_values: [ "thin", "thick", "1px", "2em" ],
|
||||
invalid_values: [ "5%" ]
|
||||
|
|
@ -620,7 +620,7 @@ var gCSSProperties = {
|
|||
domProp: "borderTopWidth",
|
||||
inherited: false,
|
||||
type: CSS_TYPE_LONGHAND,
|
||||
/* XXX a value differing from initial requires border-style to be set */
|
||||
prerequisites: { "border-top-style": "solid" },
|
||||
initial_values: [ "medium", "3px" ],
|
||||
other_values: [ "thin", "thick", "1px", "2em" ],
|
||||
invalid_values: [ "5%" ]
|
||||
|
|
@ -630,7 +630,7 @@ var gCSSProperties = {
|
|||
inherited: false,
|
||||
type: CSS_TYPE_TRUE_SHORTHAND,
|
||||
subproperties: [ "border-top-width", "border-right-width", "border-bottom-width", "border-left-width" ],
|
||||
/* XXX a value differing from initial requires border-style to be set */
|
||||
prerequisites: { "border-style": "solid" },
|
||||
initial_values: [ "medium", "3px", "medium medium", "3px medium medium", "medium 3px medium medium" ],
|
||||
other_values: [ "thin", "thick", "1px", "2em", "2px 0 0px 1em" ],
|
||||
invalid_values: [ "5%" ]
|
||||
|
|
@ -666,14 +666,15 @@ var gCSSProperties = {
|
|||
inherited: false,
|
||||
type: CSS_TYPE_LONGHAND,
|
||||
initial_values: [ "auto" ],
|
||||
other_values: [ "rect(auto,auto,auto,auto)", "rect(3px, 4px, 4em, 0)", "rect(auto, 3em, 4pt, 2px)", "rect(2px 3px 4px 5px)" ],
|
||||
other_values: [ "rect(0 0 0 0)", "rect(auto,auto,auto,auto)", "rect(3px, 4px, 4em, 0)", "rect(auto, 3em, 4pt, 2px)", "rect(2px 3px 4px 5px)" ],
|
||||
invalid_values: [ "rect(auto, 3em, 2%, 5px)" ]
|
||||
},
|
||||
"color": {
|
||||
domProp: "color",
|
||||
inherited: true,
|
||||
type: CSS_TYPE_LONGHAND,
|
||||
initial_values: [ "currentcolor" ],
|
||||
/* XXX should test currentColor, but may or may not be initial */
|
||||
initial_values: [ "black", "#000" ],
|
||||
other_values: [ "green", "#f3c", "#fed292", "rgba(45,300,12,2)", "transparent" ],
|
||||
invalid_values: [ "fff", "ffffff", "#f", "#ff", "#ffff", "#fffff", "#fffffff", "#ffffffff", "#fffffffff" ]
|
||||
},
|
||||
|
|
@ -887,8 +888,8 @@ var gCSSProperties = {
|
|||
inherited: true,
|
||||
type: CSS_TYPE_TRUE_SHORTHAND,
|
||||
subproperties: [ "list-style-type", "list-style-position", "list-style-image" ],
|
||||
initial_values: [ "none", "outside", "disc", "none disc outside" ],
|
||||
other_values: [ "inside none", "none inside", "none none inside", "none outside none", "square", 'url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==")' ],
|
||||
initial_values: [ "outside", "disc", "none disc outside" ],
|
||||
other_values: [ "inside none", "none inside", "none none inside", "none outside none", "square", 'url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==")', "none" ],
|
||||
invalid_values: []
|
||||
},
|
||||
"list-style-image": {
|
||||
|
|
@ -1077,7 +1078,7 @@ var gCSSProperties = {
|
|||
domProp: "outlineWidth",
|
||||
inherited: false,
|
||||
type: CSS_TYPE_LONGHAND,
|
||||
/* XXX a value differing from initial requires border-style to be set */
|
||||
prerequisites: { "outline-style": "solid" },
|
||||
initial_values: [ "medium", "3px" ],
|
||||
other_values: [ "thin", "thick", "1px", "2em" ],
|
||||
invalid_values: [ "5%" ]
|
||||
|
|
|
|||
|
|
@ -0,0 +1,198 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<!--
|
||||
-->
|
||||
<head>
|
||||
<title>Test for computation of CSS 'inherit'</title>
|
||||
<script type="text/javascript" src="/MochiKit/MochiKit.js"></script>
|
||||
<script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
|
||||
<script type="text/javascript" src="property_database.js"></script>
|
||||
<style type="text/css" id="stylesheet"></style>
|
||||
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
|
||||
</head>
|
||||
<body>
|
||||
<p id="display"></p>
|
||||
<div id="content" style="display: none">
|
||||
|
||||
<div id="testnode"><span id="parent"><span id="child"></span></span></div>
|
||||
|
||||
</div>
|
||||
<pre id="test">
|
||||
<script class="testbody" type="text/javascript">
|
||||
|
||||
/** Test for computation of CSS 'inherit' **/
|
||||
|
||||
var gNoComputedStyle = {
|
||||
"-moz-force-broken-image-icon": true,
|
||||
"-moz-margin-end": true,
|
||||
"-moz-margin-start": true,
|
||||
"-moz-padding-end": true,
|
||||
"-moz-padding-start": true,
|
||||
"background-position": true,
|
||||
"content": true,
|
||||
"page-break-after": true,
|
||||
"page-break-before": true,
|
||||
"quotes": true,
|
||||
"clip-path": true,
|
||||
"clip-rule": true,
|
||||
"color-interpolation": true,
|
||||
"color-interpolation-filters": true,
|
||||
"dominant-baseline": true,
|
||||
"fill": true,
|
||||
"fill-opacity": true,
|
||||
"fill-rule": true,
|
||||
"filter": true,
|
||||
"flood-color": true,
|
||||
"flood-opacity": true,
|
||||
"marker": true, // NB: shorthand
|
||||
"marker-end": true,
|
||||
"marker-mid": true,
|
||||
"marker-start": true,
|
||||
"mask": true,
|
||||
"pointer-events": true,
|
||||
"shape-rendering": true,
|
||||
"stop-color": true,
|
||||
"stop-opacity": true,
|
||||
"stroke": true,
|
||||
"stroke-dasharray": true,
|
||||
"stroke-dashoffset": true,
|
||||
"stroke-linecap": true,
|
||||
"stroke-linejoin": true,
|
||||
"stroke-miterlimit": true,
|
||||
"stroke-opacity": true,
|
||||
"stroke-width": true,
|
||||
"text-anchor": true,
|
||||
"text-rendering": true,
|
||||
};
|
||||
|
||||
function xfail_diffcomputed(property) {
|
||||
return property in gNoComputedStyle;
|
||||
}
|
||||
|
||||
var gBrokenInherit = {
|
||||
// The nsRuleNode code uses the 'inherit' value for -moz-box-orient
|
||||
"-moz-box-flex": true,
|
||||
|
||||
// Not implemented in nsRuleNode
|
||||
"-moz-border-bottom-colors": true,
|
||||
"-moz-border-left-colors": true,
|
||||
"-moz-border-right-colors": true,
|
||||
"-moz-border-top-colors": true,
|
||||
|
||||
// Parses inherit as a counter name
|
||||
"counter-increment": true,
|
||||
"counter-reset": true,
|
||||
};
|
||||
|
||||
function xfail_inherit(property, matching_initial) {
|
||||
if (property == "-moz-box-flex" && matching_initial) {
|
||||
// It inherits from the wrong property, but that ends up right in
|
||||
// this case.
|
||||
return false;
|
||||
}
|
||||
return property in gBrokenInherit;
|
||||
}
|
||||
|
||||
var gParent = document.getElementById("parent");
|
||||
var gChild = document.getElementById("child");
|
||||
var gStyleSheet = document.getElementById("stylesheet").sheet;
|
||||
var gChildRule1 = gStyleSheet.cssRules[gStyleSheet.insertRule("#child {}", gStyleSheet.cssRules.length)];
|
||||
var gChildRule2 = gStyleSheet.cssRules[gStyleSheet.insertRule("#child {}", gStyleSheet.cssRules.length)];
|
||||
|
||||
// Get the computed value for a property. For shorthands, return the
|
||||
// computed values of all the subproperties, delimited by " ; ".
|
||||
function get_computed_value(node, property)
|
||||
{
|
||||
var info = gCSSProperties[property];
|
||||
var cs = getComputedStyle(node, "");
|
||||
if (!("subproperties" in info)) {
|
||||
return cs.getPropertyValue(property);
|
||||
}
|
||||
var results = [];
|
||||
for (var idx in info.subproperties) {
|
||||
var subprop = info.subproperties[idx];
|
||||
results.push(cs.getPropertyValue(subprop));
|
||||
}
|
||||
return results.join(" ; ");
|
||||
}
|
||||
|
||||
function test_property(property)
|
||||
{
|
||||
var info = gCSSProperties[property];
|
||||
if (info.backend_only)
|
||||
return;
|
||||
|
||||
if ("prerequisites" in info) {
|
||||
var prereqs = info.prerequisites;
|
||||
for (var prereq in prereqs) {
|
||||
gParent.style.setProperty(prereq, prereqs[prereq], "");
|
||||
gChild.style.setProperty(prereq, prereqs[prereq], "");
|
||||
}
|
||||
}
|
||||
|
||||
if (info.inherited) {
|
||||
gParent.style.setProperty(property, info.initial_values[0], "");
|
||||
var initial_computed = get_computed_value(gChild, property);
|
||||
gChildRule1.style.setProperty(property, info.other_values[0], "");
|
||||
var other_computed = get_computed_value(gChild, property);
|
||||
(xfail_diffcomputed(property) ? todo_isnot : isnot)(
|
||||
other_computed, initial_computed,
|
||||
"should be testing with values that compute to different things " +
|
||||
"for '" + property + "'");
|
||||
gChildRule2.style.setProperty(property, "inherit", "");
|
||||
var inherit_initial_computed = get_computed_value(gChild, property);
|
||||
(xfail_inherit(property, true) ? todo_is : is)(
|
||||
inherit_initial_computed, initial_computed,
|
||||
"inherit should cause inheritance of initial value for '" +
|
||||
property + "'");
|
||||
gParent.style.setProperty(property, info.other_values[0], "");
|
||||
var inherit_other_computed = get_computed_value(gChild, property);
|
||||
(xfail_inherit(property, false) ? todo_is : is)(
|
||||
inherit_other_computed, other_computed,
|
||||
"inherit should cause inheritance of other value for '" +
|
||||
property + "'");
|
||||
gParent.style.removeProperty(property);
|
||||
gChildRule1.style.removeProperty(property);
|
||||
gChildRule2.style.removeProperty(property);
|
||||
} else {
|
||||
gParent.style.setProperty(property, info.other_values[0], "");
|
||||
var initial_computed = get_computed_value(gChild, property);
|
||||
var other_computed = get_computed_value(gParent, property);
|
||||
(xfail_diffcomputed(property) ? todo_isnot : isnot)(
|
||||
other_computed, initial_computed,
|
||||
"should be testing with values that compute to different things " +
|
||||
"for '" + property + "'");
|
||||
gChildRule2.style.setProperty(property, "inherit", "");
|
||||
var inherit_other_computed = get_computed_value(gChild, property);
|
||||
(xfail_inherit(property, false) ? todo_is : is)(
|
||||
inherit_other_computed, other_computed,
|
||||
"inherit should cause inheritance of other value for '" +
|
||||
property + "'");
|
||||
gParent.style.removeProperty(property);
|
||||
gChildRule1.style.setProperty(property, info.other_values[0], "");
|
||||
var inherit_initial_computed = get_computed_value(gChild, property);
|
||||
(xfail_inherit(property, true) ? todo_is : is)(
|
||||
inherit_initial_computed, initial_computed,
|
||||
"inherit should cause inheritance of initial value for '" +
|
||||
property + "'");
|
||||
gParent.style.removeProperty(property);
|
||||
gChildRule1.style.removeProperty(property);
|
||||
gChildRule2.style.removeProperty(property);
|
||||
}
|
||||
|
||||
if ("prerequisites" in info) {
|
||||
var prereqs = info.prerequisites;
|
||||
for (var prereq in prereqs) {
|
||||
gParent.style.removeProperty(prereq);
|
||||
gChild.style.removeProperty(prereq);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
for (var prop in gCSSProperties)
|
||||
test_property(prop);
|
||||
|
||||
</script>
|
||||
</pre>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,270 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<!--
|
||||
-->
|
||||
<head>
|
||||
<title>Test for computation of CSS '-moz-initial'</title>
|
||||
<script type="text/javascript" src="/MochiKit/MochiKit.js"></script>
|
||||
<script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
|
||||
<script type="text/javascript" src="property_database.js"></script>
|
||||
<style type="text/css" id="stylesheet"></style>
|
||||
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
|
||||
<script type="text/javascript">
|
||||
SimpleTest.waitForExplicitFinish();
|
||||
|
||||
var load_count = 0;
|
||||
function load_done() {
|
||||
if (++load_count == 2)
|
||||
run_tests();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<p id="display">
|
||||
<iframe id="unstyled" src="unstyled.xml" height="10" width="10" onload="load_done()"></iframe>
|
||||
</p>
|
||||
<div id="content" style="display: none">
|
||||
|
||||
<div id="testnode"><span id="element"></span></div>
|
||||
|
||||
|
||||
</div>
|
||||
<pre id="test">
|
||||
<script class="testbody" type="text/javascript">
|
||||
|
||||
/** Test for computation of CSS '-moz-initial' **/
|
||||
|
||||
var gNoComputedStyle = {
|
||||
"-moz-force-broken-image-icon": true,
|
||||
"-moz-margin-end": true,
|
||||
"-moz-margin-start": true,
|
||||
"-moz-padding-end": true,
|
||||
"-moz-padding-start": true,
|
||||
"background-position": true,
|
||||
"content": true,
|
||||
"page-break-after": true,
|
||||
"page-break-before": true,
|
||||
"quotes": true,
|
||||
"clip-path": true,
|
||||
"clip-rule": true,
|
||||
"color-interpolation": true,
|
||||
"color-interpolation-filters": true,
|
||||
"dominant-baseline": true,
|
||||
"fill": true,
|
||||
"fill-opacity": true,
|
||||
"fill-rule": true,
|
||||
"filter": true,
|
||||
"flood-color": true,
|
||||
"flood-opacity": true,
|
||||
"marker": true, // NB: shorthand
|
||||
"marker-end": true,
|
||||
"marker-mid": true,
|
||||
"marker-start": true,
|
||||
"mask": true,
|
||||
"pointer-events": true,
|
||||
"shape-rendering": true,
|
||||
"stop-color": true,
|
||||
"stop-opacity": true,
|
||||
"stroke": true,
|
||||
"stroke-dasharray": true,
|
||||
"stroke-dashoffset": true,
|
||||
"stroke-linecap": true,
|
||||
"stroke-linejoin": true,
|
||||
"stroke-miterlimit": true,
|
||||
"stroke-opacity": true,
|
||||
"stroke-width": true,
|
||||
"text-anchor": true,
|
||||
"text-rendering": true,
|
||||
};
|
||||
|
||||
function xfail_diffcomputed(property) {
|
||||
return property in gNoComputedStyle;
|
||||
}
|
||||
|
||||
var gBrokenInitial = {
|
||||
// Presumably either not parsed or not implemented in nsRuleNode.
|
||||
"-moz-appearance": true,
|
||||
"-moz-binding": true,
|
||||
"-moz-border-radius": true,
|
||||
"-moz-border-radius-bottomleft": true,
|
||||
"-moz-border-radius-bottomright": true,
|
||||
"-moz-border-radius-topleft": true,
|
||||
"-moz-border-radius-topright": true,
|
||||
"-moz-box-align": true,
|
||||
"-moz-box-direction": true,
|
||||
"-moz-box-flex": true,
|
||||
"-moz-box-orient": true,
|
||||
"-moz-box-pack": true,
|
||||
"-moz-box-sizing": true,
|
||||
"-moz-column-count": true,
|
||||
"-moz-column-gap": true,
|
||||
"-moz-column-width": true,
|
||||
"-moz-float-edge": true,
|
||||
"-moz-image-region": true,
|
||||
"-moz-outline-radius": true,
|
||||
"-moz-outline-radius-bottomleft": true,
|
||||
"-moz-outline-radius-bottomright": true,
|
||||
"-moz-outline-radius-topleft": true,
|
||||
"-moz-outline-radius-topright": true,
|
||||
"-moz-user-focus": true,
|
||||
"-moz-user-input": true,
|
||||
"-moz-user-modify": true,
|
||||
"-moz-user-select": true,
|
||||
"background-attachment": true,
|
||||
"background-color": true,
|
||||
"background-image": true,
|
||||
"background-repeat": true,
|
||||
// XXX Why aren't the border-width values failing, etc.?
|
||||
"border-bottom-color": true,
|
||||
"border-collapse": true,
|
||||
"border-color": true,
|
||||
"border-left-color": true,
|
||||
"border-right-color": true,
|
||||
"border-spacing": true,
|
||||
"border-top-color": true,
|
||||
"bottom": true,
|
||||
"caption-side": true,
|
||||
"clear": true,
|
||||
"cursor": true,
|
||||
"direction": true,
|
||||
"display": true,
|
||||
"empty-cells": true,
|
||||
"font": true, // XXX This one is weird.
|
||||
"font-family": true, // XXX This one is weird.
|
||||
"height": true,
|
||||
"left": true,
|
||||
"letter-spacing": true,
|
||||
"line-height": true,
|
||||
"list-style": true,
|
||||
"list-style-image": true,
|
||||
"list-style-position": true,
|
||||
"list-style-type": true,
|
||||
"margin": true,
|
||||
"margin-bottom": true,
|
||||
"margin-left": true,
|
||||
"margin-right": true,
|
||||
"margin-top": true,
|
||||
"max-height": true,
|
||||
"max-width": true,
|
||||
"min-height": true,
|
||||
"min-width": true,
|
||||
"opacity": true,
|
||||
"outline": true,
|
||||
"outline-color": true, // XXX Why didn't this fail until I added the if (info.inherited) checks?
|
||||
"outline-offset": true,
|
||||
"outline-style": true,
|
||||
"overflow": true,
|
||||
"padding": true,
|
||||
"padding-bottom": true,
|
||||
"padding-left": true,
|
||||
"padding-right": true,
|
||||
"padding-top": true,
|
||||
"position": true,
|
||||
"right": true,
|
||||
"table-layout": true,
|
||||
"text-decoration": true,
|
||||
"text-indent": true,
|
||||
"text-transform": true,
|
||||
"top": true,
|
||||
"unicode-bidi": true,
|
||||
"vertical-align": true,
|
||||
"visibility": true,
|
||||
"white-space": true,
|
||||
"width": true,
|
||||
"word-spacing": true,
|
||||
"z-index": true,
|
||||
};
|
||||
|
||||
function xfail_initial(property) {
|
||||
return property in gBrokenInitial;
|
||||
}
|
||||
|
||||
var gElement = document.getElementById("element");
|
||||
var gStyleSheet = document.getElementById("stylesheet").sheet;
|
||||
var gRule1 = gStyleSheet.cssRules[gStyleSheet.insertRule("#element {}", gStyleSheet.cssRules.length)];
|
||||
var gRule2 = gStyleSheet.cssRules[gStyleSheet.insertRule("#element {}", gStyleSheet.cssRules.length)];
|
||||
|
||||
var gInitialValues;
|
||||
var gInitialPrereqsRule;
|
||||
|
||||
function setup_initial_values() {
|
||||
var iframe = document.getElementById("unstyled");
|
||||
gInitialValues = iframe.contentWindow.getComputedStyle(
|
||||
iframe.contentDocument.documentElement.firstChild, "");
|
||||
var sheet = iframe.contentDocument.styleSheets[0];
|
||||
gInitialPrereqsRule = sheet.cssRules[sheet.insertRule(":root > * {}", sheet.cssRules.length)];
|
||||
}
|
||||
|
||||
// Get the computed value for a property. For shorthands, return the
|
||||
// computed values of all the subproperties, delimited by " ; ".
|
||||
function get_computed_value(cs, property)
|
||||
{
|
||||
var info = gCSSProperties[property];
|
||||
if (!("subproperties" in info)) {
|
||||
return cs.getPropertyValue(property);
|
||||
}
|
||||
var results = [];
|
||||
for (var idx in info.subproperties) {
|
||||
var subprop = info.subproperties[idx];
|
||||
results.push(cs.getPropertyValue(subprop));
|
||||
}
|
||||
return results.join(" ; ");
|
||||
}
|
||||
|
||||
function test_property(property)
|
||||
{
|
||||
var info = gCSSProperties[property];
|
||||
if (info.backend_only)
|
||||
return;
|
||||
|
||||
if ("prerequisites" in info) {
|
||||
var prereqs = info.prerequisites;
|
||||
for (var prereq in prereqs) {
|
||||
gElement.style.setProperty(prereq, prereqs[prereq], "");
|
||||
gInitialPrereqsRule.style.setProperty(prereq, prereqs[prereq], "");
|
||||
}
|
||||
}
|
||||
if (info.inherited) {
|
||||
gElement.parentNode.style.setProperty(property, info.other_values[0], "");
|
||||
}
|
||||
|
||||
var initial_computed = get_computed_value(gInitialValues, property);
|
||||
gRule1.style.setProperty(property, info.other_values[0], "");
|
||||
var other_computed = get_computed_value(getComputedStyle(gElement, ""), property);
|
||||
(xfail_diffcomputed(property) ? todo_isnot : isnot)(
|
||||
other_computed, initial_computed,
|
||||
"should be testing with values that compute to different things " +
|
||||
"for '" + property + "'");
|
||||
gRule2.style.setProperty(property, "-moz-initial", "");
|
||||
var initial_val_computed = get_computed_value(getComputedStyle(gElement, ""), property);
|
||||
(xfail_initial(property) ? todo_is : is)(
|
||||
initial_val_computed, initial_computed,
|
||||
"-moz-initial should cause initial value for '" + property + "'");
|
||||
gRule1.style.removeProperty(property);
|
||||
gRule2.style.removeProperty(property);
|
||||
|
||||
if ("prerequisites" in info) {
|
||||
var prereqs = info.prerequisites;
|
||||
for (var prereq in prereqs) {
|
||||
gElement.style.removeProperty(prereq);
|
||||
gInitialPrereqsRule.style.removeProperty(prereq);
|
||||
}
|
||||
}
|
||||
if (info.inherited) {
|
||||
gElement.parentNode.style.removeProperty(property);
|
||||
}
|
||||
}
|
||||
|
||||
function run_tests() {
|
||||
setup_initial_values();
|
||||
for (var prop in gCSSProperties)
|
||||
test_property(prop);
|
||||
SimpleTest.finish();
|
||||
}
|
||||
|
||||
load_done();
|
||||
|
||||
</script>
|
||||
</pre>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,292 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<!--
|
||||
-->
|
||||
<head>
|
||||
<title>Test for computation of values in property database</title>
|
||||
<script type="text/javascript" src="/MochiKit/MochiKit.js"></script>
|
||||
<script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
|
||||
<script type="text/javascript" src="property_database.js"></script>
|
||||
<style type="text/css" id="stylesheet"></style>
|
||||
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
|
||||
<script type="text/javascript">
|
||||
SimpleTest.waitForExplicitFinish();
|
||||
|
||||
var load_count = 0;
|
||||
function load_done() {
|
||||
if (++load_count == 2)
|
||||
run_tests();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<p id="display">
|
||||
<iframe id="unstyled" src="unstyled.xml" height="10" width="10" onload="load_done()"></iframe>
|
||||
</p>
|
||||
<div id="content" style="display: none">
|
||||
|
||||
<div id="testnode"><span id="element"></span></div>
|
||||
|
||||
|
||||
</div>
|
||||
<pre id="test">
|
||||
<script class="testbody" type="text/javascript">
|
||||
|
||||
/** Test for computation of values in property database **/
|
||||
|
||||
var gNoComputedStyle = {
|
||||
"-moz-force-broken-image-icon": true,
|
||||
"-moz-margin-end": true,
|
||||
"-moz-margin-start": true,
|
||||
"-moz-padding-end": true,
|
||||
"-moz-padding-start": true,
|
||||
"background-position": true,
|
||||
"content": true,
|
||||
"page-break-after": true,
|
||||
"page-break-before": true,
|
||||
"quotes": true,
|
||||
"clip-path": true,
|
||||
"clip-rule": true,
|
||||
"color-interpolation": true,
|
||||
"color-interpolation-filters": true,
|
||||
"dominant-baseline": true,
|
||||
"fill": true,
|
||||
"fill-opacity": true,
|
||||
"fill-rule": true,
|
||||
"filter": true,
|
||||
"flood-color": true,
|
||||
"flood-opacity": true,
|
||||
"marker": true, // NB: shorthand
|
||||
"marker-end": true,
|
||||
"marker-mid": true,
|
||||
"marker-start": true,
|
||||
"mask": true,
|
||||
"pointer-events": true,
|
||||
"shape-rendering": true,
|
||||
"stop-color": true,
|
||||
"stop-opacity": true,
|
||||
"stroke": true,
|
||||
"stroke-dasharray": true,
|
||||
"stroke-dashoffset": true,
|
||||
"stroke-linecap": true,
|
||||
"stroke-linejoin": true,
|
||||
"stroke-miterlimit": true,
|
||||
"stroke-opacity": true,
|
||||
"stroke-width": true,
|
||||
"text-anchor": true,
|
||||
"text-rendering": true,
|
||||
};
|
||||
|
||||
function xfail_diffcomputed(property) {
|
||||
return property in gNoComputedStyle;
|
||||
}
|
||||
|
||||
var gNotAccepted = {
|
||||
"-moz-column-width": [ "50%" ],
|
||||
"-moz-user-select": [ "auto" ],
|
||||
"background-color": [ "rgb(255.0,0.387,3489)" ],
|
||||
"content": [ "none" ],
|
||||
"cue": [ "none none", "none url(404.wav)" ],
|
||||
"list-style": [ "none disc outside" ],
|
||||
"speak-punctuation": [ "none" ],
|
||||
};
|
||||
|
||||
var gBackgroundValuesWithOnlyPosition = {
|
||||
"top": true,
|
||||
"left": true,
|
||||
"50% 50%": true,
|
||||
"center": true,
|
||||
"bottom right scroll none transparent repeat": true,
|
||||
"50% transparent": true,
|
||||
"transparent 50%": true,
|
||||
"50%": true,
|
||||
};
|
||||
|
||||
var gBadComputed = {
|
||||
// NS_STYLE_COLUMN_COUNT_AUTO is 0
|
||||
"-moz-column-count": [ "0" ],
|
||||
|
||||
"clip": [ "rect(auto,auto,auto,auto)" ],
|
||||
|
||||
// This seems really broken!
|
||||
"counter-increment": [ "none" ],
|
||||
"counter-reset": [ "none" ],
|
||||
|
||||
// So does this.
|
||||
"marker-offset": [ "auto" ],
|
||||
|
||||
// No idea what's happening for these two either
|
||||
"border-bottom": [ "thin" ],
|
||||
"outline-width": [ "3px" ],
|
||||
|
||||
// Something wrong with our alpha-component parsing or clamping.
|
||||
"background-color": [ "rgba(255,255,255,-3.7)" ],
|
||||
|
||||
// 'normal' should compute to 0
|
||||
"word-spacing": [ "0", "0px", "-0em" ],
|
||||
|
||||
// These are probably bogus tests...
|
||||
"-moz-outline-radius": [ "0%" ],
|
||||
"-moz-outline-radius-bottomleft": [ "0%" ],
|
||||
"-moz-outline-radius-bottomright": [ "0%" ],
|
||||
"-moz-outline-radius-topleft": [ "0%" ],
|
||||
"-moz-outline-radius-topright": [ "0%" ],
|
||||
"margin": [ "0% 0px 0em 0pt" ],
|
||||
"margin-bottom": [ "0%" ],
|
||||
"margin-left": [ "0%" ],
|
||||
"margin-right": [ "0%" ],
|
||||
"margin-top": [ "0%" ],
|
||||
"padding": [ "0% 0px 0em 0pt" ],
|
||||
"padding-bottom": [ "0%" ],
|
||||
"padding-left": [ "0%" ],
|
||||
"padding-right": [ "0%" ],
|
||||
"padding-top": [ "0%" ],
|
||||
};
|
||||
|
||||
function xfail_value(property, value, is_initial) {
|
||||
if (property in gNoComputedStyle)
|
||||
return !is_initial;
|
||||
|
||||
if ((property in gNotAccepted) &&
|
||||
gNotAccepted[property].indexOf(value) != -1)
|
||||
return true;
|
||||
|
||||
if ((property in gBadComputed) &&
|
||||
gBadComputed[property].indexOf(value) != -1)
|
||||
return true;
|
||||
|
||||
// One subproperty of 'background' is in gNoComputedStyle
|
||||
if (property == "background" && value in gBackgroundValuesWithOnlyPosition)
|
||||
return true;
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
var gElement = document.getElementById("element");
|
||||
var gStyleSheet = document.getElementById("stylesheet").sheet;
|
||||
var gRule1 = gStyleSheet.cssRules[gStyleSheet.insertRule("#element {}", gStyleSheet.cssRules.length)];
|
||||
var gRule2 = gStyleSheet.cssRules[gStyleSheet.insertRule("#element {}", gStyleSheet.cssRules.length)];
|
||||
|
||||
var gInitialValues;
|
||||
var gInitialPrereqsRule;
|
||||
|
||||
function setup_initial_values() {
|
||||
var iframe = document.getElementById("unstyled");
|
||||
gInitialValues = iframe.contentWindow.getComputedStyle(
|
||||
iframe.contentDocument.documentElement.firstChild, "");
|
||||
var sheet = iframe.contentDocument.styleSheets[0];
|
||||
gInitialPrereqsRule = sheet.cssRules[sheet.insertRule(":root > * {}", sheet.cssRules.length)];
|
||||
}
|
||||
|
||||
// Get the computed value for a property. For shorthands, return the
|
||||
// computed values of all the subproperties, delimited by " ; ".
|
||||
function get_computed_value(cs, property)
|
||||
{
|
||||
var info = gCSSProperties[property];
|
||||
if (!("subproperties" in info)) {
|
||||
return cs.getPropertyValue(property);
|
||||
}
|
||||
var results = [];
|
||||
for (var idx in info.subproperties) {
|
||||
var subprop = info.subproperties[idx];
|
||||
results.push(cs.getPropertyValue(subprop));
|
||||
}
|
||||
return results.join(" ; ");
|
||||
}
|
||||
|
||||
function test_value(property, val, is_initial)
|
||||
{
|
||||
var info = gCSSProperties[property];
|
||||
if (info.backend_only)
|
||||
return;
|
||||
|
||||
if ("prerequisites" in info) {
|
||||
var prereqs = info.prerequisites;
|
||||
for (var prereq in prereqs) {
|
||||
gElement.style.setProperty(prereq, prereqs[prereq], "");
|
||||
gInitialPrereqsRule.style.setProperty(prereq, prereqs[prereq], "");
|
||||
}
|
||||
}
|
||||
if (info.inherited && is_initial) {
|
||||
gElement.parentNode.style.setProperty(property, info.other_values[0], "");
|
||||
}
|
||||
|
||||
var initial_computed = get_computed_value(gInitialValues, property);
|
||||
if (is_initial) {
|
||||
gRule1.style.setProperty(property, info.other_values[0], "");
|
||||
var other_computed = get_computed_value(getComputedStyle(gElement, ""), property);
|
||||
(xfail_diffcomputed(property) ? todo_isnot : isnot)(
|
||||
other_computed, initial_computed,
|
||||
"should be testing with values that compute to different things " +
|
||||
"for '" + property + "'");
|
||||
}
|
||||
gRule2.style.setProperty(property, val, "");
|
||||
var val_computed = get_computed_value(getComputedStyle(gElement, ""), property);
|
||||
if (is_initial) {
|
||||
(xfail_value(property, val, is_initial) ? todo_is : is)(
|
||||
val_computed, initial_computed,
|
||||
"should get initial value for '" + property + ":" + val + "'");
|
||||
} else {
|
||||
(xfail_value(property, val, is_initial) ? todo_isnot : isnot)(
|
||||
val_computed, initial_computed,
|
||||
"should not get initial value for '" + property + ":" + val + "'");
|
||||
}
|
||||
if (is_initial)
|
||||
gRule1.style.removeProperty(property);
|
||||
gRule2.style.removeProperty(property);
|
||||
|
||||
if ("prerequisites" in info) {
|
||||
var prereqs = info.prerequisites;
|
||||
for (var prereq in prereqs) {
|
||||
gElement.style.removeProperty(prereq);
|
||||
gInitialPrereqsRule.style.removeProperty(prereq);
|
||||
}
|
||||
}
|
||||
if (info.inherited && is_initial) {
|
||||
gElement.parentNode.style.removeProperty(property);
|
||||
}
|
||||
}
|
||||
|
||||
function test_property(prop) {
|
||||
var info = gCSSProperties[prop];
|
||||
for (var idx in info.initial_values)
|
||||
test_value(prop, info.initial_values[idx], true);
|
||||
for (var idx in info.other_values)
|
||||
test_value(prop, info.other_values[idx], false);
|
||||
}
|
||||
|
||||
function run_tests() {
|
||||
setup_initial_values();
|
||||
var props = [];
|
||||
for (var prop in gCSSProperties)
|
||||
props.push(prop);
|
||||
props = props.reverse();
|
||||
function do_one(l) {
|
||||
if (l.length == 0) {
|
||||
// SimpleTest.finish() is really slow, so we have to disable the
|
||||
// slow script dialog for this part
|
||||
netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
|
||||
var prefService = Components.classes["@mozilla.org/preferences-service;1"].
|
||||
getService(Components.interfaces.nsIPrefService);
|
||||
var domBranch = prefService.getBranch("dom.");
|
||||
var oldVal = domBranch.getIntPref("max_script_run_time");
|
||||
domBranch.setIntPref("max_script_run_time", 0);
|
||||
|
||||
SimpleTest.finish();
|
||||
|
||||
domBranch.setIntPref("max_script_run_time", oldVal);
|
||||
|
||||
return;
|
||||
}
|
||||
test_property(l.pop());
|
||||
setTimeout(do_one, 0, l);
|
||||
}
|
||||
setTimeout(do_one, 0, props);
|
||||
}
|
||||
|
||||
load_done();
|
||||
|
||||
</script>
|
||||
</pre>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
/* we're testing computed style on elements without frames */
|
||||
root { display: none }
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
<?xml version="1.0"?>
|
||||
<?xml-stylesheet href="unstyled.css" type="text/css"?>
|
||||
<root><child/></root>
|
||||
Загрузка…
Ссылка в новой задаче