Skip to content

Commit c73e28f

Browse files
zcorpanzcorpan
committed
HTML: Test default styles for 'appearance'
Part of whatwg/html#4322
1 parent 94c3729 commit c73e28f

File tree

1 file changed

+96
-0
lines changed

1 file changed

+96
-0
lines changed

‎html/rendering/widgets/appearance/default-styles.html

Lines changed: 96 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
1+
<!doctype html>
2+
<title>HTML: default style for 'appearance'</title>
3+
<script src="/resources/testharness.js"></script>
4+
<script src="/resources/testharnessreport.js"></script>
5+
<body>
6+
<script>
7+
// namespaces
8+
const htmlns = 'http://www.w3.org/1999/xhtml';
9+
const svgns = 'http://www.w3.org/2000/svg';
10+
11+
// auto
12+
testAppearance(htmlns, 'input', null, 'auto');
13+
testAppearance(htmlns, 'input', {type: 'text'}, 'auto');
14+
testAppearance(htmlns, 'input', {type: 'TEXT'}, 'auto');
15+
testAppearance(htmlns, 'input', {type: 'search'}, 'auto');
16+
testAppearance(htmlns, 'input', {type: 'tel'}, 'auto');
17+
testAppearance(htmlns, 'input', {type: 'url'}, 'auto');
18+
testAppearance(htmlns, 'input', {type: 'email'}, 'auto');
19+
testAppearance(htmlns, 'input', {type: 'password'}, 'auto');
20+
testAppearance(htmlns, 'input', {type: 'date'}, 'auto');
21+
testAppearance(htmlns, 'input', {type: 'month'}, 'auto');
22+
testAppearance(htmlns, 'input', {type: 'week'}, 'auto');
23+
testAppearance(htmlns, 'input', {type: 'time'}, 'auto');
24+
testAppearance(htmlns, 'input', {type: 'datetime-local'}, 'auto');
25+
testAppearance(htmlns, 'input', {type: 'number'}, 'auto');
26+
testAppearance(htmlns, 'input', {type: 'range'}, 'auto');
27+
testAppearance(htmlns, 'input', {type: 'color'}, 'auto');
28+
testAppearance(htmlns, 'input', {type: 'checkbox'}, 'auto');
29+
testAppearance(htmlns, 'input', {type: 'radio'}, 'auto');
30+
testAppearance(htmlns, 'input', {type: 'submit'}, 'auto');
31+
testAppearance(htmlns, 'input', {type: 'reset'}, 'auto');
32+
testAppearance(htmlns, 'input', {type: 'button'}, 'auto');
33+
testAppearance(htmlns, 'input', {type: 'unknowntype'}, 'auto');
34+
testAppearance(htmlns, 'select', null, 'auto');
35+
testAppearance(htmlns, 'select', {multiple: ''}, 'auto');
36+
testAppearance(htmlns, 'select', {size: '2'}, 'auto');
37+
testAppearance(htmlns, 'button', null, 'auto');
38+
testAppearance(htmlns, 'textarea', null, 'auto');
39+
testAppearance(htmlns, 'meter', null, 'auto');
40+
testAppearance(htmlns, 'progress', null, 'auto');
41+
42+
// none
43+
testAppearance(htmlns, 'input', {type: 'hidden'}, 'none');
44+
testAppearance(htmlns, 'input', {type: 'HIDDEN'}, 'none');
45+
testAppearance(htmlns, 'input', {type: 'file'}, 'none');
46+
testAppearance(htmlns, 'input', {type: 'image'}, 'none');
47+
testAppearance(htmlns, 'div', null, 'none');
48+
testAppearance(htmlns, 'details', null, 'none');
49+
testAppearance(htmlns, 'summary', null, 'none');
50+
testAppearance(htmlns, 'video', null, 'none');
51+
testAppearance(htmlns, 'video', {controls: ''}, 'none');
52+
testAppearance(htmlns, 'menuitem', null, 'none');
53+
testAppearance(htmlns, 'marquee', null, 'none');
54+
testAppearance(htmlns, 'keygen', null, 'none');
55+
testAppearance(null, 'input', null, 'none');
56+
testAppearance(svgns, 'input', null, 'none');
57+
58+
test(t => {
59+
assertAppearance(document.documentElement, 'none');
60+
}, 'The html element');
61+
62+
test(t => {
63+
assertAppearance(document.body, 'none');
64+
}, 'The body element');
65+
66+
67+
function testAppearance(ns, tag, attributes, expected) {
68+
test(t => {
69+
const elm = document.createElementNS(ns, tag);
70+
for (const att in attributes) {
71+
elm.setAttribute(att, attributes[att]);
72+
}
73+
document.body.appendChild(elm);
74+
t.add_cleanup(() => elm.remove());
75+
assertAppearance(elm, expected);
76+
}, formatTestName(ns, tag, attributes));
77+
}
78+
79+
function assertAppearance(elm, expected) {
80+
const computedStyle = getComputedStyle(elm);
81+
assert_equals(computedStyle.getPropertyValue('-webkit-appearance'), expected, '-webkit-appearance');
82+
assert_equals(computedStyle.getPropertyValue('appearance'), expected, 'appearance (no prefix)');
83+
}
84+
85+
function formatTestName(ns, tag, attributes) {
86+
let s = `<${tag}`;
87+
for (const att in attributes) {
88+
s += ` ${att}="${attributes[att]}"`;
89+
}
90+
s += '>';
91+
if (ns !== htmlns) {
92+
s += ` (namespace: ${ns})`;
93+
}
94+
return s;
95+
}
96+
</script>

0 commit comments

Comments
 (0)