Source code

Revision control

Other Tools

Test Info:

<!DOCTYPE HTML>
<html>
<!--
-->
<head>
<title>Test that property_database.js contains all supported CSS properties</title>
<script src="/tests/SimpleTest/SimpleTest.js"></script>
<script type="text/javascript" src="css_properties.js"></script>
<script type="text/javascript" src="property_database.js"></script>
<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"></div>
</div>
<pre id="test">
<script class="testbody" type="text/javascript">
/** Test that property_database.js contains all supported CSS properties **/
/*
* Here we are testing the hand-written property_database.js against
* the autogenerated css_properties.js to make sure that everything in
* css_properties.js is in property_database.js.
*
* This prevents CSS properties from being added to the code without
* also being put under the minimal test coverage provided by the tests
* that use property_database.js.
*/
for (var idx in gLonghandProperties) {
var prop = gLonghandProperties[idx];
const webRenderEnabled = IsWebRenderEnabled();
if (prop.pref && !IsCSSPropertyPrefEnabled(prop.pref)) {
continue;
} else if (prop.name === "backdrop-filter" && !webRenderEnabled) {
continue;
}
var present = prop.name in gCSSProperties;
ok(present,
"'" + prop.name + "' listed in gCSSProperties");
if (present) {
is(gCSSProperties[prop.name].type, CSS_TYPE_LONGHAND,
"'" + prop.name + "' listed as CSS_TYPE_LONGHAND");
is(gCSSProperties[prop.name].domProp, prop.prop,
"'" + prop.name + "' listed with correct DOM property name");
}
}
for (var idx in gShorthandProperties) {
var prop = gShorthandProperties[idx];
if (prop.pref && !IsCSSPropertyPrefEnabled(prop.pref)) {
continue;
} else if (prop.name === "backdrop-filter" && !webRenderEnabled) {
continue;
}
if (prop.name == "all") {
// "all" isn't listed in property_database.js.
continue;
}
var present = prop.name in gCSSProperties;
ok(present,
"'" + prop.name + "' listed in gCSSProperties");
if (present) {
ok(gCSSProperties[prop.name].type == CSS_TYPE_TRUE_SHORTHAND ||
gCSSProperties[prop.name].type == CSS_TYPE_LEGACY_SHORTHAND ||
gCSSProperties[prop.name].type == CSS_TYPE_SHORTHAND_AND_LONGHAND,
"'" + prop.name + "' listed as CSS_TYPE_TRUE_SHORTHAND, CSS_TYPE_LEGACY_SHORTHAND, or CSS_TYPE_SHORTHAND_AND_LONGHAND");
ok(gCSSProperties[prop.name].domProp == prop.prop,
"'" + prop.name + "' listed with correct DOM property name");
}
}
for (var idx in gShorthandPropertiesLikeLonghand) {
var prop = gShorthandPropertiesLikeLonghand[idx];
if (prop.pref && !IsCSSPropertyPrefEnabled(prop.pref)) {
continue;
} else if (prop.name === "backdrop-filter" && !webRenderEnabled) {
continue;
}
var present = prop.name in gCSSProperties;
ok(present,
"'" + prop.name + "' listed in gCSSProperties");
if (present) {
ok(gCSSProperties[prop.name].type == CSS_TYPE_SHORTHAND_AND_LONGHAND,
"'" + prop.name + "' listed as CSS_TYPE_SHORTHAND_AND_LONGHAND");
ok(gCSSProperties[prop.name].domProp == prop.prop,
"'" + prop.name + "' listed with correct DOM property name");
}
}
/*
* Test that all shorthand properties have a subproperty list and all
* longhand properties do not.
*/
for (var prop in gCSSProperties) {
var entry = gCSSProperties[prop];
if (entry.pref && !IsCSSPropertyPrefEnabled(entry.pref)) {
continue;
}
if (entry.type == CSS_TYPE_LONGHAND) {
ok(!("subproperties" in entry),
"longhand property '" + prop + "' must not have subproperty list");
} else if (entry.type == CSS_TYPE_TRUE_SHORTHAND ||
entry.type == CSS_TYPE_SHORTHAND_AND_LONGHAND) {
ok("subproperties" in entry,
"shorthand property '" + prop + "' must have subproperty list");
}
if ("subproperties" in entry) {
var good = true;
if (entry.subproperties.length < 1) {
info("subproperty list for '" + prop + "' is empty");
good = false;
}
for (var idx in entry.subproperties) {
var subprop = entry.subproperties[idx];
if (!(subprop in gCSSProperties)) {
info("subproperty list for '" + prop + "' lists nonexistent subproperty '" + subprop + "'");
good = false;
}
}
ok(good, "property '" + prop + "' has a good subproperty list");
}
ok("initial_values" in entry && entry.initial_values.length >= 1,
"must have initial values for property '" + prop + "'");
ok("other_values" in entry && entry.other_values.length >= 1,
"must have non-initial values for property '" + prop + "'");
}
/*
* Test that only longhand properties or its aliases are listed as logical
* properties.
*/
for (var prop in gCSSProperties) {
var entry = gCSSProperties[prop];
if (entry.logical) {
ok(entry.type == CSS_TYPE_LONGHAND ||
(entry.alias_for && gCSSProperties[entry.alias_for].logical),
"property '" + prop + "' is listed as CSS_TYPE_LONGHAND or is an alias due to it " +
"being a logical property");
}
}
/*
* Test that axis is only specified for logical properties.
*/
for (var prop in gCSSProperties) {
var entry = gCSSProperties[prop];
if (entry.axis) {
ok(entry.logical,
"property '" + prop + "' is listed as an logical property due to its " +
"being listed as an axis-related property");
}
}
/*
* Test that DOM properties match the expected rules.
*/
for (var prop in gCSSProperties) {
var entry = gCSSProperties[prop];
var expectedDOMProp = prop.replace(/-([a-z])/g,
function(m, p1, offset, str) {
return p1.toUpperCase();
});
if (expectedDOMProp == "float") {
expectedDOMProp = "cssFloat";
} else if (prop.startsWith("-webkit")) {
// Our DOM accessors for webkit-prefixed properties start with lowercase w,
// not uppercase like standard DOM accessors.
expectedDOMProp = expectedDOMProp.replace(/^W/, "w");
}
is(entry.domProp, expectedDOMProp, "DOM property for " + prop);
}
</script>
</pre>
</body>
</html>