1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
|
<!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>
|
