/** Test for computation of CSS 'inherit' on all properties and 'unset' on
inherited properties **/
var gDisplayTree = document.getElementById("display");
// elements without a frame var gNParent = document.getElementById("nparent"); var gNChild = document.getElementById("nchild");
// elements with a frame var gFParent = document.getElementById("fparent"); var gFChild = document.getElementById("fchild");
var gStyleSheet = document.getElementById("stylesheet").sheet; var gChildRule1 = gStyleSheet.cssRules[gStyleSheet.insertRule("#nchild, #fchild {}", gStyleSheet.cssRules.length)]; var gChildRule2 = gStyleSheet.cssRules[gStyleSheet.insertRule("#nchild, #fchild {}", gStyleSheet.cssRules.length)]; var gChildRule3 = gStyleSheet.cssRules[gStyleSheet.insertRule("#nchild.allother, #fchild.allother {}", gStyleSheet.cssRules.length)]; var gChildRuleTop = gStyleSheet.cssRules[gStyleSheet.insertRule("#nchild, #nchild.allother, #fchild, #fchild.allother {}", gStyleSheet.cssRules.length)]; var gParentRuleTop = gStyleSheet.cssRules[gStyleSheet.insertRule("#nparent, #fparent {}", gStyleSheet.cssRules.length)];
function get_computed_value_node(node, property)
{ var cs = getComputedStyle(node, "");
return get_computed_value(cs, property);
}
function test_property(property)
{ var info = gCSSProperties[property];
var keywords = ["inherit"];
if (info.inherited)
keywords.push("unset");
keywords.forEach(function(keyword) {
if ("prerequisites" in info) { var prereqs = info.prerequisites;
for (var prereq in prereqs) {
gParentRuleTop.style.setProperty(prereq, prereqs[prereq], "");
gChildRuleTop.style.setProperty(prereq, prereqs[prereq], "");
}
}
if (info.inherited) {
gParentRuleTop.style.setProperty(property, info.initial_values[0], ""); var initial_computed_n = get_computed_value_node(gNChild, property); var initial_computed_f = get_computed_value_node(gFChild, property);
gChildRule1.style.setProperty(property, info.other_values[0], ""); var other_computed_n = get_computed_value_node(gNChild, property); var other_computed_f = get_computed_value_node(gFChild, property);
isnot(other_computed_n, initial_computed_n, "should be testing with values that compute to different things " + "for '" + property + "'");
isnot(other_computed_f, initial_computed_f, "should be testing with values that compute to different things " + "for '" + property + "'");
gChildRule3.style.setProperty(property, keyword, "");
gFChild.className="allother";
gNChild.className="allother"; var inherit_initial_computed_n = get_computed_value_node(gNChild, property); var inherit_initial_computed_f = get_computed_value_node(gFChild, property);
is(inherit_initial_computed_n, initial_computed_n,
keyword + " should cause inheritance of initial value for '" +
property + "'");
is(inherit_initial_computed_f, initial_computed_f,
keyword + " should cause inheritance of initial value for '" +
property + "'");
gParentRuleTop.style.setProperty(property, info.other_values[0], ""); var inherit_other_computed_n = get_computed_value_node(gNChild, property); var inherit_other_computed_f = get_computed_value_node(gFChild, property);
is(inherit_other_computed_n, other_computed_n,
keyword + " should cause inheritance of other value for '" +
property + "'");
is(inherit_other_computed_f, other_computed_f,
keyword + " should cause inheritance of other value for '" +
property + "'");
gParentRuleTop.style.removeProperty(property);
gChildRule1.style.removeProperty(property);
gChildRule3.style.setProperty(property, info.other_values[0], "");
gFChild.className="";
gNChild.className="";
} else {
gParentRuleTop.style.setProperty(property, info.other_values[0], ""); var initial_computed_n = get_computed_value_node(gNChild, property); var initial_computed_f = get_computed_value_node(gFChild, property); var other_computed_n = get_computed_value_node(gNParent, property); var other_computed_f = get_computed_value_node(gFParent, property);
isnot(other_computed_n, initial_computed_n, "should be testing with values that compute to different things " + "for '" + property + "'");
isnot(other_computed_f, initial_computed_f, "should be testing with values that compute to different things " + "for '" + property + "'");
gChildRule2.style.setProperty(property, keyword, ""); var inherit_other_computed_n = get_computed_value_node(gNChild, property); var inherit_other_computed_f = get_computed_value_node(gFChild, property);
is(inherit_other_computed_n, other_computed_n,
keyword + " should cause inheritance of other value for '" +
property + "'");
is(inherit_other_computed_f, other_computed_f,
keyword + " should cause inheritance of other value for '" +
property + "'");
gParentRuleTop.style.removeProperty(property);
gChildRule1.style.setProperty(property, info.other_values[0], ""); var inherit_initial_computed_n = get_computed_value_node(gNChild, property); var inherit_initial_computed_f = get_computed_value_node(gFChild, property);
is(inherit_initial_computed_n, initial_computed_n,
keyword + " should cause inheritance of initial value for '" +
property + "'");
// For width and inline-size, getComputedStyle returns used value
// when the element is displayed. Their initial value "auto" makes
// the element fill available space of the parent, so it doesn't
// make sense to compare it with the value we get before.
if (property != "width" && property != "inline-size") {
is(inherit_initial_computed_f, initial_computed_f,
keyword + " should cause inheritance of initial value for '" +
property + "'");
}
gParentRuleTop.style.removeProperty(property);
gChildRule1.style.removeProperty(property);
gChildRule2.style.removeProperty(property);
}
if ("prerequisites" in info) { var prereqs = info.prerequisites;
for (var prereq in prereqs) {
gParentRuleTop.style.removeProperty(prereq);
gChildRuleTop.style.removeProperty(prereq);
}
}
// FIXME -moz-binding value makes gElementF and its parent loses
// their frame. Force it to get recreated after each property.
// See bug 1331903.
gDisplayTree.style.display = "none";
get_computed_value(getComputedStyle(gFChild, ""), "width");
gDisplayTree.style.display = "";
get_computed_value(getComputedStyle(gFChild, ""), "width");
});
}
for (var prop in gCSSProperties) {
// Skip zoom because it affects other props.
if (prop == "zoom") {
continue;
} var info = gCSSProperties[prop];
gChildRule3.style.setProperty(prop, info.other_values[0], "");
}
for (var prop in gCSSProperties)
test_property(prop);
</script>
</pre>
</body>
</html>
Messung V0.5
¤ Dauer der Verarbeitung: 0.22 Sekunden
(vorverarbeitet)
¤
Die Informationen auf dieser Webseite wurden
nach bestem Wissen sorgfältig zusammengestellt. Es wird jedoch weder Vollständigkeit, noch Richtigkeit,
noch Qualität der bereit gestellten Informationen zugesichert.
Bemerkung:
Die farbliche Syntaxdarstellung und die Messung sind noch experimentell.