OLD | NEW |
1 function testElementStyle(propertyJS, propertyCSS, type, value) | 1 function testComputedStyle(propertyJS, value) |
2 { | 2 { |
3 if (type != null) { | |
4 shouldBe("e.style." + propertyJS, "'" + value + "'"); | |
5 shouldBe("e.style.getPropertyCSSValue('" + propertyCSS + "').toString()"
, "'" + type + "'"); | |
6 shouldBe("e.style.getPropertyCSSValue('" + propertyCSS + "').cssText", "
'" + value + "'"); | |
7 } else | |
8 shouldBeNull("e.style.getPropertyCSSValue('" + propertyCSS + "')"); | |
9 } | |
10 | |
11 function testComputedStyle(propertyJS, propertyCSS, type, value) | |
12 { | |
13 computedStyle = window.getComputedStyle(e, null); | 3 computedStyle = window.getComputedStyle(e, null); |
14 shouldBe("computedStyle." + propertyJS, "'" + value + "'"); | 4 shouldBe("computedStyle." + propertyJS, "'" + value + "'"); |
15 shouldBe("computedStyle.getPropertyCSSValue('" + propertyCSS + "').toString(
)", "'" + type + "'"); | |
16 shouldBe("computedStyle.getPropertyCSSValue('" + propertyCSS + "').cssText",
"'" + value + "'"); | |
17 } | 5 } |
18 | 6 |
19 description("Test to make sure text-decoration property returns values properly.
") | 7 description("Test to make sure text-decoration property returns values properly.
") |
20 | 8 |
21 var testContainer = document.createElement("div"); | 9 var testContainer = document.createElement("div"); |
22 testContainer.contentEditable = true; | 10 testContainer.contentEditable = true; |
23 document.body.appendChild(testContainer); | 11 document.body.appendChild(testContainer); |
24 | 12 |
25 testContainer.innerHTML = '<div id="test">hello world</div>'; | 13 testContainer.innerHTML = '<div id="test">hello world</div>'; |
26 debug("Initial value:"); | 14 debug("Initial value:"); |
27 e = document.getElementById('test'); | 15 e = document.getElementById('test'); |
28 testElementStyle("textDecoration", "text-decoration", null, ''); | 16 testComputedStyle("textDecoration", "none solid rgb(0, 0, 0)"); |
29 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"none solid rgb(0, 0, 0)"); | |
30 debug(''); | 17 debug(''); |
31 | 18 |
32 debug("Initial value (explicit):"); | 19 debug("Initial value (explicit):"); |
33 e.style.textDecoration = 'initial'; | 20 e.style.textDecoration = 'initial'; |
34 testElementStyle("textDecoration", "text-decoration", null, ''); | 21 testComputedStyle("textDecoration", "none solid rgb(0, 0, 0)"); |
35 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"none solid rgb(0, 0, 0)"); | |
36 debug(''); | 22 debug(''); |
37 | 23 |
38 debug("Value 'none':"); | 24 debug("Value 'none':"); |
39 e.style.textDecoration = 'none'; | 25 e.style.textDecoration = 'none'; |
40 testElementStyle("textDecoration", "text-decoration", null, ''); | 26 testComputedStyle("textDecoration", "none solid rgb(0, 0, 0)"); |
41 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"none solid rgb(0, 0, 0)"); | |
42 debug(''); | 27 debug(''); |
43 | 28 |
44 debug("Value 'underline':"); | 29 debug("Value 'underline':"); |
45 e.style.textDecoration = 'underline'; | 30 e.style.textDecoration = 'underline'; |
46 testElementStyle("textDecoration", "text-decoration", null, ''); | 31 testComputedStyle("textDecoration", "underline solid rgb(0, 0, 0)"); |
47 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"underline solid rgb(0, 0, 0)"); | |
48 debug(''); | 32 debug(''); |
49 | 33 |
50 debug("Value 'overline':"); | 34 debug("Value 'overline':"); |
51 e.style.textDecoration = 'overline'; | 35 e.style.textDecoration = 'overline'; |
52 testElementStyle("textDecoration", "text-decoration", null, ''); | 36 testComputedStyle("textDecoration", "overline solid rgb(0, 0, 0)"); |
53 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"overline solid rgb(0, 0, 0)"); | |
54 debug(''); | 37 debug(''); |
55 | 38 |
56 debug("Value 'line-through':"); | 39 debug("Value 'line-through':"); |
57 e.style.textDecoration = 'line-through'; | 40 e.style.textDecoration = 'line-through'; |
58 testElementStyle("textDecoration", "text-decoration", null, ''); | 41 testComputedStyle("textDecoration", "line-through solid rgb(0, 0, 0)"); |
59 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"line-through solid rgb(0, 0, 0)"); | |
60 debug(''); | 42 debug(''); |
61 | 43 |
62 debug("Value 'underline overline line-through':"); | 44 debug("Value 'underline overline line-through':"); |
63 e.style.textDecoration = 'underline overline line-through'; | 45 e.style.textDecoration = 'underline overline line-through'; |
64 testElementStyle("textDecoration", "text-decoration", null, ''); | 46 testComputedStyle("textDecoration", "underline overline line-through solid rgb(0
, 0, 0)"); |
65 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"underline overline line-through solid rgb(0, 0, 0)"); | |
66 debug(''); | 47 debug(''); |
67 | 48 |
68 debug("Value 'blink' (valid but ignored):"); | 49 debug("Value 'blink' (valid but ignored):"); |
69 e.style.textDecoration = 'blink'; | 50 e.style.textDecoration = 'blink'; |
70 testElementStyle("textDecoration", "text-decoration", null, ''); | 51 testComputedStyle("textDecoration", "none solid rgb(0, 0, 0)"); |
71 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"none solid rgb(0, 0, 0)"); | |
72 debug(''); | 52 debug(''); |
73 | 53 |
74 debug("Value '':"); | 54 debug("Value '':"); |
75 e.style.textDecoration = ''; | 55 e.style.textDecoration = ''; |
76 testElementStyle("textDecoration", "text-decoration", null, ''); | 56 testComputedStyle("textDecoration", "none solid rgb(0, 0, 0)"); |
77 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"none solid rgb(0, 0, 0)"); | |
78 debug(''); | 57 debug(''); |
79 | 58 |
80 testContainer.innerHTML = '<div id="test-parent" style="text-decoration: underli
ne;">hello <span id="test-ancestor" style="text-decoration: inherit;">world</spa
n></div>'; | 59 testContainer.innerHTML = '<div id="test-parent" style="text-decoration: underli
ne;">hello <span id="test-ancestor" style="text-decoration: inherit;">world</spa
n></div>'; |
81 debug("Parent gets 'underline' value:"); | 60 debug("Parent gets 'underline' value:"); |
82 e = document.getElementById('test-parent'); | 61 e = document.getElementById('test-parent'); |
83 testElementStyle("textDecoration", "text-decoration", null, ''); | 62 testComputedStyle("textDecoration", "underline solid rgb(0, 0, 0)"); |
84 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"underline solid rgb(0, 0, 0)"); | |
85 debug(''); | 63 debug(''); |
86 | 64 |
87 debug("Ancestor should explicitly inherit value from parent when 'inherit' value
is used:"); | 65 debug("Ancestor should explicitly inherit value from parent when 'inherit' value
is used:"); |
88 e = document.getElementById('test-ancestor'); | 66 e = document.getElementById('test-ancestor'); |
89 testElementStyle("textDecoration", "text-decoration", null, ''); | 67 testComputedStyle("textDecoration", "underline solid rgb(0, 0, 0)"); |
90 testComputedStyle("textDecoration", "text-decoration", "[object CSSValueList]",
"underline solid rgb(0, 0, 0)"); | |
91 debug(''); | 68 debug(''); |
92 | 69 |
93 debug("Ancestor should not implicitly inherit value from parent (i.e. when value
is void):"); | 70 debug("Ancestor should not implicitly inherit value from parent (i.e. when value
is void):"); |
94 e.style.textDecoration = ''; | 71 e.style.textDecoration = ''; |
95 testElementStyle("textDecoration", "text-decoration", null, ''); | 72 testComputedStyle("textDecoration", "none"); |
96 testComputedStyle("textDecoration", "text-decoration", "[object CSSPrimitiveValu
e]", "none"); | |
97 debug(''); | 73 debug(''); |
98 | 74 |
99 document.body.removeChild(testContainer); | 75 document.body.removeChild(testContainer); |
OLD | NEW |